WPF之可翻转面板

1,创建翻转面板的资源字典:FlippPanel.xaml。

  • 无外观控件同样必须给样式指定类型( <ControlTemplate TargetType="ss:FlipPanel">),相关详情参考:WPF之创建无外观控件-CSDN博客)。
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:ss="clr-namespace:无外观控件"xmlns:local="clr-namespace:无外观控件.Themes"><Style TargetType="ss:FlipPanel"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ss:FlipPanel"><Grid><Grid.RowDefinitions><RowDefinition Height="auto"></RowDefinition><RowDefinition Height="auto"></RowDefinition></Grid.RowDefinitions><!--1,为给模板添加VisualStateManager元素,模板必须使用布局面板。布局面板包含控件的两个可视化对象和VisualStateManager元素(该元素不可见)--><VisualStateManager.VisualStateGroups><VisualStateGroup Name="ViewStates"><VisualStateGroup.Transitions><!--两个可视对象切换时间,以及伴随的ToggleButton切换动画--><VisualTransition To="Normal" GeneratedDuration="00:00:01"><Storyboard ><DoubleAnimation  To="0" Storyboard.TargetName="PART_Rota" Storyboard.TargetProperty="Angle" ></DoubleAnimation></Storyboard></VisualTransition><VisualTransition To="Flipped" GeneratedDuration="00:00:2"><Storyboard ><DoubleAnimation  To="180" Storyboard.TargetName="PART_Rota" Storyboard.TargetProperty="Angle" ></DoubleAnimation></Storyboard></VisualTransition></VisualStateGroup.Transitions><VisualState Name="Normal"><Storyboard ><DoubleAnimation To="0" Storyboard.TargetName="front" Storyboard.TargetProperty="Opacity" Duration="00:00:00"></DoubleAnimation><!--ToggleButton旋转动画不能省,否则动画异常--><DoubleAnimation  To="0"  Storyboard.TargetName="PART_Rota" Storyboard.TargetProperty="Angle"></DoubleAnimation></Storyboard></VisualState><VisualState Name="Flipped"><Storyboard ><DoubleAnimation To="0" Storyboard.TargetName="back" Storyboard.TargetProperty="Opacity" Duration="00:00:00"></DoubleAnimation><!--ToggleButton旋转动画不能省,否则动画异常--><DoubleAnimation  To="180" Storyboard.TargetName="PART_Rota" Storyboard.TargetProperty="Angle" Duration="00:00:00" ></DoubleAnimation></Storyboard></VisualState></VisualStateGroup></VisualStateManager.VisualStateGroups><Border  x:Name="front" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"><ContentPresenter Content="{TemplateBinding FrontContent}"></ContentPresenter></Border><Border x:Name="back" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"><ContentPresenter Content="{TemplateBinding BackContent}"></ContentPresenter></Border><ToggleButton  Grid.Row="1" Height="40" Name="FlipButton" RenderTransformOrigin="0.5,0.5"><ToggleButton.RenderTransform><RotateTransform x:Name="PART_Rota" ></RotateTransform></ToggleButton.RenderTransform><ToggleButton.Template><ControlTemplate TargetType="ToggleButton"><ToggleButton Grid.Column="1" Grid.Row="1"  Name="FlipButton"><ToggleButton.Template><ControlTemplate TargetType="ToggleButton"><Rectangle ><Rectangle.Fill><DrawingBrush Stretch="None"><DrawingBrush.Drawing><GeometryDrawing Brush="White"><GeometryDrawing.Pen><Pen Brush="Black" Thickness="2"></Pen></GeometryDrawing.Pen><GeometryDrawing.Geometry><GeometryGroup><EllipseGeometry RadiusX="15" RadiusY="15"></EllipseGeometry><CombinedGeometry GeometryCombineMode="Intersect"><CombinedGeometry.Geometry1><EllipseGeometry RadiusX="7.5" RadiusY="7.5"></EllipseGeometry></CombinedGeometry.Geometry1><CombinedGeometry.Geometry2><PathGeometry   Figures="M-7.5,0 L0,-7.5 L7.5,-7.5 L0,0 L7.5,7.5 L0,7.5 Z"></PathGeometry></CombinedGeometry.Geometry2></CombinedGeometry></GeometryGroup></GeometryDrawing.Geometry></GeometryDrawing></DrawingBrush.Drawing></DrawingBrush></Rectangle.Fill></Rectangle></ControlTemplate></ToggleButton.Template></ToggleButton></ControlTemplate></ToggleButton.Template></ToggleButton></Grid></ControlTemplate></Setter.Value></Setter></Style>
</ResourceDictionary>
  • VisualStateManager只能在布局面板下进行状态管理。

2,在generic.xaml中添加资源字典FlipPanel.xaml.

<ResourceDictionaryxmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"><ResourceDictionary.MergedDictionaries><ResourceDictionary Source="无外观控件;component/Themes/colorpicker.xaml"></ResourceDictionary><ResourceDictionary Source="无外观控件;component/Themes/FlipPanel.xaml"></ResourceDictionary></ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

3,编写代码

 [TemplatePart(Name = "FlipButton", Type =typeof(ToggleButton))]//该特性只是进行提示,无其他意义,可舍去[TemplateVisualState(GroupName = "Normal", Name = "ViewStates")]//该特性提示存在可视化切换,无其他实际意义,可舍去[TemplateVisualState(GroupName = "Flipped", Name = "ViewStates")]public class FlipPanel : Control{public static readonly DependencyProperty CornerRadiusProperty;public static readonly DependencyProperty FrontContentProperty;public static readonly DependencyProperty BackContentProperty;public static readonly DependencyProperty IsFlippedProperty;static FlipPanel(){DefaultStyleKeyProperty.OverrideMetadata(typeof(FlipPanel), new FrameworkPropertyMetadata(typeof(FlipPanel)));CornerRadiusProperty = DependencyProperty.Register("CornerRadius", typeof(CornerRadius), typeof(FlipPanel));FrontContentProperty = DependencyProperty.Register("FrontContent", typeof(object), typeof(FlipPanel));BackContentProperty = DependencyProperty.Register("BackContent", typeof(object), typeof(FlipPanel));IsFlippedProperty = DependencyProperty.Register("IsFlipped", typeof(bool), typeof(FlipPanel));}/// <summary>/// 设置控件边框倒角/// </summary>public CornerRadius CornerRadius{get{return (CornerRadius)this.GetValue(CornerRadiusProperty);}set{this.SetValue(CornerRadiusProperty, value);}}/// <summary>/// 前置内容/// </summary>public object FrontContent{get{return this.GetValue(FrontContentProperty);}set{this.SetValue(FrontContentProperty, value);}}/// <summary>/// 后置内容/// </summary>public object BackContent{get{return GetValue(BackContentProperty);}set{this.SetValue(BackContentProperty, value);}}/// <summary>/// 是否翻转/// </summary>public bool IsFlipped{get{return (bool)GetValue(IsFlippedProperty);}set{SetValue(IsFlippedProperty, value);ChangeVisualState(true);}}public override void OnApplyTemplate(){ToggleButton btn = GetTemplateChild("FlipButton") as ToggleButton;btn.Click += Btn_Click;ChangeVisualState(false);base.OnApplyTemplate();}private void Btn_Click(object sender, RoutedEventArgs e){IsFlipped = !IsFlipped;}void ChangeVisualState(bool useTransition){if (IsFlipped){VisualStateManager.GoToState(this, "Flipped", useTransition);}else{VisualStateManager.GoToState(this, "Normal", useTransition);}}}

4,在UI上添加控件

<local:FlipPanel Grid.Row="1" IsFlipped="True"><local:FlipPanel.FrontContent><StackPanel><Button Content="前1"></Button><Button Content="前2"></Button><Button Content="前3"></Button><Button Content="前3"></Button><Button Content="前4"></Button></StackPanel></local:FlipPanel.FrontContent><local:FlipPanel.BackContent><StackPanel><Button Content="后1"></Button></StackPanel></local:FlipPanel.BackContent></local:FlipPanel>

5,效果

6,Demo 链接

https://download.csdn.net/download/lingxiao16888/89253829?spm=1001.2014.3001.5501

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/5958.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

场景文本检测识别学习 day06(Vi-Transformer论文精读、MAE论文阅读)

Vi-Transformer论文精读 在NLP领域&#xff0c;基于注意力的Transformer模型使用的非常广泛&#xff0c;但是在计算机视觉领域&#xff0c;注意力更多是和CNN一起使用&#xff0c;或者是单纯将CNN的卷积替换成注意力&#xff0c;但是整体的CNN 架构没有发生改变VIT说明&#x…

蓝桥杯单片机省赛——第八届“基于单片机的电子钟程序设计与调试”程序部分

往期回顾 第三届蓝桥杯单片机省赛 第四届蓝桥杯单片机省赛 第五届蓝桥杯单片机省赛 第六届蓝桥杯单片机省赛 第七届蓝桥杯单片机省赛 文章目录 往期回顾一、前期准备二、代码详情1.基础代码蜂鸣器/继电器/led/定时器之类的代码 2.按键详解按键写法讲解 3.驱动的处理驱动写法讲…

程序员缓解工作压力——方法分享

前言 作为一名初级程序员&#xff0c;我承认自己在应对工作压力方面还有待提高。在日常工作中&#xff0c;我时常感到压力山大&#xff0c;尤其是在面对复杂问题或紧迫的项目期限时。然而&#xff0c;为了保持高效和持久的工作热情&#xff0c;我还是积极寻求并使用了一…

Scala应用 —— JDBC的创建

文章目录 Scala应用 —— JDBC的创建前言一、JDBC的创建过程1.初始化连接1.1 配置驱动1.2 创建连接对象 2. 初始化执行器2.1 创建执行器对象2.2 初始化执行器参数 3. 执行操作并返回结果 二、Scala JDBC的基本设计思路1. 操作步骤设计2. 解决结果差异化3.实现jdbc方法并输出结果…

WPF之创建无外观控件

1&#xff0c;定义无外观控件。 定义默认样式&#xff0c;在其静态构造函数中调用DefaultStyleKeyProperty.OverrideMetadata()。 //设置默认样式DefaultStyleKeyProperty.OverrideMetadata(typeof(ColorPicker), new FrameworkPropertyMetadata(typeof(ColorPicker))); 在项目…

UE4_Niagara_两个模型之间的粒子幻化

学习笔记&#xff0c;仅供参考&#xff01; 操作步骤&#xff1a; 1、新建niagara system&#xff0c;添加空的发射器&#xff0c;渲染改为网格体渲染器&#xff0c;网格体为1M_Cube. 2、创建粒子材质重载。 3、渲染网格体的材质设置&#xff1a; 4、在发射器属性面板&#x…

基于MSOGI的交叉对消谐波信号提取网络MATLAB仿真

微❤关注“电气仔推送”获得资料&#xff08;专享优惠&#xff09; 模型简介&#xff1a; 此模型利用二阶广义积分器&#xff08;SOGI&#xff09;对基波电流和相应次的谐波电流进行取 &#xff0c;具体是通过多个基于二阶广义积分器的正交信号发生器 &#xff08; S&#xf…

docker挂载数据卷-以nginx为例

目录 一、什么是数据卷 二、数据卷的作用 三、如何挂载数据卷 1、创建nginx容器挂载数据卷 2、查看数据卷 3、查看数据卷详情 4、尝试在宿主机修改数据卷 5、查看容器内对应的数据卷目录 6、 访问nginx查看效果 ​​​​​​​一、什么是数据卷 挂载数据卷本质上就是实…

【跟马少平老师学AI】-【神经网络是怎么实现的】(八)循环神经网络

一句话归纳&#xff1a; 1&#xff09;词向量与句子向量的循环神经网络&#xff1a; x(i)为词向量。h(i)为含前i个词信息的向量。h(t)为句向量。 2&#xff09;循环神经网络的局部。 每个子网络都是标准的全连接神经网络。 3&#xff09;对句向量增加全连接层和激活函数。 每个…

嵌入式开发三:STM32初体验

本节主要向大家介绍如何开发过程中的基本操作&#xff0c;如编译、串口下载、仿真器下载、仿真调试程序&#xff0c;体验一下 STM32 的开发流程&#xff0c;并介绍 MDK5 的一些使用技巧&#xff0c;通过本节的学习&#xff0c;将对 STM32 的开发流程和 MDK5 使用有个大概了解&a…

安装部署大语言模型 | 通义千问

下载安装 进入ollama的仓库下载 「 qwen 7b 」 libraryGet up and running with large language models.https://ollama.com/library查找阿里的 「 qwen 」 根据自己的电脑配置情况&#xff0c;选择合适的模型 总体来说&#xff0c;模型是越大&#xff0c;效果越好&#xff0c…

019、Python+fastapi,第一个Python项目走向第19步:windows 11 下的pycharm远程连接ubuntu 24.04 服务器

一、说明 欲善其事,必先利其器&#xff0c;先把环境整好&#xff0c;我开发的环境是ubuntu是没有gui的服务器版本&#xff0c;所以必须远程搞才行&#xff0c;今天就是安装一下&#xff0c;链接连接&#xff0c;网上有很多文章&#xff0c;能成功&#xff0c;不过我也弄了一个…

SQL——高级教程【菜鸟教程】

SQL连接 左连接&#xff1a;SQL LEFT JOIN 关键字 左表相当于主表&#xff0c;不管与右表匹不匹配都会显示所有数据 右表就只会显示和左表匹配的内容。 //例显示&#xff1a;左表的name&#xff0c;有表的总数&#xff0c;时间 SELECT Websites.name, access_log.count, acc…

GitHub Copilot Workspace:欢迎进入原生Copilot开发环境

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…

Vue 组件的三大组成部分

Vue 组件通常由三大组成部分构成&#xff1a;模板&#xff08;Template&#xff09;、脚本&#xff08;Script&#xff09;、样式&#xff08;Style&#xff09; 模板部分是组件的 HTML 结构&#xff0c;它定义了组件的外观和布局。Vue 使用基于 HTML 的模板语法来声明组件的模…

【Vulhub靶场】Nginx 漏洞复现

Nginx 漏洞复现 一、Nginx 文件名逻辑漏洞&#xff08;CVE-2013-4547&#xff09;1、影响版本2、漏洞原理3、漏洞复现 二、Nginx 解析漏洞1、版本信息&#xff1a;2、漏洞详情3、漏洞复现 一、Nginx 文件名逻辑漏洞&#xff08;CVE-2013-4547&#xff09; 1、影响版本 Nginx …

网际协议IP

一、概念导入 网际协议IP是TCP/IP体系中最重要的协议之一。与IP协议配套使用的还有三个协议&#xff1a; 地址解析协议ARP网际控制报文协议ICMP网际组管理协议IGMP 二、虚拟互联网络 &#xff08;1&#xff09;定义 现实世界中&#xff0c;不同网络的主机进行通信&#xf…

Centos7.9系统MySQL5.7.32升级为5.7.44(生成环境操作)

1.背景 由于客户进行等保漏扫和渗透&#xff0c;生成环境mysql数据库被扫描出了 高危漏洞。 如图&#xff1a;部分漏洞 查看漏洞详细信息&#xff0c;建议升级到指定版本解决&#xff1a; 说明&#xff1a; 本文仅适合使用当前数据库为 RPM 安装方式 2.升级前准备 查看环…

nginx的前世今生(三)

高手对决&#xff1a;武林盟主之路 1.不败之地&#xff0c;高可用江湖 技术角度讲&#xff0c;高可用&#xff08;High Availability, HA&#xff09;是指系统或服务能够在预定的时间内&#xff0c;以极高的概率持续提供服务的能力。具体来说&#xff0c;这通常涉及到系统的架…

32.Docker认识

Docker介绍 Docker是一个快速交付应用&#xff0c;运行应用的技术。 1.可以将程序、依赖、运行环境一起打包为一个镜像&#xff0c;可以迁移到任意Linux操作系统。 2.运行时利用沙箱机制行程隔离容器&#xff0c;各个应用互不干扰。 3.启动、移除都可以通过一行命令完成&am…