Posted by: Zeeshan Amjad | May 12, 2011

Using C# code to apply style


I came across a question that how can we apply the style defined in XAML on any control. Let’s take a look at the style first. Here is a style we define in XAML.

Code Snippet
<Style x:Key="myButtonStyle" TargetType="Button">
    <Setter Property="Margin" Value="5"/>
    <Setter Property="Background" Value="Wheat"/>
    <Setter Property="FontSize" Value="18"/>
</Style>

 

Suppose we define few button control in Stack Panel and we want to change the style of button when user click it. Here is a code to define 4 button in Stack Panel.

Code Snippet
<StackPanel>
    <Button>Button 1</Button>
    <Button>Button 2</Button>
    <Button>Button 3</Button>
    <Button>Button 4</Button>
</StackPanel>

 

Because we are going to call the same method on all the button, therefore it perfectly make sense to use the EventSetter  here. We are going to define one more style which set the EventSetter property. Here is a XAML code for our other style. Note that we didn’t specify its name, therefore it is going to apply on all the button controls.

Code Snippet
<Style TargetType="Button">
    <EventSetter Event="Click" Handler="btnClick"/>
</Style>

 

If our event handler code, we simply search the resource by style name and set the button Style property to that. Here is a C# code to demonstrate this.

Code Snippet
void btnClick(object sender, RoutedEventArgs e)
{
    if (sender as Button != null)
    {
        if (FindResource("myButtonStyle") as Style != null)
        {
            ((Button)sender).Style = FindResource("myButtonStyle") as Style;
        }
    }
}

 

Here is complete XAML code of the program.

Code Snippet
<Window x:Class="WpfStyle.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml&quot;
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="Button">
            <EventSetter Event="Click" Handler="btnClick"/>
        </Style>
        <Style x:Key="myButtonStyle" TargetType="Button">
            <Setter Property="Margin" Value="5"/>
            <Setter Property="Background" Value="Wheat"/>
            <Setter Property="FontSize" Value="18"/>
        </Style>
    </Window.Resources>
    <StackPanel>
        <Button>Button 1</Button>
        <Button>Button 2</Button>
        <Button>Button 3</Button>
        <Button>Button 4</Button>
    </StackPanel>
</Window>

 

And here is complete C# code of the program.

Code Snippet
using System.Windows;
using System.Windows.Controls;

namespace WpfStyle
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        void btnClick(object sender, RoutedEventArgs e)
        {
            if (sender as Button != null)
            {
                if (FindResource("myButtonStyle") as Style != null)
                {
                    ((Button)sender).Style = FindResource("myButtonStyle") as Style;
                }
            }
        }
    }
}

 

Here is the output of the program, when user click third and fourth button.

StyleCodeOutput

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Categories

%d bloggers like this: