Applying Actipro themes to a custom templated control

Hi,

I have exactly the same question, but for a simple Button.

I would like to override the Button to create a custom button, and I am using modern theme.

If I use the basic snippet from the avalonia stock Button control, and overrides it, it completely break all things.

The question is then, how can we get the "basic" controls and overrides them as we could do for the basic avalonia controls.

Thanks

Two different questions here, so I'll start with Matt's.

Matt, you might be happy to know that we've actually be working on a RangeSlider control as part of our Fundamentals product that will be released with v26.1.  Let us know if you'd like to test a preview build of that control once we get closer to release.

All Pro license customers have full access to our templates.  So while I'm not aware of an Avalonia way to easily pull a control template like you mentioned for WPF, you can download the full source of all our default styles and templates from the blue Actions button's menu on your organization account page. You can find the SliderThumb template at "\Source\Shared\Themes\Native\Slider.axaml".

If you don't want to redefine the template, you can also just apply the default template to your own Thumb implementation using our ControlTheme markup extension:

xmlns:actipro="http://schemas.actiprosoftware.com/avaloniaui"
...
<Thumb ... Theme="{actipro:ControlTheme SliderThumb}" />

More details on that extension can be found here.

Next...

Alves, your situation is a little different.  If you have your own theme for a derived class, you'll want to make sure your theme is "BasedOn" our theme to inherit all the default styles.  You can find more information on that here.

Thanks for the prompt response as always!

I have tried to apply your ControlTheme approach but without success - I am almost certainly doing it wrong. Would it be possible for a slightly more complete example please? I tried simply replacing my existing Thumb components within my template with the below but my thumbs turned into small orange circles.. is there another part I am missing?

thanks again!

<Thumb ... Theme="{actipro:ControlTheme SliderThumb}" />

The SliderThumb theme gets you the basics of the control template, but there are some additional properties set by our Slider native theme to complete the look.  I tried pasting the following into our Sample Browser and it matched the base appearance of our outling theme:

<Thumb Classes="horizontal" Theme="{actipro:ControlTheme SliderThumb}"
  BorderThickness="{actipro:ThemeResource SwitchBorderThickness}"
  Background="{actipro:ThemeResource SwitchBackgroundBrushOutline}"
  BorderBrush="{actipro:ThemeResource SwitchBorderBrushOutline}"
  Foreground="{actipro:ThemeResource SwitchForegroundBrushOutline}"
  />

If you look at the source for the Slider control template, you'll see there are also some styles that change the brushes for various events like pressed or disabled that you might want to copy into your solution as well.

Thasnk again! I have it working (after a fashion) but am also very much looking forward to your own implementation of a range slider (a very useful control) and yes, would be very keen to see early releases if possible - let me know how.

thanks,

Matt

Glad you got it working.  I've added a note about your interest in previewing the RangeSlider, and we can reach out closer to availability.