WPF—如何自定义Button外形

最新推荐文章于 2024-03-28 20:02:35 发布

------------`

最新推荐文章于 2024-03-28 20:02:35 发布

阅读量635

点赞数

文章标签： wpf c#

本文链接：https://blog.csdn.net/qq_44920920/article/details/131457313

版权

自定义button（按钮）外形
更改button的style样式
我这里使用的标签是Polygon，设置points值来达到自己需要的图形。
以下为样式测试案例

// 在windows.Resources 标签中设置样式
// XAML代码
    <Window.Resources>
       <Style x:Key="ArrowButtonStyle" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Polygon x:Name="border" Fill="{TemplateBinding Background}" MouseDown="border_MouseDown"
                        Points="361.32,201.5 473.74,201.5 490,224.5 474.45,246.5 361.32,246.5 344,222" Stroke="Black" StrokeThickness="2"
                        SnapsToDevicePixels="True"
                        Stretch="Uniform">
                        </Polygon>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="border" Property="Fill" Value="gray"/>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="border" Property="Fill" Value="red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            //阴影效果
            <Setter Property="Effect">
                <Setter.Value>
                    <DropShadowEffect Color="Gray"  Direction="315" ShadowDepth="10" Opacity="10"/>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

XAML 代码
由于Polygon 内部没有显示文字的属性，需要使用grid将button和label包括起来
，

 <Grid Grid.Row="1">
            <Button  Click="btnName_Click"  Style="{StaticResource ArrowButtonStyle}"   x:Name="btnName" Width="100" Height="30"> 
            </Button>
            <Label Content="3113" Background="Transparent" BorderThickness="0" MouseLeftButtonDown="Label_MouseLeftButtonDown"  MouseEnter="lblClose_MouseEnter" MouseLeave="lblClose_MouseLeave" />
        </Grid>

C#代码

  //button点击事件
        private void btnName_Click(object sender, RoutedEventArgs e)
        {
            Label_MouseLeftButtonDown(null,null);
        }
        //鼠标离开label发生
        //label事件用于同步button样式
        private void lblClose_MouseLeave(object sender, MouseEventArgs e)
        {
            btnName.Background = new SolidColorBrush(System.Windows.Media.Color.FromRgb(255, 255, 255));
        }
        //鼠标进入label发生
        private void lblClose_MouseEnter(object sender, MouseEventArgs e)
        {
            btnName.Background = new SolidColorBrush(System.Windows.Media.Color.FromRgb(1, 1, 1));
        }
           //鼠标点击label发生
        private void Label_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {

        }