Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to wire up a click event for a custom usercontrol button? Should I use CustomControl?

I wanted to create a button that had an image and a textblock as content. So I went about looking for an answer and found a post (Reusable Custom Content for Buttons) which told me to create a usercontrol.

I did this and it works great. I can set the image source and text through dependency properties. However, I am stuck as there is no click event for my control.

I did a little more digging and concluded that I probably need a CustomControl derived from Button. Is this correct? Or would it be better to wire up a click event to my UserControl?

Here's my UserControl:

<UserControl x:Class="Client.Usercontrols.MyButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" MinHeight="30" MinWidth="40"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">

    <Button Width="Auto" HorizontalAlignment="Center">
        <Border CornerRadius="5" BorderThickness="1" BorderBrush="Transparent" >
            <Grid>
                <Image Name="tehImage" Source="{Binding ImageSource}" />
                <TextBlock Name="tehText" Text="{Binding Text}"
                           Style="{DynamicResource ButtonText}" />
            </Grid>
        </Border>
    </Button>
</UserControl>

Implementation

<my:MyButton ImageSource="../Images/MainSyncButton.png" ImageWidth="141" Text="Synchronise" Click="btnSynchronise_Click" />
like image 964
4imble Avatar asked Oct 19 '09 16:10

4imble


2 Answers

The easiest option would be to just make your UserControl expose a click event, and pass through your Button's click event.

In MyButton's xaml:

<Button Width="Auto" HorizontalAlignment="Center" Click="onButtonClick">

In MyButton's code:

public event RoutedEventHandler Click;

void onButtonClick(object sender, RoutedEventArgs e)
{
    if (this.Click != null)
    {
        this.Click(this, e);
    }
}

You can then leave your "implementation" code as-is.

like image 94
Reed Copsey Avatar answered Oct 21 '22 17:10

Reed Copsey


The answer really depends on what your goals are for the control. You may be able to get away with not creating a user or custom control if you can manipulate the data that you are binding to. If all you want to do is display a dynamic image and text, then you could create an ImageText object that contains two properties. You could then bind the default Button control's Content property to this object and use a DataTemplate to define the layout of the content.

If you cannot control the data type that you are binding to, or if you're really set on the idea of creating a control then I would recommend creating a custom control. Custom controls allow you to utilize the built-in capabilities of a standard button. Generally you would only want to create a User Control if you wanted to hide or encapsulate the default functionality of the visual controls contained within the control.

Good luck.

like image 45
Tony Borres Avatar answered Oct 21 '22 16:10

Tony Borres