網(wǎng)站首頁(yè) 編程語(yǔ)言 正文
代碼如下
一、創(chuàng)建EdgeLight.xaml代碼如下。
<ResourceDictionary?xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" ????????????????????xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" ????????????????????xmlns:controls="clr-namespace:WPFDevelopers.Controls"> ????<ResourceDictionary.MergedDictionaries> ????????<ResourceDictionary?Source="Basic/ControlBasic.xaml"/> ????</ResourceDictionary.MergedDictionaries> ????<Style?TargetType="{x:Type?controls:EdgeLight}"?BasedOn="{StaticResource?ControlBasicStyle}"> ????????<Setter?Property="BorderBrush"?Value="{DynamicResource?PrimaryNormalSolidColorBrush}"/> ????????<Setter?Property="HorizontalContentAlignment"?Value="Center"/> ????????<Setter?Property="VerticalContentAlignment"?Value="Center"/> ????????<Setter?Property="HorizontalAlignment"?Value="Center"/> ????????<Setter?Property="VerticalAlignment"?Value="Center"/> ????????<Setter?Property="Padding"?Value="20"/> ????????<Setter?Property="Template"> ????????????<Setter.Value> ????????????????<ControlTemplate?TargetType="{x:Type?controls:EdgeLight}"> ????????????????????<ControlTemplate.Resources> ????????????????????????<Storyboard?x:Key="EdgeLightStoryboard"> ????????????????????????????<DoubleAnimation?Duration="00:00:0.5" ?????????????????????????????????????????????To="1" ?????????????????????????????????????????????Storyboard.TargetName="PART_Top" ?????????????????????????????????????????????Storyboard.TargetProperty="ScaleX"/> ????????????????????????????<DoubleAnimation?Duration="00:00:0.5" ?????????????????????????????????????????????BeginTime="00:00:0.5" ?????????????????????????????????????????????To="1" ?????????????????????????????????????????????Storyboard.TargetName="PART_Right" ?????????????????????????????????????????????Storyboard.TargetProperty="ScaleY"/> ????????????????????????????<DoubleAnimation?Duration="00:00:.5" ?????????????????????????????????????????????BeginTime="00:00:01" ?????????????????????????????????????????????To="1" ?????????????????????????????????????????????Storyboard.TargetName="PART_Bottom" ?????????????????????????????????????????????Storyboard.TargetProperty="ScaleX"/> ????????????????????????????<DoubleAnimation?Duration="00:00:.5" ?????????????????????????????????????????????BeginTime="00:00:01.5" ?????????????????????????????????????????????To="1" ?????????????????????????????????????????????Storyboard.TargetName="PART_Left" ?????????????????????????????????????????????Storyboard.TargetProperty="ScaleY"/> ????????????????????????</Storyboard> ????????????????????</ControlTemplate.Resources> ????????????????????<Grid> ????????????????????????<DockPanel?LastChildFill="False"> ????????????????????????????<Rectangle?DockPanel.Dock="Top"?Height="{TemplateBinding?LineSize}"?Fill="{TemplateBinding?BorderBrush}"> ????????????????????????????????<Rectangle.RenderTransform> ????????????????????????????????????<ScaleTransform?x:Name="PART_Top"?ScaleX="0"/> ????????????????????????????????</Rectangle.RenderTransform> ????????????????????????????</Rectangle> ????????????????????????????<Rectangle?DockPanel.Dock="Right"?Width="{TemplateBinding?LineSize}"?Fill="{TemplateBinding?BorderBrush}"> ????????????????????????????????<Rectangle.RenderTransform> ????????????????????????????????????<ScaleTransform?x:Name="PART_Right"?ScaleY="0"/> ????????????????????????????????</Rectangle.RenderTransform> ????????????????????????????</Rectangle> ????????????????????????????<Rectangle?DockPanel.Dock="Bottom"?Height="{TemplateBinding?LineSize}"?Fill="{TemplateBinding?BorderBrush}" ???????????????????????????????????RenderTransformOrigin="1,1"> ????????????????????????????????<Rectangle.RenderTransform> ????????????????????????????????????<ScaleTransform?x:Name="PART_Bottom"?ScaleX="0"/> ????????????????????????????????</Rectangle.RenderTransform> ????????????????????????????</Rectangle> ????????????????????????????<Rectangle?DockPanel.Dock="Left"?Width="{TemplateBinding?LineSize}"?Fill="{TemplateBinding?BorderBrush}" ???????????????????????????????????RenderTransformOrigin="1,1"> ????????????????????????????????<Rectangle.RenderTransform> ????????????????????????????????????<ScaleTransform?x:Name="PART_Left"?ScaleY="0"/> ????????????????????????????????</Rectangle.RenderTransform> ????????????????????????????</Rectangle> ????????????????????????</DockPanel> ????????????????????????<ContentPresenter?HorizontalAlignment="{TemplateBinding?HorizontalContentAlignment}" ??????????????????????????????????????????Margin="{TemplateBinding?Padding}" ??????????????????????????????????????????VerticalAlignment="{TemplateBinding?VerticalContentAlignment}"/> ????????????????????</Grid> ??????????????????? ????????????????????<ControlTemplate.Triggers> ????????????????????????<Trigger?Property="IsAnimation"?Value="True"> ????????????????????????????<Trigger.EnterActions> ????????????????????????????????<BeginStoryboard?x:Name="beginAnimation" ?????????????????????????????????????????????????Storyboard="{StaticResource?EdgeLightStoryboard}"?/> ????????????????????????????</Trigger.EnterActions> ????????????????????????????<Trigger.ExitActions> ????????????????????????????????<StopStoryboard?BeginStoryboardName="beginAnimation"?/> ????????????????????????????</Trigger.ExitActions> ????????????????????????</Trigger> ????????????????????</ControlTemplate.Triggers> ????????????????</ControlTemplate> ????????????</Setter.Value> ????????</Setter> ????</Style> </ResourceDictionary>
二、EdgeLight.cs代碼如下。
using?System;
using?System.Collections.Generic;
using?System.Linq;
using?System.Text;
using?System.Windows;
using?System.Windows.Controls;
using?System.Windows.Media;
using?System.Windows.Media.Animation;
namespace?WPFDevelopers.Controls
{
????public?class?EdgeLight:ContentControl
????{
????????public?bool?IsAnimation
????????{
????????????get?{?return?(bool)GetValue(IsAnimationProperty);?}
????????????set?{?SetValue(IsAnimationProperty,?value);?}
????????}
????????public?static?readonly?DependencyProperty?IsAnimationProperty?=
????????????DependencyProperty.Register("IsAnimation",?typeof(bool),?typeof(EdgeLight),?new?PropertyMetadata(false));
????????public?double?LineSize
????????{
????????????get?{?return?(double)GetValue(LineSizeProperty);?}
????????????set?{?SetValue(LineSizeProperty,?value);?}
????????}
????????public?static?readonly?DependencyProperty?LineSizeProperty?=
????????????DependencyProperty.Register("LineSize",?typeof(double),?typeof(EdgeLight),?new?PropertyMetadata(1.0d));
????????static?EdgeLight()
????????{
????????????DefaultStyleKeyProperty.OverrideMetadata(typeof(EdgeLight),?new?FrameworkPropertyMetadata(typeof(EdgeLight)));
????????}
???????
????}
}
三、新建EdgeLightExample.cs代碼如下。
<UserControl?x:Class="WPFDevelopers.Samples.ExampleViews.EdgeLightExample" ?????????????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"? ?????????????xmlns:local="clr-namespace:WPFDevelopers.Samples.ExampleViews" ?????????????xmlns:wpfdev="https://github.com/yanjinhuagood/WPFDevelopers" ?????????????mc:Ignorable="d"? ?????????????d:DesignHeight="450"?d:DesignWidth="800"> ????<Grid> ????????<UniformGrid?Columns="2"> ????????????<wpfdev:EdgeLight?IsAnimation="{Binding?ElementName=myCheckBox,Path=IsChecked}"?Margin="10"?LineSize="2"> ????????????????<CheckBox?Content="EdgeLight"?x:Name="myCheckBox"/> ????????????</wpfdev:EdgeLight> ????????????<wpfdev:EdgeLight?IsAnimation="{Binding?ElementName=myToggleButton,Path=IsChecked}"?Margin="10"? ??????????????????????????????BorderBrush="OrangeRed"?LineSize="4"> ????????????????<ToggleButton?Content="EdgeLight2"?x:Name="myToggleButton"/> ????????????</wpfdev:EdgeLight> ????????</UniformGrid> ????</Grid> </UserControl>
效果預(yù)覽
原文鏈接:https://mp.weixin.qq.com/s/_OPUZAR3CiNp8WSkZU7kog
相關(guān)推薦
- 2022-09-30 Docker容器Consul部署概述_docker
- 2023-03-29 goland遠(yuǎn)程調(diào)試k8s上容器的實(shí)現(xiàn)_Golang
- 2022-06-23 C#中的小數(shù)和百分?jǐn)?shù)計(jì)算與byte數(shù)組操作_C#教程
- 2022-10-15 Docker數(shù)據(jù)卷掛載命令volume(-v)與mount的使用總結(jié)_docker
- 2022-07-16 結(jié)構(gòu)體通過成員變量獲取主結(jié)構(gòu)體地址(struct)
- 2022-10-24 python正則表達(dá)中的re庫(kù)常用方法總結(jié)_python
- 2021-11-12 圖文詳解Flutter單例的實(shí)現(xiàn)_Android
- 2022-08-01 OpenCV根據(jù)面積篩選連通域?qū)W習(xí)示例_python
- 最近更新
-
- window11 系統(tǒng)安裝 yarn
- 超詳細(xì)win安裝深度學(xué)習(xí)環(huán)境2025年最新版(
- Linux 中運(yùn)行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲(chǔ)小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎(chǔ)操作-- 運(yùn)算符,流程控制 Flo
- 1. Int 和Integer 的區(qū)別,Jav
- spring @retryable不生效的一種
- Spring Security之認(rèn)證信息的處理
- Spring Security之認(rèn)證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權(quán)
- redisson分布式鎖中waittime的設(shè)
- maven:解決release錯(cuò)誤:Artif
- restTemplate使用總結(jié)
- Spring Security之安全異常處理
- MybatisPlus優(yōu)雅實(shí)現(xiàn)加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務(wù)發(fā)現(xiàn)-Nac
- Spring Security之基于HttpR
- Redis 底層數(shù)據(jù)結(jié)構(gòu)-簡(jiǎn)單動(dòng)態(tài)字符串(SD
- arthas操作spring被代理目標(biāo)對(duì)象命令
- Spring中的單例模式應(yīng)用詳解
- 聊聊消息隊(duì)列,發(fā)送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠(yuǎn)程分支