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. Python使用笔记27--mysql操作封装类

    1.面向过程 1 import pymysql 2 3 #面向过程 4 mysql_info = {'host':'127.0.0.1', 5 'port':3306, 6 'user':'root' ...

  2. Datax环境搭建

    Datax是一个在异构的数据库/文件系统之间高速交换数据的工具,本次搭建Datax环境,需要说明以下,我的jdk版本是1.7的,所以需要对jdk继续升级. 一.环境准备 软件环境:CentOS 6 系 ...

  3. 高校表白App-团队冲刺第二天

    今天要做什么 今天要把昨天的activity进行完善,并且加上计时跳转的功能,将其设置为主页面,设置两种跳转功能. 遇到的问题 今天没遇到什么大的问题,只是在进行编写的时候,又出现了R文件无法找到的情 ...

  4. Spark—local模式环境搭建

    Spark--local模式环境搭建 一.Spark运行模式介绍 1.本地模式(loca模式):spark单机运行,一般用户测试和开发使用 2.Standalone模式:构建一个主从结构(Master ...

  5. vue+canvas实现炫酷时钟效果的倒计时插件(已发布到npm的vue2插件,开箱即用)

    前言: 此事例是在vue组件中,使用canvas实现倒计时动画的效果.其实,实现效果的逻辑跟vue没有关系,只要读懂canvas如何实现效果的这部分逻辑就可以了 canvas动画的原理:利用定时器,给 ...

  6. Unittest方法 -- 测试报告&加载测试类(discover)

    import unittestimport HTMLTestRunnerimport osclass F11(unittest.TestCase): def test_001(self): self. ...

  7. npm 报错 : npm ERR! Maximum call stack size exceeded

    解决方法:https://blog.csdn.net/caijunfen/article/details/81009797

  8. kubernetes 降本增效标准指南|ProphetPilot:容器智能成本管理引擎

    作者 田奇,腾讯云高级工程师,专注大规模离在线混部,弹性伸缩,云原生成本优化,熟悉Kubernetes,关注云原生大数据.AI. 王孝威,腾讯云容器产品经理,热衷于为客户提供高效的 Kubernete ...

  9. mysql为什么用b+树做索引

    关键字就是key的意思 一.B-Tree的性质 1.定义任意非叶子结点最多只有M个儿子,且M>2: 2.根结点的儿子数为[2, M]: 3.除根结点以外的非叶子结点的儿子数为[M/2, M]: ...

  10. Vue__npm run build npm run dev

    npm run build npm run dev 一.以前一直错的做法 以前,git完项目之后就,执行1.npm install 2.npm run build 3.npm run dev.今天ma ...