Windows UWP开发系列 – 3D变换

在Win8.1中,引入了一个PlaneProjection可以实现3D变换,但它的变换方式比较简单,只能实现基本的旋转操作。在Windows 10 UWP中,引入了一个更加强大的3D变换Transform3D,系统默认内置了两中变换方式:PerspectiveTransform3D和CompositeTransform3D。一个简单的示例如下:

    <StackPanel HorizontalAlignment="Center">
        <Image Source="Assets\img.jpg" Width="400" Name="image">
            <Image.Transform3D>
                <CompositeTransform3D CenterX="200" CenterY="100"
                                      RotationX="{x:Bind sliderX.Value,Mode=OneWay}"
                                      RotationY="{x:Bind sliderY.Value,Mode=OneWay}"
                                      RotationZ="{x:Bind sliderZ.Value,Mode=OneWay}">
                </CompositeTransform3D>
            </Image.Transform3D>
        </Image>
        <Slider x:Name="sliderX" Maximum="360" Width="400" Margin="0,10,0,10"></Slider>
        <Slider x:Name="sliderY" Maximum="360" Width="400" Margin="0,10,0,10"></Slider>
        <Slider x:Name="sliderZ" Maximum="360" Width="400" Margin="0,10,0,10"></Slider>
    </StackPanel>

运行效果如下:

上面的例子比较简单,一旦和动画结合起来后,是可以实现非常酷的3D动画效果的,Win10的磁贴翻转效果貌似就是用它做的。最后提一下的是,貌似CompositeTransform3D的旋转中心点只能传入绝对位置,而无法传入类似(0.5, 0.5)之类的相对位置,用起来时需要先计算大小,略有不便。

时间: 2024-10-05 04:55:03

Windows UWP开发系列 – 3D变换的相关文章

Windows UWP开发系列 – RelativePanel

RelativePanel是在Windows 10 UWP程序中引入的一种新的布局面板,它是通过附加属性设置元素间的位置关系来对实现布局的.一个简单的示例如下: <RelativePanel>????<TextBox x:Name="textBox1" Text="textbox" Margin="5"/>????<Button x:Name="blueButton" Margin="5

Windows UWP开发系列 – 控件默认样式

今天用一个Pivot控件的时候,想修改一下它的Header样式,却发现用Blend和VS无法导出它的默认样式了,导致无法下手,不知道是不是Blend的bug. 在网上搜了一下,在MSDN上还是找到了它的默认样式的,位置如下:https://msdn.microsoft.com/en-us/library/windows/apps/mt299142.aspx.其它的控件默认样式这个地址上也有,如果有需要的可以查询一下.

Win10 UWP开发系列:解决Win10不同版本的Style差异导致的兼容性问题

原文:Win10 UWP开发系列:解决Win10不同版本的Style差异导致的兼容性问题 最近在开发一个项目时,遇到了一个奇怪的问题,项目依赖的最低版本是10586,目标版本是14393,开发完毕发布到商店后,很多用户报无法正常加载页面.经查,有问题的都是Win10 10586版本. 我上篇博客中写到的自定义的AppBar控件,也存在这个问题,10586会报错. 为此特意下载了10586的SDK调试.错误显示,一个样式找不到,名为ListViewItemBackground.因为开发的时候是基于

Win10 UWP开发系列:使用VS2015 Update2+ionic开发第一个Cordova App

安装VS2015 Update2的过程是非常曲折的.还好经过不懈的努力,终于折腾成功了. 如果开发Cordova项目的话,推荐大家用一下ionic这个框架,效果还不错.对于Cordova.PhoneGap.ionic.AngularJS这些框架或库的关系,我个人理解是这样,PhoneGap是一个商业项目,用来实现HTML5式的跨平台开发,后来Adobe公司将其中的核心代码开源,就是Cordova,Cordova只负责实现JavaScript调用原生代码的功能,是一个壳,而壳里具体用什么样式,在H

Win10 UWP开发系列——开源控件库:UWPCommunityToolkit

原文:Win10 UWP开发系列--开源控件库:UWPCommunityToolkit 在开发应用的过程中,不可避免的会使用第三方类库.之前用过一个WinRTXamlToolkit.UWP,现在微软官方发布了一个新的开源控件库—— UWPCommunityToolkit 项目代码托管在Github上:https://github.com/Microsoft/UWPCommunityToolkit 包括以下几个类库: 都可以很方便的从Nuget上安装. NuGet Package Name des

Windows UWP 开发 - 异步编程

在 Windows UWP 开发中最基础也是最重要的就是异步编程,Windows Runtime 库,也就是 RT 库,其中的很多函数都是 async 结尾的,比如 PickSingleFolderAsync,凡是此类函数都是异步操作. MSDN 上的异步编程指南:https://msdn.microsoft.com/zh-cn/library/windows/apps/mt187340.aspx 在 Windows UWP C++/CX 中进行异步编程是非常容易的,有着基本固定的格式,如下.

Win 10 UWP开发系列:设置AppBarButton的图标

在WP8以前,页面最下面的四个小圆按钮是不支持绑定的,WP8.1 RT之后,系统按钮升级成了AppBarButton,并且支持绑定了.在Win10 UWP开发中,按钮的样式发生了变化,外面的圆圈没有了.不过个人还是更喜欢之前的圆按钮的样子^_^ 很喜欢Metro Studio这个程序,有数百个好看的按钮可以用,并且可以导出成png图片.但现在不建议采取png图片的方式了,主要是因为png在缩放后有可能会失真,最好使用字体.path等矢量的方式来实现.以下介绍几种设置AppBarButton图标的

Win10 UWP 开发系列:使用SQLite

在App开发过程中,肯定需要有一些数据要存储在本地,简单的配置可以序列化后存成文件,比如LocalSettings的方式,或保存在独立存储中.但如果数据多的话,还是需要本地数据库的支持.在UWP开发中,可以使用SQLite.本篇文章说一下如何在UWP中使用SQLite.因为SQLite是跨平台的,版本众多,我刚开始用的时候不知道要装哪个,什么WP8的.WP8.1的.Win RT的……简直摸不着头脑.希望这篇文章能让大家少走点弯路. 其实这篇文章写到一半就看到已经有大神写了这个:http://ww

Windows UWP 开发 - 前言

Windows 10 发布近一年了,Visual Studio 2015 也已推出 Update2,UWP 应用开发不仅时机成熟了而且也已经很方便了.所以我打算写一系列的文章来记录我是如何开发 UWP 应用的,对于我自己来说算是笔记,同时也供其它朋友参考.UWP 应用和之前的 WPF.Silverlight 非常相似,其 UI 部分基于 DirectX 技术,使用 XAML 描述构建,即灵活效果也很出色.逻辑代码支持 C++.C#.VB 和 JavaScript,因此对于绝大多数程序员来说开发语