WPF 圆内带扇形按钮怎么做？

2019-04-08 10:57:01 1.2k 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

WPF绘制柱状图，折线图，扇形图 1.绘制需引入外部插件WPFVisifire.Charts插件 2.首先来三个button按钮 <Canvas> <Button Content="柱状图" Name="ButColumn" HorizontalAlignment="Left" Margin="10,59,0,0" VerticalAlignment="Top" Width="75" Cli... 阅读详情

上图，按下对应模块触发对应功能，并改变扇形区域颜色。

...全文

WPF绘制柱状图，折线图和扇形图 1.绘制需引入外部插件WPFVisifire.Charts插件 2.三个button按钮 <Button Content="柱状图" Name="ButColumn" HorizontalAlignment="Left" Margin="10,59,0,0" VerticalAlignment="Top" Width="75" Click="ButColumn_Click"... 阅读详情

印度阿三学编程

C# 111,128 成员 642,536 内容

+ 关注 + 加入社区

切换为时间正序

印度阿三学编程 2019-04-25

打赏
举报

引用 3 楼 wangyx92528 的回复:

按楼上说的用 Path就行了，虽然用着麻烦，但是基本上没什么画不出来的形状一个简单的例子，定一个按钮模板，其他的旋转就可以了


<Window x:Class="WpfAppPathButtonTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfAppPathButtonTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="260" Width="260">
    <Window.Resources>

        <Style TargetType="{x:Type Button}" x:Key="TestButton">
            <Setter Property="Background" Value="{x:Null}"/>
            <Setter Property="BorderBrush" Value="{x:Null}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border x:Name="border" 
                                Background="{TemplateBinding Background}" 
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                SnapsToDevicePixels="true">
                            <Path x:Name="Path"
                                  Data="M0,0 a50,50,0,0,1,70,0 L55,15 a35,40,0,0,0,-40,0 z"
                                  Fill="Red"
                                  RenderTransformOrigin="0.5,0.5"
                                  Stretch="Uniform" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsDefaulted" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Red" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Yellow" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Blue" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Path" Property="Fill" Value="Black" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Window.Resources>
    <Grid>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="73,41,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" />
        <Button Width="100" Style="{StaticResource TestButton}" Margin="126,93,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="90"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="74,144,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="180"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="22,93,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="270"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
    </Grid>
</Window>

抱紧微软爸爸大腿.gif

d大神棒棒的的。很有用

郑州高新区WPF小王子 2019-04-09

打赏
举报

使用Blend工具画出形状，应用到button的controltemplate模板即可。

wangyx92528 2019-04-08

打赏
举报

按楼上说的用 Path就行了，虽然用着麻烦，但是基本上没什么画不出来的形状一个简单的例子，定一个按钮模板，其他的旋转就可以了


<Window x:Class="WpfAppPathButtonTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfAppPathButtonTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="260" Width="260">
    <Window.Resources>

        <Style TargetType="{x:Type Button}" x:Key="TestButton">
            <Setter Property="Background" Value="{x:Null}"/>
            <Setter Property="BorderBrush" Value="{x:Null}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border x:Name="border" 
                                Background="{TemplateBinding Background}" 
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                SnapsToDevicePixels="true">
                            <Path x:Name="Path"
                                  Data="M0,0 a50,50,0,0,1,70,0 L55,15 a35,40,0,0,0,-40,0 z"
                                  Fill="Red"
                                  RenderTransformOrigin="0.5,0.5"
                                  Stretch="Uniform" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsDefaulted" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Red" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Yellow" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="Path" Property="Fill" Value="Blue" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Path" Property="Fill" Value="Black" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Window.Resources>
    <Grid>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="73,41,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" />
        <Button Width="100" Style="{StaticResource TestButton}" Margin="126,93,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="90"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="74,144,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="180"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
        <Button Width="100" Style="{StaticResource TestButton}" Margin="22,93,0,0" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Left" VerticalAlignment="Top" >
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="270"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
    </Grid>
</Window>

抱紧微软爸爸大腿.gif

angel6709 2019-04-08

打赏
举报

geography path

mk_lucifer 2019-04-08

打赏
举报

做一个模板，模板里用Path描路径就行。。。

WPF 圆内带扇形按钮怎么做？

相关推荐