Uploaded June 2026 | Updated September 2026, 3 weeks ago
Your Avalonia styles write correctly, apply cleanly — and do absolutely nothing. No error.
No warning. Just silence. This is what happens when one rule gets broken inside a Control
Template, and it took a deep dive into Avalonia's full binding precedence order to understand
why.
In this episode we're finishing the Button Spinner styling — but the real story is discovering
that a single Binding inside the default control template was silently blocking every style
override we tried to write. We dig into the full priority order, document it properly, and
rebuild the Button Spinner cleanly from there.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📌 WHAT YOU'LL LEARN
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
• Avalonia's full binding precedence order — Animation → Local Value → Style Trigger →
TemplateBinding → Style Setter → Inherited → Default
• The rule you must never break inside a Control Template — and what silently breaks when
you do
• Why using a regular Binding inside a Control Template blocks all style overrides forever
• How to fix it: moving the offending property to a Style Setter instead
• Cleaning up duplicate stream geometries — replacing two separate paths with a single arrow
and RenderTransform
• Removing all hardcoded MinWidth, padding, and icon sizes — wiring everything through the
token system
• A new binding priority reference document, available on GitHub
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⏱ TIMESTAMPS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[0:00] – Introduction & series progress overview
[3:00] – Reviewing the Button Spinner control template
[7:02] – Cleaning up the Repeat Button control theme
[10:39] – Margin Multiplier Converter & Stream Geometry tasks
[14:36] – Removing the unnecessary control theme
[17:25] – The rule you must never break inside a Control Template
[18:00] – Avalonia's binding precedence order, explained
[19:31] – The binding priority reference document
[22:52] – Reviewing the cleaned-up styles
[24:57] – Final cleanup: padding, paths, and icon sizing
[29:48] – Wrap-up
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
🔗 LINKS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
▶ Ep 1 – Setup: youtube.com/watch?v=rUKlQnjU0tc
▶ Ep 2 – Buttons: youtube.com/watch?v=oKjk6pyyARI
▶ Ep 3 – Button Spinner Anatomy: youtube.com/watch?v=WMaTbXkvm9g
▶ Ep 4 – Designing a Theme System: youtube.com/watch?v=I5halHoNfH0
▶ Ep 5 – Checkbox Deep Dive: youtube.com/watch?v=uIimnwjITT0
▶ Ep 6 – Checkbox Styling: youtube.com/watch?v=uv1bNrfCjtY
▶ Ep 7 – Theme Engine From Scratch: youtube.com/watch?v=NXz8hwITg5U
▶ Ep 8 – Design Token System: youtube.com/watch?v=QMVdxRZqaU8
▶ Ep 9 – Surgical Legacy Code Removal: youtube.com/watch?v=5-p_fnOi0As
▶ Ep 10 – One Token System: youtube.com/watch?v=JEcD1XXIiA8
📺 Full Series Playlist: youtube.com/playlist?list=PLrW43fNmjaQVE2vDBeWD8QYIm06w6bKyO
💾 Source Code & Binding Priority Doc: github.com/angelsix/youtube/tree/develop/AvaloniaThemeLab
🌐 AngelSix: angelsix.com
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📺 SERIES: Avalonia UI Theming – Hand Coded From Scratch
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
#avalonia #avaloniaui #xaml #csharp #dotnet #uiux #desktopapp #softwaretutorial #coding
Your Avalonia styles write correctly, apply cleanly — and do absolutely nothing. No error.
No warning. Just silence. This is what happens when one rule gets broken inside a Control
Template, and it took a deep dive into Avalonia's full binding precedence order to understand
why.
In this episode we're finishing the Button Spinner styling — but the real story is discovering
that a single Binding inside the default control template was silently blocking every style
override we tried to write. We dig into the full priority order, document it properly, and
rebuild the Button Spinner cleanly from there.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📌 WHAT YOU'LL LEARN
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
• Avalonia's full binding precedence order — Animation → Local Value → Style Trigger →
TemplateBinding → Style Setter → Inherited → Default
• The rule you must never break inside a Control Template — and what silently breaks when
you do
• Why using a regular Binding inside a Control Template blocks all style overrides forever
• How to fix it: moving the offending property to a Style Setter instead
• Cleaning up duplicate stream geometries — replacing two separate paths with a single arrow
and RenderTransform
• Removing all hardcoded MinWidth, padding, and icon sizes — wiring everything through the
token system
• A new binding priority reference document, available on GitHub
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⏱ TIMESTAMPS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[0:00] – Introduction & series progress overview
[3:00] – Reviewing the Button Spinner control template
[7:02] – Cleaning up the Repeat Button control theme
[10:39] – Margin Multiplier Converter & Stream Geometry tasks
[14:36] – Removing the unnecessary control theme
[17:25] – The rule you must never break inside a Control Template
[18:00] – Avalonia's binding precedence order, explained
[19:31] – The binding priority reference document
[22:52] – Reviewing the cleaned-up styles
[24:57] – Final cleanup: padding, paths, and icon sizing
[29:48] – Wrap-up
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
🔗 LINKS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
▶ Ep 1 – Setup: youtube.com/watch?v=rUKlQnjU0tc
▶ Ep 2 – Buttons: youtube.com/watch?v=oKjk6pyyARI
▶ Ep 3 – Button Spinner Anatomy: youtube.com/watch?v=WMaTbXkvm9g
▶ Ep 4 – Designing a Theme System: youtube.com/watch?v=I5halHoNfH0
▶ Ep 5 – Checkbox Deep Dive: youtube.com/watch?v=uIimnwjITT0
▶ Ep 6 – Checkbox Styling: youtube.com/watch?v=uv1bNrfCjtY
▶ Ep 7 – Theme Engine From Scratch: youtube.com/watch?v=NXz8hwITg5U
▶ Ep 8 – Design Token System: youtube.com/watch?v=QMVdxRZqaU8
▶ Ep 9 – Surgical Legacy Code Removal: youtube.com/watch?v=5-p_fnOi0As
▶ Ep 10 – One Token System: youtube.com/watch?v=JEcD1XXIiA8
📺 Full Series Playlist: youtube.com/playlist?list=PLrW43fNmjaQVE2vDBeWD8QYIm06w6bKyO
💾 Source Code & Binding Priority Doc: github.com/angelsix/youtube/tree/develop/AvaloniaThemeLab
🌐 AngelSix: angelsix.com
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📺 SERIES: Avalonia UI Theming – Hand Coded From Scratch
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
#avalonia #avaloniaui #xaml #csharp #dotnet #uiux #desktopapp #softwaretutorial #coding
