WPF三角形、圆形按钮

例子简单,代码更简单。
< Window
    xmlns
= " http://schemas.microsoft.com/winfx/2006/xaml/presentation "
    xmlns:x
= " http://schemas.microsoft.com/winfx/2006/xaml "
    x:Class
= " Custom_Button.Window1 "
    x:Name
= " Window "
    Title
= " 圆形按钮 "
    Width
= " 600 "  Height = " 480 " >

    
< Grid x:Name = " LayoutRoot " >

        
< Grid.RowDefinitions >
            
< RowDefinition />
        
</ Grid.RowDefinitions >

        
< Button Grid.Column = " 0 "  Grid.Row = " 0 "  Height = " 400 "  Width = " 400 "  HorizontalAlignment = " Left "  VerticalAlignment = " Top "  Content = " Button "  Template = " {DynamicResource ButtonControlTemplate1} "  Cursor = " Hand " >
            
< Button.Resources >
                
< ControlTemplate x:Key = " ButtonControlTemplate1 "  TargetType = " {x:Type Button} " >
                    
< Grid >
                        
< Ellipse x:Name = " ButtonEllipse "  Width = " Auto "  Height = " Auto "  StrokeThickness = " 4 "  Fill = " White "  Stroke = " Gray " ></ Ellipse >
                        
< Polygon x:Name = " ButtonPolygon "  Points = " 20,200 300,50 300,350 "  Stroke = " White "  StrokeThickness = " 2 " >
                            
< Polygon.Fill >
                                
< SolidColorBrush Color = " Gray "  Opacity = " 0.4 " />
                            
</ Polygon.Fill >
                        
</ Polygon >
                    
</ Grid >
                    
< ControlTemplate.Triggers >
                        
< Trigger Property = " IsMouseOver "  Value = " True " >
                            
< Setter TargetName = " ButtonPolygon "  Property = " Fill "  Value = " Black " ></ Setter >
                        
</ Trigger >
                        
< Trigger Property = " IsPressed "  Value = " True " >
                            
< Setter TargetName = " ButtonPolygon "  Property = " Fill "  Value = " Gray " />
                        
</ Trigger >
                    
</ ControlTemplate.Triggers >
                
</ ControlTemplate >
            
</ Button.Resources >
        
</ Button >
    
</ Grid >
</ Window >




修改后三角形自动放大



    <Grid x:Name="LayoutRoot">

        <Grid.RowDefinitions>
            <RowDefinition/>
        </Grid.RowDefinitions>

        

        <Button Width="305" HorizontalAlignment="Left" Content="Button1" Template="{DynamicResource ButtonControlTemplate1}" Cursor="Hand" Margin="52,45,0,142" Click="Button_Click_1">
            <Button.Resources>
                <ControlTemplate x:Key="ButtonControlTemplate1" TargetType="{x:Type Button}">
                    <Grid>
                        <Ellipse x:Name="ButtonEllipse" Width="Auto" Height="Auto" StrokeThickness="4" Fill="White" Stroke="Gray"></Ellipse>
                        <Polygon x:Name="ButtonPolygon" Stretch="Fill" Points="0,50 100,0 100,100" Stroke="White" StrokeThickness="2">
                            <Polygon.Fill>
                                <SolidColorBrush Color="Gray" Opacity="0.4"/>
                            </Polygon.Fill>
                        </Polygon>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="ButtonPolygon" Property="Fill" Value="Black"></Setter>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter TargetName="ButtonPolygon" Property="Fill" Value="Gray"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Button.Resources>
        </Button>
    </Grid>



自定义控件上使用代创建

xaml:

<UserControl x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="439" d:DesignWidth="437" Loaded="UserControl_Loaded">
    
    <UserControl.Resources>
        <ControlTemplate x:Key="ButtonControlTemplate1" TargetType="{x:Type Button}">
            <Grid>
                <Polygon x:Name="ButtonPolygon" Stretch="Fill" Points="0,50 100,0 100,100" Stroke="White" StrokeThickness="2">
                    <Polygon.Fill>
                        <SolidColorBrush Color="Gray" Opacity="0.4"/>
                    </Polygon.Fill>
                </Polygon>
            </Grid>
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter TargetName="ButtonPolygon" Property="Fill" Value="Black"></Setter>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter TargetName="ButtonPolygon" Property="Fill" Value="red"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </UserControl.Resources>
    
    
</UserControl>

code:

    public partial class UserControl1 : UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
        }

        private void UserControl_Loaded(object sender, RoutedEventArgs e)
        {
            Button button1 = new Button();
            this.AddChild(button1);
            button1.Template = (ControlTemplate)(this.Resources["ButtonControlTemplate1"]);
            button1.Click += button1_Click;
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("sss");
        }


    }

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是使用C# WPF实现圆形进度条的代码示例: ```csharp <Window x:Class="CircularProgressBar.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Circular Progress Bar" Height="350" Width="350"> <Grid> <Ellipse Width="100" Height="100" Stroke="Gray" StrokeThickness="10"> <Ellipse.Clip> <EllipseGeometry Center="50,50" RadiusX="45" RadiusY="45"/> </Ellipse.Clip> </Ellipse> <Path x:Name="progressIndicator" Stroke="Blue" StrokeThickness="10"> <Path.Data> <PathGeometry> <PathFigure x:Name="progressFigure" StartPoint="50,5"> <ArcSegment x:Name="progressArc" Point="50,5" Size="45,45" SweepDirection="Clockwise"/> </PathFigure> </PathGeometry> </Path.Data> </Path> </Grid> </Window> ``` 在代码中,我们使用了一个`Ellipse`元素来绘制圆形进度条的背景,使用`Path`元素来绘制进度条的前景。`Path`元素中的`PathFigure`和`ArcSegment`元素用于绘制圆弧。 接下来,我们需要在C#代码中实现进度条的动态效果。我们可以使用`Storyboard`和`DoubleAnimation`来实现进度条的动态效果。以下是C#代码示例: ```csharp public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); Loaded += MainWindow_Loaded; } private void MainWindow_Loaded(object sender, RoutedEventArgs e) { var storyboard = new Storyboard(); var animation = new DoubleAnimation(0, 360, new Duration(TimeSpan.FromSeconds(5))); Storyboard.SetTarget(animation, progressArc); Storyboard.SetTargetProperty(animation, new PropertyPath(ArcSegment.EndAngleProperty)); storyboard.Children.Add(animation); storyboard.Begin(); } } ``` 在代码中,我们创建了一个`Storyboard`对象,并使用`DoubleAnimation`来实现进度条的动态效果。`Storyboard.SetTarget`和`Storyboard.SetTargetProperty`方法用于将动画应用到`progressArc`元素的`EndAngle`属性上。最后,我们调用`storyboard.Begin()`方法来启动动画。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值