XMl 代码

-------------------------------------------------------------------------------------------------------------------------------

<UserControl

x:Class="Xiaowei.Controls.PermissionBlock"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="using:Xiaowei.Controls"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:tk="using:Microsoft.Toolkit.Uwp.UI.Controls"

mc:Ignorable="d"

d:DesignHeight="200"

d:DesignWidth="480"

Height="76"

x:Name="permissionBlock">

<UserControl.Resources>

<Storyboard x:Name="GIFStoryBoard">

<DoubleAnimation

x:Name="GIFDoubleAnimation"

EnableDependentAnimation="True"

To="176" Duration="00:00:0.3"

Storyboard.TargetName="borderGrid"

Storyboard.TargetProperty="Height">

<DoubleAnimation.EasingFunction>

<PowerEase EasingMode="EaseInOut"/>

</DoubleAnimation.EasingFunction>

</DoubleAnimation>

<DoubleAnimation

x:Name="GIFBorderDoubleAnimation"

EnableDependentAnimation="True"

To="1" Duration="00:00:0.3"

Storyboard.TargetName="shadowBorder"

Storyboard.TargetProperty="Opacity">

<DoubleAnimation.EasingFunction>

<PowerEase EasingMode="EaseInOut"/>

</DoubleAnimation.EasingFunction>

</DoubleAnimation>

</Storyboard>

</UserControl.Resources>

<Grid x:Name="borderGrid" Height="76" VerticalAlignment="Top" Margin="0,0,0,-200">

<tk:DropShadowPanel Opacity="0"

x:Name="shadowBorder"

VerticalContentAlignment="Stretch"

Margin="14,0,14,8"

HorizontalContentAlignment="Stretch">

<Grid Background="White"

CornerRadius="7" >

</Grid>

</tk:DropShadowPanel>

<Grid Background="White" CornerRadius="7" Margin="14,0,14,8" VerticalAlignment="Stretch" PointerEntered="PointerEntered" PointerExited="PointerExited">

<Grid.RowDefinitions>

<RowDefinition Height="auto"/>

<RowDefinition Height="1*"/>

</Grid.RowDefinitions>

<Image

Width="28"

Height="28"

Margin="12,20,0,20"

HorizontalAlignment="Left"

VerticalAlignment="Center"

Source="{Binding Icon, ElementName=permissionBlock, Mode=OneWay}"

/>

<TextBlock

HorizontalAlignment="Left"

VerticalAlignment="Top"

FontSize="16"

Foreground="#272727"

Margin="48,12,0,0"

Text="{Binding Title, ElementName=permissionBlock, Mode=OneWay}">

</TextBlock>

<TextBlock

Foreground="#666666"

HorizontalAlignment="Left"

VerticalAlignment="Bottom"

FontSize="14"

FontWeight="Light"

Text="{Binding Comment, ElementName=permissionBlock, Mode=OneWay}"

Margin="48,0,0,11">

</TextBlock>

<Button

Style="{ThemeResource ButtonStyleTransBack}"

Content="开启"

Click="ActiveButton_Click"

HorizontalAlignment="Right"

Margin="0,0,25,0"

Foreground="#4367FC"

FontSize="16"/>

<Image

Grid.Row="1" Height="119" Margin="12,0,12,12"

Source="{Binding GIFSource, ElementName=permissionBlock, Mode=OneWay}"

/>

</Grid>

</Grid>

</UserControl>

C# code

-----------------------------------------------------------------------------------------------------------------------------------

using System;

using Windows.UI;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Media;

// The User Control item template is documented at https://go.microsoft.com/fwlink/?LinkId=234236

namespace Xiaowei.Controls

{

public sealed partial class PermissionBlock : UserControl

{

public static DependencyProperty TitleProperty { get; } = DependencyProperty.Register(

"Title", typeof(string), typeof(PermissionBlock), new PropertyMetadata("")

);

public string Title

{

get

{

return (string)GetValue(TitleProperty);

}

set

{

SetValue(TitleProperty, value);

}

}

public static DependencyProperty CommentProperty { get; } = DependencyProperty.Register(

"Comment", typeof(string), typeof(PermissionBlock), new PropertyMetadata("")

);

public string Comment

{

get

{

return (string)GetValue(CommentProperty);

}

set

{

SetValue(CommentProperty, value);

}

}

public static DependencyProperty IconProperty { get; } = DependencyProperty.Register(

"Icon", typeof(ImageSource), typeof(PermissionBlock), new PropertyMetadata(null)

);

public ImageSource Icon

{

get

{

return (ImageSource)GetValue(IconProperty);

}

set

{

SetValue(IconProperty, value);

}

}

public static DependencyProperty GIFSourceProperty { get; } = DependencyProperty.Register(

"GIFSource", typeof(ImageSource), typeof(PermissionBlock), new PropertyMetadata(null)

);

public ImageSource GIFSource

{

get

{

return (ImageSource)GetValue(GIFSourceProperty);

}

set

{

SetValue(GIFSourceProperty, value);

}

}

private void ShowGif()

{

GIFDoubleAnimation.To = 210;

GIFBorderDoubleAnimation.To = 1;

GIFStoryBoard.Begin();

}

private void HideGif()

{

GIFDoubleAnimation.To = 76;

GIFBorderDoubleAnimation.To = 0;

GIFStoryBoard.Begin();

}

public static DependencyProperty IsAllowProperty { get; } = DependencyProperty.Register(

"IsAllow", typeof(bool), typeof(PermissionBlock), new PropertyMetadata(false, IsAllowPropertyChanged)

);

private static void IsAllowPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)

{

if ((bool)e.NewValue)

{

((PermissionBlock)d).Hide();

}

else

{

((PermissionBlock)d).Show();

}

}

public bool IsAllow

{

get

{

return (bool)GetValue(IsAllowProperty);

}

set

{

SetValue(IsAllowProperty, value);

}

}

private void Show()

{

Visibility = Visibility.Visible;

}

private void Hide()

{

Visibility = Visibility.Collapsed;

HideGif();

}

public PermissionBlock()

{

this.InitializeComponent();

}

public event Action Click;

private void ActiveButton_Click(object sender, RoutedEventArgs e)

{

Click?.Invoke();

}

private void PointerEntered(object sender, Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

{

ShowGif();

}

private void PointerExited(object sender, Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

{

HideGif();

}

}

}

wpf 中的 自定义控件的 binding的更多相关文章

  1. WPF中关于自定义控件的滚动条鼠标停留在内容上鼠标滚轮滚动无效的问题

    问题起因:在一个用户控件里放置了1个TreeView垂直顺序放置. 当用户控件中的内容超过面板大小时,滚动条会自动出现 ,但是只有当鼠标指示在右边滚动条的那一条位置时,才支持鼠标滚轴滚动. 点在控件内 ...

  2. WPF中的数据绑定Data Binding使用小结

    完整的数据绑定的语法说明可以在这里查看: http://www.nbdtech.com/Free/WpfBinding.pdf MSDN资料: Data Binding: Part 1 http:// ...

  3. 在WPF中自定义控件

    一, 不一定需要自定义控件在使用WPF以前,动辄使用自定义控件几乎成了惯性思维,比如需要一个带图片的按钮,但在WPF中此类任务却不需要如此大费周章,因为控件可以嵌套使用以及可以为控件外观打造一套新的样 ...

  4. 【转】WPF中Binding的技巧(一)

    WPF中Binding的技巧(一)   在WPF应用的开发过程中Binding是一个非常重要的部分. 在实际开发过程中Binding的不同种写法达到的效果相同但事实是存在很大区别的. 这里将实际中碰到 ...

  5. 【转】WPF中的Binding技巧(二)

    WPF中的Binding技巧(二)     接上篇, 我们来看一看Elementname,Source,RelativeSource 三种绑定的方式 1.ElementName顾名思义就是根据Ui元素 ...

  6. Binding在WPF中的使用

    闲来无事,不想打DOTA,在这里小小研究下wpf中关于Binding的东西. 咯咯 在我们印象中,Binding的意思是“绑定”,这个“绑”大概取自于Bind这个单词吧,这么理解的话就是以音译英了,没 ...

  7. WPF中添加Winform用户自定义控件

    过程:创建WPF工程->创建Winform用户自定义控件工程->WPF中引用控件->添加到Xaml页面 1.首先在WPF工程的解决方案上右击选择添加新建项目: 选择Windows窗体 ...

  8. WPF binding<一> Data Binding在WPF中的地位

    在代码中看到 <Image Source="{Binding ElementName=LBoxImages, Path=SelectedItem.Source}" /> ...

  9. 在WPF中自定义控件(3) CustomControl (上)

    原文:在WPF中自定义控件(3) CustomControl (上) 在WPF中自定义控件(3) CustomControl (上)                              周银辉 ...

随机推荐

  1. Oracle-索引分裂研究

    目录 索引分裂介绍 分类 索引分裂实验 基础环境准备 基础信息统计--之前 数据插入 基础信息统计--之后 Trace 数据统计 数据分析 索引PRI_ID之dba_extents视图 索引PRI_I ...

  2. UFT对于PDF 文档的操作方法 VBS代码

    1.首先需要安装Adobe Acrobat,而不是Adobe Reader 2.理解AcroExch.App .AcroExch.AVDoc.AcroExch.PODoc App 主要管理应用级别的对 ...

  3. Pytest单元测试框架之FixTure基本使用

    前言: 在单元测试框架中,主要分为:测试固件,测试用例,测试套件,测试执行及测试报告: 测试固件不难理解,也就是我们在执行测试用例前需要做的动作和测试执行后的需要做的事情: 比如在UI自动化测试中,我 ...

  4. python -- 程序异常与调试(程序调试)

    一.程序调试 A.使用assert语句检测程序代码中的错误. assert 表达式[, 参数] 如果表达式为True,则继续往下运行:如果为False,则抛出一个AssertionError异常,并且 ...

  5. Python开发篇——构建虚拟Python开发环境(Conda+Poetry)

    前言 之前虽略有提及Python,但是没有实际地写点料.惭愧,惭愧,所以这次先起个头,讲讲如何构建虚拟Python开发环境.相信之前看过我博客的人可能会想:博主不会又要聊聊Docker吧?放心,不会. ...

  6. SSM框架,在Html界面利用ajax,json,jQuery实现省市区下拉框联动

    1.先生成省市区表格 2.建立实体类 3.在html画出下拉框 <select id="province"> <option value="" ...

  7. CSS样式实现表头和列固定

    效果图:第一行和第一列固定       <!DOCTYPE html> <html lang="zh"> <head> <meta cha ...

  8. linux系统下操作mysql数据库常见命令

    一. 备份数据库(如: test): ①可直接进入后台即可.(MySQL的默认目录:/var/lib/mysql ) ②输入命令: [root@obj mysql]# mysqldump -u roo ...

  9. C#曲线分析平台的制作(二,echarts前后台数据显示)

    在上一篇博客中,学习了使用javascript和jquery两种方法来进行前后台交互.本篇博客着重利用jquery+echarts来实现从后台取数,从前端echarts中展示. 1.html页面编写: ...

  10. Apache Unomi 远程表达式代码执行漏洞(CVE-2020-13942)

    影响版本: Apache Unomi < 1.5.2