WPF开发者QQ群: 340500857
有小伙伴需要实现圆形菜单。
效果如下:
一、Xaml代码如下
<Window x:Class="WpfRoundMenu.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:WpfRoundMenu"mc:Ignorable="d"Title="MainWindow" Height="400" Width="400" ResizeMode="NoResize" Background="{x:Null}" WindowStartupLocation="CenterScreen" WindowStyle="None" AllowsTransparency="True"><Window.Resources><Style x:Key="ButtonMenu" TargetType="Button"><Setter Property= "Opacity" Value="0.8"/><Setter Property="Cursor" Value ="Hand"/><Setter Property="Template"><Setter.Value><ControlTemplate><Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}"OpacityMask="{TemplateBinding OpacityMask}"/><ControlTemplate.Triggers><Trigger Property="IsMouseOver" Value="True"><Setter Property="Opacity" Value="1"/></Trigger><Trigger Property="IsEnabled" Value= "False"><Setter Property="Opacity" Value="0.3"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter>
</Style></Window.Resources><Grid><Grid x:Name="gMenu" MouseDown="gMenu_MouseDown"><Grid.Background><RadialGradientBrush><GradientStop Color="White" Offset="0.9"/><GradientStop Offset="1"/><GradientStop x:Name="ColoCirkle" Color="#7F434343" Offset="0.91"/></RadialGradientBrush></Grid.Background><Grid.RowDefinitions><RowDefinition Height="1*"/><RowDefinition Height="1*"/><RowDefinition Height="1*"/><RowDefinition Height="1*"/></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition Width="1*"/><ColumnDefinition Width="1*"/><ColumnDefinition Width="1*"/><ColumnDefinition Width="1*"/></Grid.ColumnDefinitions><Button x:Name="btn1" Foreground="{x:Null}" BorderBrush="#FF009AD6" Background="#FF716E6E" Style="{StaticResource ButtonMenu}" Grid.ColumnSpan="2" Margin="68,35,66,0" Grid.Column="1" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave"><Button.OpacityMask><ImageBrush ImageSource="Images/Color.png"/></Button.OpacityMask></Button><Button x:Name="btn2" Foreground="{x:Null}" BorderBrush="#FF007642" Background="#FF6E7170" Style="{StaticResource ButtonMenu}" Margin="0,64,34,67" Grid.Column="3" Grid.Row="1" Grid.RowSpan="2" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave"><Button.OpacityMask><ImageBrush ImageSource="Images/Eraser.png"/></Button.OpacityMask></Button><Button x:Name="btn3" Foreground="{x:Null}" BorderBrush="#FF656097" Background="#FF716E6E" Style="{StaticResource ButtonMenu}" Margin="68,0,66,46" Grid.Column="1" Grid.Row="3" Grid.ColumnSpan="2" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave"><Button.OpacityMask><ImageBrush ImageSource="Images/Revoke.png"/></Button.OpacityMask></Button><Button x:Name="btn4" Foreground="{x:Null}" BorderBrush="#FFEE73CC" Background="#FF716E6E" Style="{StaticResource ButtonMenu}" Margin="34,64,0,67" Grid.Row="1" Grid.RowSpan="2" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave"><Button.OpacityMask><ImageBrush ImageSource="Images/Pen.png"/></Button.OpacityMask></Button><Grid x:Name="gClose" Grid.ColumnSpan="2" Grid.Column="1" Margin="20,21,19,20" Grid.Row="1" Grid.RowSpan="2"><Grid.Background><RadialGradientBrush><GradientStop Color="#FFE7E7E7" Offset="0.854"/><GradientStop Offset="1"/><GradientStop Color="#FFBCBCBC" Offset="0.856"/></RadialGradientBrush></Grid.Background><Button Margin="58,59,59,52" x:Name="btn5" Foreground="{x:Null}" BorderBrush="#FFFF6B6B" Background="#FF716E6E" Style="{StaticResource ButtonMenu}"MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave"><Button.OpacityMask><ImageBrush ImageSource="Images/Close.png"/></Button.OpacityMask></Button></Grid></Grid></Grid>
</Window>
二、Xaml.cs代码如下
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;namespace WpfRoundMenu
{/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();}Storyboard storyboard;ColorAnimation SetAnimButton(Color color,string objName){ColorAnimation anim = new ColorAnimation();anim.Duration = new Duration(TimeSpan.FromSeconds(0.2));anim.To = color;Storyboard.SetTargetName(anim, objName);Storyboard.SetTargetProperty(anim, new PropertyPath("(Button.Background).(SolidColorBrush.Color)"));return anim;}ColorAnimation SetAnimcirkie(Color color){ColorAnimation anim = new ColorAnimation();anim.Duration = new Duration(TimeSpan.FromSeconds(0.2)); anim.To = color;Storyboard.SetTargetName(anim, "ColoCirkle");Storyboard.SetTargetProperty(anim,new PropertyPath(GradientStop.ColorProperty)); return anim;}private void Button_MouseEnter(object sender, MouseEventArgs e){Button btn = (Button)sender;Color background = ((SolidColorBrush)btn.BorderBrush).Color; storyboard = new Storyboard();storyboard.Children.Add(SetAnimButton(background,btn.Name)); storyboard.Children.Add(SetAnimcirkie(background));storyboard.Begin(this);}private void Button_MouseLeave(object sender, MouseEventArgs e){Button btn = (Button)sender; storyboard = new Storyboard();storyboard.Children.Add(SetAnimButton(Color.FromRgb(113, 110, 110),btn.Name)); storyboard.Children.Add(SetAnimcirkie(Color.FromArgb(150, 67,67,67)));storyboard.Begin(this);}private void gMenu_MouseDown(object sender, MouseButtonEventArgs e){DragMove();}}
}
WPF开发者QQ群: 340500857
blogs: https://www.cnblogs.com/yanjinhua
Github:https://github.com/yanjinhuagood
出处:https://www.cnblogs.com/yanjinhua
版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
转载请著名作者 出处 https://github.com/yanjinhuagood