Toggle Button Style

[Lee]

Hi.

I want to use toggle button.

Button design is attached in file.

I try to find, but I don't find that.

Is it apply that?

[Kiril Vandov]

Hello Lee,

I looked at the picture you attached and I am not sure which one of the designs you want to implement. However you can modify the look of the RadToggleButton using a one of the following approaches:
1) You could you use a custom style for the RadToggleButton and reuse some of the VisualStates that you want to keep.
2) Another approach is to directly use the Content property of the Button and do the logic there, here is an example how you can do that:

<Window.Resources>
    <telerik:BooleanToOpacityConverter x:Key="converter" />
    <telerik:InvertedBooleanToOpacityConverter x:Key="invertedConverter" />
</Window.Resources>
<Grid>
    <telerik:RadToggleButton Width="200" Height="100" x:Name="xToggle">
        <StackPanel Orientation="Horizontal" Height="100" >
            <Grid Background="Red" Width="100" Opacity="{Binding ElementName=xToggle, Path=IsChecked ,Converter={StaticResource invertedConverter}}">
                <TextBlock Text="On" HorizontalAlignment="Center" VerticalAlignment="Center" />
            </Grid>
            <Grid Background="Blue" Grid.Column="1" Width="100" Opacity="{Binding ElementName=xToggle, Path=IsChecked ,Converter={StaticResource converter}}">
                <TextBlock Text="Off" HorizontalAlignment="Center" VerticalAlignment="Center"  />
            </Grid>
        </StackPanel>
    </telerik:RadToggleButton>
</Grid>

I hope this information helps.

Kind regards,
Kiril Vandov
Telerik

 

 

[Lee]

Thank you for your answer.

I think that example is utilized.

Thank you