这里有新鲜出炉的精品教程, 程序狗速度看过来!
微信 即时通讯软件
微信 (英文名: wechat) 是腾讯公司于 2011 年 1 月 21 日推出的一个为智能终端提供即时通讯服务的免费应用程序, 微信支持跨通信运营商跨操作系统平台通过网络快速发送免费语音短信视频图片和文字, 同时, 也可以使用通过共享流媒体内容的资料和基于位置的社交插件摇一摇漂流瓶朋友圈公众平台语音记事本等服务插件
客户端微信在二维码状态下, 鼠标滑过, 会有一张手机的图片滑动滑出, 从隐藏到显示, 从显示到隐藏效果非常棒, 本文思路介绍明确, 感兴趣的朋友一起看看吧
客户端微信在二维码状态下, 鼠标滑过, 会有一张手机的图片滑动滑出, 从隐藏到显示, 从显示到隐藏
思路很简单: 1 设置透明度; 2 给个移动的位移
先看下做的效果
整体代码也不难, 就是给 Image 控件设置动画效果
- <Grid x:Name="grid_content" Background="WhiteSmoke" Grid.Row="1">
- <Grid.Triggers>
- <EventTrigger RoutedEvent="Grid.MouseEnter">
- <EventTrigger.Actions>
- <BeginStoryboard HandoffBehavior="SnapshotAndReplace">
- <Storyboard>
- <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" BeginTime="0" Duration="0:0:0.5" From="0" To="300" Storyboard.TargetName="img"/>
- <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" BeginTime="0:0:0.5" Duration="0:0:0.3" From="300" To="270" Storyboard.TargetName="img"/>
- <DoubleAnimation Storyboard.TargetProperty="Opacity" BeginTime="0" Duration="0:0:0.5" From="0" To="1" Storyboard.TargetName="img"/>
- </Storyboard>
- </BeginStoryboard>
- </EventTrigger.Actions>
- </EventTrigger>
- <EventTrigger RoutedEvent="Grid.MouseLeave">
- <EventTrigger.Actions>
- <BeginStoryboard HandoffBehavior="SnapshotAndReplace">
- <Storyboard>
- <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" BeginTime="0" Duration="0:0:0.5" From="270" To="0" Storyboard.TargetName="img"/>
- <DoubleAnimation Storyboard.TargetProperty="Opacity" BeginTime="0" Duration="0:0:0.5" From="1" To="0" Storyboard.TargetName="img"/>
- </Storyboard>
- </BeginStoryboard>
- </EventTrigger.Actions>
- </EventTrigger>
- </Grid.Triggers>
- </Grid>
- <Image x:Name="img" Source="/Image/huadong.png" Visibility="Visible" Opacity="0" Grid.Row="0" Grid.RowSpan="2" IsHitTestVisible="False">
- <Image.RenderTransform>
- <TransformGroup>
- <ScaleTransform/>
- <SkewTransform/>
- <RotateTransform/>
- <TranslateTransform/>
- </TransformGroup>
- </Image.RenderTransform>
- </Image>
但是需要注意的一点就是, 需要给 Image 控件设置一个属性 IsHitTestVisible="False",MSDN 上的解释是如果此元素可以从至少一个点上作为命中测试结果返回, 则为 true, 否则为 false 默认值为 true
设置这个属性很重要, 因为没有设置这个属性, 我调动画调了一早上, 也没实现想要的效果, 给大家看看不设置 IsHitTestVisible="False" 的效果
由于 Image 处于 Grid 的下方, 所以当鼠标从左侧慢慢划入时是没有问题的, 因为鼠标点击不到 Image, 但是如果鼠标滑动过快, 接触到 Image, 则会不断的触发 MouseEnter 事件, 从而出现不断的闪烁
当设置了 IsHitTestVisible="False" 时, 则 Image 不会被点击到, 也就没有影响了
以上所述是小编给大家介绍的 C# 开发微信 二维码鼠标滑动 图像显隐效果, 希望对大家有所帮助, 如果大家有任何疑问请给我留言, 小编会及时回复大家的在此也非常感谢大家对 PHPERZ 网站的支持!
来源: http://www.phperz.com/article/18/0313/352431.html