WPF控件庫:文字按鈕的封裝

需求:封裝按鈕,按鈕上面只顯示文字。在鼠標移上去、鼠標點擊按鈕、以及將按鈕設爲不可用時按鈕的背景色和前景色須要發生變化html

實現:繼承Button類,封裝以下6個屬性:函數

#region 依賴屬性
/// <summary>
/// 當鼠標移到按鈕上時,按鈕的前景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty MouserOverForegroundProperty =
    DependencyProperty.Register ( "MouserOverForeground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.Black ) );

/// <summary>
/// 鼠標移到按鈕上時,按鈕的背景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty MouseOverBackgroundProperty =
    DependencyProperty.Register ( "MouseOverBackground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.White ) );

/// <summary>
/// 當鼠標按下時,按鈕的前景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty MousedownForegroundProperty =
    DependencyProperty.Register ( "MousedownForeground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.Black ) );

/// <summary>
/// 當鼠標按下時,按鈕的背景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty MousedownBackgroundProperty =
    DependencyProperty.Register ( "MousedownBackground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.White ) );

/// <summary>
/// 當按鈕不可用時,按鈕的前景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty DisabledForegroundProperty =
    DependencyProperty.Register ( " DisabledForeground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.Black ) );

/// <summary>
/// 當按鈕不可用時,按鈕的背景色(這是依賴屬性)
/// </summary>
public static readonly DependencyProperty DisabledBackgroundProperty =
    DependencyProperty.Register ( "DisabledBackground", typeof ( Brush ), typeof ( TextButton ), new PropertyMetadata ( Brushes.White ) );
#endregion

而後更改按鈕的樣式,樣式封裝在資源字典中:測試

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:Zmy.Wpf.Controls">
    <Style x:Key="TextButtonStyle" TargetType="{x:Type local:TextButton}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:TextButton}">
                    <Border x:Name="buttonBorder"
                            Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding Foreground}">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource Self}, Path=MouserOverForeground}"/>
                <Setter Property="Background" Value="{Binding RelativeSource={RelativeSource Self}, Path=MouseOverBackground}"/>
            </Trigger>

            <Trigger Property="IsPressed" Value="True">
                <Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource Self}, Path=MousedownForeground}"/>
                <Setter Property="Background" Value="{Binding RelativeSource={RelativeSource Self}, Path=MousedownBackground}"/>
            </Trigger>

            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource Self}, Path=DisabledForeground}"/>
                <Setter Property="Background" Value="{Binding RelativeSource={RelativeSource Self}, Path=DisabledBackground}"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>

而後在TextButton的構造函數中設置按鈕的樣式:this

#region 構造函數
public TextButton() : base()
{
    //獲取資源文件信息
    ResourceDictionary rd = new ResourceDictionary();
    rd.Source = new Uri ( "/Zmy.Wpf.Controls;component/Style.xaml", UriKind.Relative );
    this.Resources.MergedDictionaries.Add ( rd );
    //設置樣式
    this.Style = this.FindResource ( "TextButtonStyle" ) as Style;
}
#endregion

這樣整個文字按鈕就封裝好了,調用起來很是簡單:spa

        <controls:TextButton Content="測試按鈕" Width="300" Height="50"
                             MouserOverForeground="Yellow" MouseOverBackground="Blue" MousedownBackground="Green" MousedownForeground="Blue"/>

        <controls:TextButton Content="測試按鈕" Width="300" Height="50" IsEnabled="False"
                             DisabledForeground="Yellow" DisabledBackground="Blue" Margin="0,100,0,0"/>

 

 源代碼下載:http://download.csdn.net/detail/lyclovezmy/7356125.net

不要積分。code

對應的圖片按鈕封裝:http://www.cnblogs.com/DoNetCoder/p/3732310.htmlcomponent

相關文章
相關標籤/搜索