Button Color

2 posts, 0 answers
  1. soni
    soni avatar
    1 posts
    Member since:
    Feb 2011

    Posted 22 Feb 2011 Link to this post

    Hi,

    I want to color each line of button with different color based on some condition.How can i achieve this.
    For example: say button width is 24,considering each line of button as 1 hour.If i want color first hour with red,3rd hour with orange how can i achieve this.

  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 25 Feb 2011 Link to this post

    Hi soni,

    In order to implement such scenario with the RadButtons, you will need to create 24 different background brushes - one for each hour. Then you can change the Background property accordingly to your conditions. For example:
    <UserControl.Resources>
        <LinearGradientBrush x:Key="24Background" StartPoint="0,0.5" EndPoint="1,0.5">
            <GradientStop Offset="0" Color="White" />
            <GradientStop Offset="0.084" Color="#FFFFEE00" />
            <GradientStop Offset="0.042" Color="#FFFF2900" />
            <GradientStop Offset="0.21" Color="#FF00FFAE" />
            <GradientStop Offset="0.121" Color="#FF6BFF00" />
            <GradientStop Offset="0.168" Color="#FF00FF39" />
            <GradientStop Offset="0.294" Color="#FF0039FF" />
            <GradientStop Offset="0.378" Color="#FF3C00FF" />
            <GradientStop Offset="0.462" Color="#FFA600FF" />
            <GradientStop Offset="0.546" Color="#FFFF009D" />
            <GradientStop Offset="0.63" Color="#FFFF0006" />
            <GradientStop Offset="0.714" Color="#FF194008" />
            <GradientStop Offset="0.756" Color="#FF11396F" />
            <GradientStop Offset="0.798" Color="#FF301365" />
            <GradientStop Offset="0.84" Color="#FF00FF45" />
            <GradientStop Offset="0.882" Color="#FFC0BB2F" />
            <GradientStop Offset="0.924" Color="#FF0F6D7C" />
            <GradientStop Offset="0.966" Color="#FF8C0E9D" />
            <GradientStop Offset="0.672" Color="#FF5E640F" />
            <GradientStop Offset="0.588" Color="#FFFF0063" />
            <GradientStop Offset="0.504" Color="#FFFF00EE" />
            <GradientStop Offset="0.42" Color="#FF5300FF" />
            <GradientStop Offset="0.336" Color="#FF0201FF" />
            <GradientStop Offset="0.252" Color="#FF00C5FF" />
            <GradientStop Offset="1" Color="#FF5E0808" />
        </LinearGradientBrush>
     
        <LinearGradientBrush x:Key="5thHour" StartPoint="0,0.5" EndPoint="1,0.5">
            <GradientStop Offset="0" Color="White" />
            <GradientStop Offset="0.084" Color="#FFFFEE00" />
            <GradientStop Offset="0.042" Color="#FFFF2900" />
            <GradientStop Offset="0.21" Color="White" />
            <GradientStop Offset="0.121" Color="#FF6BFF00" />
            <GradientStop Offset="0.168" Color="#FF00FF39" />
        </LinearGradientBrush>
    </UserControl.Resources>
    <StackPanel x:Name="LayoutRoot" Background="White">
        <telerik:RadButton x:Name="clockButton"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top"
                            Background="White"
                            Content="Button" />
    </StackPanel>

    private void 5thHour(object sender, RoutedEventArgs e)
    {
        clockButton.Background = this.Resources["5thHour"] as LinearGradientBrush;
    }
     
    private void 24thHour(object sender, RoutedEventArgs e)
    {
        clockButton.Background = this.Resources["24Background"] as LinearGradientBrush;
    }

    Greetings,
    Tina Stancheva
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top