網(wǎng)站首頁 編程語言 正文
代碼如下
一、創(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)推薦
- 2024-03-24 feignClient注入失敗
- 2022-03-17 sqlsever2019文件創(chuàng)建與變量示例_數(shù)據(jù)庫其它
- 2022-10-04 C語言實現(xiàn)倒置字符串的兩種方法分享_C 語言
- 2022-11-18 React網(wǎng)絡(luò)請求發(fā)起方法詳細介紹_React
- 2022-08-03 MongoDB數(shù)據(jù)庫條件查詢技巧總結(jié)_MongoDB
- 2022-09-14 利用Pandas實現(xiàn)對數(shù)據(jù)進行移動計算_python
- 2023-01-30 Android實現(xiàn)RecyclerView嵌套流式布局的詳細過程_Android
- 2022-02-11 小程序如何把參數(shù)設(shè)置為全局變量
- 最近更新
-
- window11 系統(tǒng)安裝 yarn
- 超詳細win安裝深度學習環(huán)境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎(chǔ)操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區(qū)別,Jav
- spring @retryable不生效的一種
- Spring Security之認證信息的處理
- Spring Security之認證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權(quán)
- redisson分布式鎖中waittime的設(shè)
- maven:解決release錯誤:Artif
- restTemplate使用總結(jié)
- Spring Security之安全異常處理
- MybatisPlus優(yōu)雅實現(xiàn)加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務(wù)發(fā)現(xiàn)-Nac
- Spring Security之基于HttpR
- Redis 底層數(shù)據(jù)結(jié)構(gòu)-簡單動態(tài)字符串(SD
- arthas操作spring被代理目標對象命令
- Spring中的單例模式應(yīng)用詳解
- 聊聊消息隊列,發(fā)送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠程分支