avalonia-controls-media

Configure Avalonia media content with images, video, and WebView.

27|2|Updated Apr 23, 2026
One-click install
npx skills add https://github.com/linuxdevel/Avalonia-skills --skill avalonia-controls-media
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: avalonia-controls-media
Source: https://github.com/linuxdevel/Avalonia-skills/tree/main/skills/avalonia/avalonia-controls/media
Command: npx skills add https://github.com/linuxdevel/Avalonia-skills --skill avalonia-controls-media

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps developers implement and configure Avalonia media content, enabling consistent image rendering, vector icons, video playback, and embedded web views across Avalonia applications.

Core Features & Use Cases

  • Image and DrawingImage support with asset loading using avares URIs.
  • PathIcon for scalable icons; Foreground controls color.
  • MediaPlayerControl via LibVLCSharp for video playback.
  • WebView integration for embedding web content.
  • AXAML and code-behind binding best practices; asset loading and performance notes.

Quick Start

Create a simple Avalonia UI with an Image loaded from assets, a PathIcon icon, and a WebView displaying a URL.

Frequently Asked Questions about avalonia-controls-media

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I load and display images in Avalonia using avares URIs?

To load and display images in Avalonia, use avares URIs to reference assets, binding them to the Image control via AXAML or code-behind for proper raster and vector rendering. This ensures consistent asset loading across the application.

How do I set up video playback in an Avalonia application?

Video playback in Avalonia is set up using LibVLCSharp with the MediaPlayerControl. You must configure the media player properties correctly in AXAML or code-behind to ensure video renders and avoids common playback pitfalls.

How do I use PathIcon for scalable vector icons in AXAML?

PathIcon provides scalable vector icons in Avalonia. You define it in AXAML and control its color using the Foreground property, allowing dynamic icon styling that adapts to application themes without losing resolution.

Can I embed web content inside an Avalonia application?

Yes, you can embed web content in Avalonia using the WebView control. It requires configuring specific properties to load URLs and display web pages directly within your desktop application UI seamlessly.

Why are my Avalonia media assets not loading or displaying correctly?

Avalonia media assets often fail to load due to incorrect avares URI formatting or missing asset build configurations. Ensure assets are properly embedded and referenced in AXAML to avoid common rendering pitfalls.

What is the best way to bind media controls in Avalonia code-behind?

The best way to bind Avalonia media controls is using established AXAML data binding patterns combined with code-behind for event handling. This approach ensures proper asset loading and responsive media playback setup.