Uploaded February 2020 | Updated September 2026, 3 weeks ago
Support me in my journey to giving back to the industry all my knowledge and helping the world with what I do. Spreading knowledge to those who cannot afford an education, and helping those who want to better themselves.
Support what I do and pay for me to survive
angelsix.com/donate
Merchandise
teespring.com/stores/angelsix
My Setup & Recommendations
amazon.co.uk/shop/angelsix
Live Chat at Discord
discordapp.com/invite/eHr5BMk
Source Code
github.com/angelsix/course-csharp-mastery
Support me in my journey to giving back to the industry all my knowledge and helping the world with what I do. Spreading knowledge to those who cannot afford an education, and helping those who want to better themselves.
Support what I do and pay for me to survive
angelsix.com/donate
Merchandise
teespring.com/stores/angelsix
My Setup & Recommendations
amazon.co.uk/shop/angelsix
Live Chat at Discord
discordapp.com/invite/eHr5BMk
Source Code
github.com/angelsix/course-csharp-mastery



![Avalonia UI Deep Dive: Button Spinner XAML Anatomy
Dissecting the Avalonia Button Spinner control from the inside out — no AI shortcuts, just real hand-coded understanding. Before we style it, we need to know exactly how its built. In this episode we crack open the full XAML control theme and examine every piece.
This is part of a complete series on building a fully custom Avalonia UI theme from scratch, hand-coded with zero AI assistance.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📌 WHAT YOULL LEARN
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
• How the Button Spinner control theme is structured in XAML
• What the Margin Multiplier Converter does and why its needed
• How Stream Geometry draws the up/down arrow icons as Path Icons
• How Repeat Buttons are embedded and their default template overridden
• The role of Data Validation Errors in the control template
• How pseudo-classes (:left, :error) drive state-based layout changes
• The full DockPanel, Content Presenter and Stack Panel layout explained
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⏱ TIMESTAMPS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[0:00] – Introduction & series recap
[0:46] – Upgrade to Avalonia 12 & prototype UI philosophy
[1:48] – Controls overview & choosing the Button Spinner
[2:48] – Avalonia control structure: resource dictionary & design preview
[4:27] – Button Spinner control theme & Repeat Button target types
[5:35] – Margin Multiplier Converter & border thickness
[8:47] – Stream Geometry for up/down arrow icons
[10:57] – Repeat Button template & overriding default visuals
[13:29] – Main Button Spinner control template structure
[14:17] – Pseudo-class selectors: :left layout & :error styling
[15:20] – Data Validation Errors wrapper explained
[16:52] – Core layout: Border, DockPanel, Content Presenter & Repeat Buttons
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
🔗 LINKS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
▶ Part 1 – Setup: https://www.youtube.com/watch?v=rUKlQnjU0tc
▶ Part 2 – Buttons: https://www.youtube.com/watch?v=oKjk6pyyARI
💾 Source Code: https://github.com/angelsix/youtube/tree/develop/AvaloniaThemeLab
🌐 AngelSix: https://www.angelsix.com
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📺 SERIES: Avalonia UI Theming – Hand Coded From Scratch
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
#avalonia #avaloniaui #xaml #csharp #dotnet #uiux #desktopapp #softwaretutorial #coding Avalonia UI Deep Dive: Button Spinner XAML Anatomy](https://i.ytimg.com/vi/WMaTbXkvm9g/mqdefault.jpg)






