第一句子网 > WPF实现拟物旋转按钮

WPF实现拟物旋转按钮

时间：2021-02-21 22:24:33

相关推荐

WPF实现拟物旋转按钮

WPF开发者QQ群：340500857 | 微信群 -> 进入公众号主页加入组织

有小伙伴提出需要实现鼠标经过旋转进度条增加。

由于在WPF中没有现成的鼠标经过旋转控件，所以我们自己实现一个。

PS：有更好的方式欢迎推荐。

—

代码如下

一、创建VolumeControl.cs 继承UserControl代码如下。

VolumeControl.cs实现思路如下

1、TicksArray：存放刻度值集合。

2、处理鼠标按下，鼠标移动，鼠标抬起事件。

3、将鼠标移动将坐标点转为角度。

Math.Atan2

4、设置图片2的角度。

using System;using System.Collections.Generic;using System.Linq;using System.Windows;using System.Windows.Controls;using System.Windows.Input;using System.Windows.Media;using WPFDevelopers.Controls;namespace WPFDevelopers.Samples.ExampleViews{/// <summary>/// VolumeControl.xaml 的交互逻辑/// </summary>public partial class VolumeControl : UserControl{public static readonly DependencyProperty AngleProperty =DependencyProperty.Register("Angle", typeof(double), typeof(VolumeControl), new UIPropertyMetadata());public double Angle{get { return (double)GetValue(AngleProperty); }set { SetValue(AngleProperty, value); }}public IList<ScaleItem> TicksArray{get { return (IList<ScaleItem>)GetValue(TicksArrayProperty); }private set { SetValue(TicksArrayProperty, value); }}public static readonly DependencyProperty TicksArrayProperty =DependencyProperty.Register("TicksArray", typeof(IList<ScaleItem>), typeof(VolumeControl));private Point _center;private Brush defaultColor = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#151515"));private Brush selectColor = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF81FB00"));public VolumeControl(){InitializeComponent();List<ScaleItem> shortticks = new List<ScaleItem>();for (int i = 0; i < 36; i++)shortticks.Add(new ScaleItem { Index = i, Background = defaultColor });shortticks[0].Background = selectColor;this.TicksArray = shortticks;_center = new Point(this.ActualWidth / 2, this.ActualHeight / 2);this.MouseLeftButtonDown += new MouseButtonEventHandler(OnMouseLeftButtonDown);this.MouseUp += new MouseButtonEventHandler(OnMouseUp);this.MouseMove += new MouseEventHandler(OnMouseMove);}private void OnMouseLeftButtonDown(object sender, MouseButtonEventArgs e){Mouse.Capture(this);}private void OnMouseUp(object sender, MouseButtonEventArgs e){Mouse.Capture(null);}private void OnMouseMove(object sender, MouseEventArgs e){if (Mouse.Captured == this){if (Angle >= 360){Angle = 0;TicksArray.ToList().ForEach(y =>{if (y.Index.Equals(0))y.Background = selectColor;y.Background = defaultColor;});}var curPoint = e.GetPosition(this);var relPoint = new Point(curPoint.X - _center.X, curPoint.Y - _center.Y);var angle = Math.Atan2(relPoint.X, relPoint.Y);Angle += angle;var max = Angle / 10;TicksArray.Where(x => x.Index <= max).ToList().ForEach(y =>{y.Background = selectColor;});}}}}

二、创建VolumeControl.xaml代码如下

三、创建ZooSemyExample.xaml代码如下

<UserControl x:Class="WPFDevelopers.Samples.ExampleViews.ZooSemyExample"xmlns="/winfx//xaml/presentation"xmlns:x="/winfx//xaml"xmlns:mc="/markup-compatibility/" xmlns:d="/expression/blend/" xmlns:local="clr-namespace:WPFDevelopers.Samples.ExampleViews"mc:Ignorable="d" d:DesignHeight="450" d:DesignWidth="800"><Grid><local:VolumeControl/></Grid></UserControl>

—

效果预览

鸣谢素材提供者 -王涛

源码地址如下

github：/yanjinhuagood/WPFDevelopers.git

gitee：/yanjinhua/WPFDevelopers.git

WPF开发者QQ群：340500857

blogs：/yanjinhua

Github：/yanjinhuagood

出处：/yanjinhua

版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请著名作者出处 /yanjinhuagood