XAML Button Control

In this article, I will discuss XAML button control.
  • 2316

Introduction

In this article, I will discuss XAML button control. After reading this article, you will learn how to create a button control using XAML as well as creating a button control dynamically using C# language. I will also discuss how to set button properties and write button event handlers.

Creating a Button using XAML

The following code snippet shows how to create a button control in XAML.

<Button ID="DrawCircleButton" Height="30" Width="100">

    Click
 

</Button>

The output looks like Figure 1.

 ButtonImg1.gif

Figure 1. A button control

Button Properties

You can also create a button control dynamically by creating the Button class inatance and setting its properties in the code itself. The following code snippet shows how to create a button and add a button click event handler dynamically using C#.

Adding Event Handlers

You can also create a button control dynamically by creating the Button class inatance and setting its properties in the code itself. The following code snippet shows how to create a button and add a button click event handler dynamically using C#.

<Window x:Class="MyFirstAvalonApp.Window1"

    xmlns="http://schemas.microsoft.com/2003/xaml" xmlns:x="Definition"

    Text="MyFirstAvalonApp">

   

    <DockPanel Height="50" Width="200">

        <Button ID="DrawCircleButton" Height="30" Width="100"

            Click="ExecuteThisMethodWhenButtonIsClicked">Click

        </Button>

    </DockPanel>    

   

    <x:Code>

        <![CDATA[

         

            void ExecuteThisMethodWhenButtonIsClicked(object sender, EventArgs e)

            {

                DrawCircleButton.Background = Brushes.Green;

                MessageBox.Show("ExecuteThisMethodWhenButtonIsClicked executed");

            }

        ]]>

       </x:Code>

   

</Window>

 

Creating a Button with an Image

You can use the <Image /> element to load an image in a button control. The Source property of Image sets the image. The following code creates a button with an image.

<Button Height="50" Width="60">  
 <Image Source="C:\butterfly.jpg"/>
</Button>

The output looks like Figure 2.

 ButtonImg2.gif

Figure 2. A button control with an image

Summary

In this article, I discussed how to create a Button in XAML and write a button click event handler. I also discussed how to create a button with an image. 

Further Readings
 
You may also want to read these related articles.
Ask Your Question 
 
Got a programming related question? You may want to post your question here
 
© 2013 dotNetheaven. All rights reserved.