用WPF轻松打造iTunes CoverFlow效果
用WPF轻松打造iTunes CoverFlow效果
周银辉
源代码下载点这里
先Show一下:
下面这一张是苹果的iTunes软件:
苹果iTunes播放器的CoverFlow效果羡煞旁人,不过有了WPF,我们也可以轻松实现哈,今天费了半天的时间终于搞定,呵呵...
感兴趣的话可以这里下载源代码
(说明:上传源代码时由于图片较大,所以就没传图片了,程序取的是用户" 我的图片"文件夹下的*.jpg图片,你可以修改代码中的路径或在"我的图片"文件夹下放几张jpg图片就可以看到效果了)
图片是使用3DTools 提供的2D到3D映射的方式贴图上去的,每张图片都帖在一个3D模型上,我们只需要让程序来安排这些模型的摆放位置就可以了
3D模型的摆放是按照如下方法进行的,其中3个传出参数angle指定模型源Y轴的旋转角度,offsetX指定模型的X轴方向上的平移量,offsetZ指定模型在Z轴方向上的平移量
/// 依照InteractiveVisual3D在列表中的序号来变换其位置等
/// </summary>
/// <param name="index">在列表中的序号</param>
/// <param name="midIndex">列表中被作为中间项的序号</param>
private void GetTransformOfInteractiveVisual3D(int index, double midIndex, out double angle, out double offsetX, out double offsetZ)
{
double disToMidIndex = index - midIndex;
//旋转,两翼的图片各旋转一定的度数
angle = 0;
if (disToMidIndex < 0)
{
angle = this.ModelAngle;//左边的旋转N度
}
else if (disToMidIndex > 0)
{
angle = (-this.ModelAngle);//右边的旋转-N度
}
//平移,两翼的图片逐渐向X轴负和正两个方向展开
offsetX = 0;//中间的不平移
if (Math.Abs(disToMidIndex) <= 1)
{
offsetX = disToMidIndex * this.MidModelDistance;
}
else if (disToMidIndex != 0)
{
offsetX = disToMidIndex * this.XDistanceBetweenModels + (disToMidIndex > 0 ? this.MidModelDistance : -this.MidModelDistance);
}
//两翼的图片逐渐向Z轴负方向移动一点,造成中间突出(离观众较近的效果)
offsetZ = Math.Abs(disToMidIndex) * -this.ZDistanceBetweenModels;
}
点击图片或指定当前应该被突出显示的图片时的动画效果是这样实现的,先使用上面的方法计算出决定模型位置的几个便量的新值(即上面的几个传出参数),然后在使用动画(DoubleAnimation)让这几个值由旧值过度到新值.
/// 重新布局3D内容
/// </summary>
private void ReLayoutInteractiveVisual3D()
{
int j=0;
for (int i = 0; i < this.viewport3D.Children.Count; i++)
{
InteractiveVisual3D iv3d = this.viewport3D.Children[i] as InteractiveVisual3D;
if(iv3d != null)
{
double angle = 0;
double offsetX = 0;
double offsetZ = 0;
this.GetTransformOfInteractiveVisual3D(j++, this.CurrentMidIndex,out angle,out offsetX,out offsetZ);
NameScope.SetNameScope(this, new NameScope());
this.RegisterName("iv3d", iv3d);
Duration time = new Duration(TimeSpan.FromSeconds(0.3));
DoubleAnimation angleAnimation = new DoubleAnimation(angle, time);
DoubleAnimation xAnimation = new DoubleAnimation(offsetX, time);
DoubleAnimation zAnimation = new DoubleAnimation(offsetZ, time);
Storyboard story = new Storyboard();
story.Children.Add(angleAnimation);
story.Children.Add(xAnimation);
story.Children.Add(zAnimation);
Storyboard.SetTargetName(angleAnimation, "iv3d");
Storyboard.SetTargetName(xAnimation, "iv3d");
Storyboard.SetTargetName(zAnimation, "iv3d");
Storyboard.SetTargetProperty(
angleAnimation,
new PropertyPath("(ModelVisual3D.Transform).(Transform3DGroup.Children)[0].(RotateTransform3D.Rotation).(AxisAngleRotation3D.Angle)"));
Storyboard.SetTargetProperty(
xAnimation,
new PropertyPath("(ModelVisual3D.Transform).(Transform3DGroup.Children)[1].(TranslateTransform3D.OffsetX)"));
Storyboard.SetTargetProperty(
zAnimation,
new PropertyPath("(ModelVisual3D.Transform).(Transform3DGroup.Children)[1].(TranslateTransform3D.OffsetZ)"));
story.Begin(this);
}
}
}
转载于:https://www.cnblogs.com/lonelyxmas/p/9596568.html
用WPF轻松打造iTunes CoverFlow效果相关推荐
- 弘辽科技:如何将新品打造成爆款?选对方法,教你轻松打造爆款
原标题<弘辽科技:如何将新品打造成爆款?选对方法,教你轻松打造爆款> 还有一个星期的时间,我们就要迎来2021年的元旦了,在经历了2020年,是否还有很多商家在为付费流量贵,拿不到免费流量 ...
- 泼辣修图教程:如何通过Polarr Photo打造艳丽夕阳效果
Polarr Photo Editor Pro是一款非常知名的修图软件,中文名为泼辣修图Mac版.可以帮助用户修改照片的颜色.光线.清晰度或清晰度.应用降噪或晕影效果.调整HSL.色彩曲线或色调等.今 ...
- 弘辽科技:淘宝商家如何轻松打造人气宝贝?
原标题<弘辽科技:淘宝商家如何轻松打造人气宝贝?> 电商行业涌入的创业人越来越多,随之开网店的人也越来越多,但是开网店的人越来越多,导致市场竞争就愈发的激烈,许多不懂得运营的淘宝商家在开店 ...
- 【元壤教育AI提示工程】Midjourney神器助力,设计小白3分钟轻松打造炫酷海报!
前言 关注「元壤教育」公众号,系统学习更多AIGC课程. 看完这篇实操教程,设计师该领盒饭了,哈哈,开个玩笑,各位老板看着办. 本教程针对完全没有设计基础的老板们,手把手教你3分钟利用Midjourn ...
- 集成灶和油烟机哪个更实用?用集成灶轻松打造绝美开放式厨房
现如今,开放式餐厨空间俨然已经成为现代居家设计主流,意味厨房与餐厅不再只是烹饪或用餐的场所,而是成为每个家庭成员都能使用的公共场所.那么,在打造开放式厨房的时候,集成灶和油烟机哪个更实用?集成灶的优缺 ...
- 轻松打造图文并茂的Word文档(转)
轻松打造图文并茂的Word文档(转)[@more@] Word强大的功能为我们编辑图文并茂的文档提供了很大的方便,可你是否感觉到一个问题:有时需要绘制一些图形时,不得不借助其它软件,用其它软件绘制好后 ...
- api网关选型_如何轻松打造百亿流量API网关?看这一篇就够了(下)
如何轻松打造百亿流量API网关?看这一篇就够了(上) 上篇整体描述了网关的背景,涉及职能.分类.定位环节,本篇进入本文的重点,将会具体谈下百亿级流量API网关的演进过程. 准备好瓜子花生小板凳开始积累 ...
- 小程序商城制作,轻松打造自己的会员系统
2019独角兽企业重金招聘Python工程师标准>>> 小程序商城制作,轻松打造自己的会员系统 详情了解:http://www.jnqianle.cn/mall/ 简约版页面截图 : ...
- Android-ConvenientBanner轻松实现广告头效果
Android-ConvenientBanner通用的广告栏控件,让你轻松实现广告头效果.支持无限循环, 可以设置自动翻页和时间(而且非常智能,手指触碰则暂停翻页,离开自动开始翻页. 你也可以设置在界 ...
最新文章
- SVN之版本控制系统
- 实现单链表--Python
- 挖掘频繁模式、关联和相关
- OpenCASCADE:建模算法之将触感的形状连接起来
- airpods耳机敲击没反应_iOS11.2.6造成AirPods耳机出现奇怪问题 网友:解决方法很简单...
- simplified build configuration
- 把Scala代码当作脚本运行
- C/C++获取指定网口的IP地址
- 还香吗?iPhone 13/Pro 手机“失灵”:不支持通过 Apple Watch 解锁屏幕
- 天气显示服务器不可用,win7系统桌面天气小工具提示无法连接服务的解决方法...
- dlibdotnet 人脸相似度源代码_C#开发的人脸左右相似度计算软件源码分析
- ctf镜子里面的世界_一个小编姐姐的CTF入坑之旅
- qtableview点击行将整行数据传过去_三部评分达到九分以上的电视剧,琅琊榜甄嬛传在列...
- nginx中配置不输入端口(指定地址)访问项目的方法
- STM32之贪吃蛇游戏
- C#调用FFMPEG实现桌面录制(视频+音频+生成本地文件)【笔记】
- Java小白入门200例80之Java继承(extends)
- 我们如何在Pinterest Ads中使用AutoML,多任务学习和多塔模型
- wsimport 无法读取wsdl文档,unknown extensibility element or attribute “EndpointReference“
- 看了下面的关于大亚湾核电站的一些报道,我终于明白为什么老弟在惠阳买的房子会这么便宜了
热门文章
- UTF8_Encoding
- UPNP库——miniupnpc的主要函数介绍
- ubuntu使用NAT实现局域网的网络共享
- CKEditor教程
- Google Picasa
- 【Labplus 3】掌控板-电子钢琴
- Android下的配置管理之道之repo的使用
- Nowcoder 5477E. 弦(卡特兰数、组合数学)
- python从excel读彩票数据统计分析,用matplotlib.pyplot做可视图在程序窗口显示,并可动态切换Canvas的可视图,窗口里还添加了菜单和Button按钮工具栏,按钮换图
- CTF —— web方向思路