How can I custom a button derived telerik button.

1 Answer 115 Views
Button
Allen
Top achievements
Rank 1
Iron
Iron
Allen asked on 22 Apr 2022, 05:52 AM

Hey Team,

I just want to know How can I custom a button derived  from telerik button? 

I want to use style to control different state. It should have front xaml and code behind for handling events or commands.

Do you have any suggestion?

Thanks

1 Answer, 1 is accepted

Sort by
0
Lance | Senior Manager Technical Support
Telerik team
answered on 22 Apr 2022, 12:42 PM

Hello Allen,

This would be no different than deriving from a MAUI Button, it is literally identical to any other MAUI control you want to use as your base class and there are no special considerations just because it is a Telerik control. In fact, RadButton itself inherits from MAUI Button.

You can use the techniques of any training that you've done for vanilla SDK controls on the RadButton. The Telerik forums and Support do not provide training for this, so I cannot point you to any of our resources, but you will be able to find these types of resources with a Google/Bing search.

Although we don't have any training to share with you, I can provide a high level explanation of the two main approaches.

Deriving

public partial class MyButton : RadButton
{
}

However, to your desire of implementing your own XAML to override ours, this is a different story. You could have a style that bases off ours, but you cannot replace it.

<Style TargetType="MyButton" BasedOn="RadButtonStyle" >

Note: Please be aware that once you  make a custom control that inherits from our control, Telerik can no longer provide support for that custom control. We can help with any built-in features of the Rad control, but anything you put on top of it would be your responsibility as that code was not designed, developed and QA tested by us.

Recommendation - ContentView

Instead, I suggest that you create your own custom ContentView that has a RadButton in it. That way you can have your own custom dependency properties and other XAML

<ContentView ....>
    <Grid>
        <RadButton x:Name="PART_Button" .../>
    <Grid>
</ContentView>

public partial class MyButton : ContentView
{
    public MyButton()
    {
        InitializeComponent();
    }

    public void YourPublicMethod()
    {
        // you can alter the RadButton state because you have access to 
        PART_Button.Whatever = Whatever;
    }
}

as you can see, it is similar to using a RadButton in a ContentPage. You can expose any number of public methods, commands, BindableProperties and interact with PART_Button in a normal way.

As a real-world example, take a look at this custom SegmentedControl I built using RadButton and RadBorder => https://github.com/LanceMcCarthy/CustomXamarinDemos/tree/main/src/SegmentedCustomControl (although it is in a Xamarin.Forms project, the concept is the same for MAUI)

Further Assistance

If you need more help with this, I recommend opening a new post on the resources listed below. Just make sure you ask for help with "Button" instead of "Telerik RadButton". This is so you can avoid unnecessarily getting redirected back to  our forums because you asked for help with a 3rd party control. In reality, you're asking for help with general control inheritance and styling. 

Any answer you get can be used with the RadButton directly (just change the Button class to RadButton and it will work).

Regards,
Lance | Manager Technical Support
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Allen
Top achievements
Rank 1
Iron
Iron
commented on 23 Apr 2022, 02:58 PM

Hey Lance, Thanks for your detail explaining, I see. I will try your recommendation. 
Tags
Button
Asked by
Allen
Top achievements
Rank 1
Iron
Iron
Answers by
Lance | Senior Manager Technical Support
Telerik team
Share this question
or