原地址:
文中表述仅为本人理解,若有偏差和错误请指正!
接着 。本篇将是ZAM 3D制作动画的一些关键点。
我们可以将各个字体工具自己的喜好填充好Materials,当然,也可以采用默认,一般默认灯光下是偏金黄色的,这个可以在左下角进行调节。左下第一个是当前选中的灯光设置,第二个则是全局的灯光设置。(如果你拖动了布局那就另当别论了。)比如我这里将字体染成了葫芦娃的红橙黄绿蓝靛紫以及葫芦小金刚的白色(注意,字体分为主体和阴影两个部分,我们阴影统一再拖一次白色),最后大概是这个样子的:(在不同灯光和角度下可能显示效果会有所不同)
然后点击开始正式制作:
将Zoom跳成最大值,将Loop关闭。然后将当前时间轴拖到2.00秒处:(这里有个很坑爹的设定,第一次如果你没有任何帧的话,你需要单价网格的表头才能添加,也就是写着1.00 2.00 那一行。或者除非已经从下面的动画里面附加了一个在某各元素上。)
接着就是和Blend的操作差不多,在3.00秒这一帧下,我们将各个字拖动到黄框显示区域的中间依次摆放,然后点击播放,你会发现,很简单的字幕动画已经完成了。这个时候就可以选择导出XAML了,不过这只是最基本的。
接着我们打开动画路径,这个时候我们分别选中各个汉字,会发现形如下面的路径:(可以发现这个"看"是从右下角到目标位置的一条直线,很明显其他元素也是从起始位置到结束位置的直线。)
很明显,这样的话各个路径会项目遮挡,而且并不怎么优雅,我们需要手动的拖动控制点和时间轴来把它们的运动轨迹给错开,这个就凭借自己的喜好来做就可以了。注意的是,绿色点中间的蓝色点就是中心点,当我们确定好了中心点的起止位置后,最好不要随意拖动,不然就会变成和意料中不一样的动画效果了。当然,如果弄拙成巧了那也未必不是一件喜事了。要点是尽量只拖动绿色的控制点来改变路径形状,而拖动蓝色的中心点来改变起止位置。当然,无论是控制点还是中心点,当你选中后都是红色的。然后左侧也有一些曲线的类型和属性可供选择。我这里每个字的拖动路径大概是这样子的:
此刻动画看起来应该是像这个样子的:
这个时候如果我们想在进一步的搞一些小花样,比如我们想在某个时候,比如上面动画完成后让某个字跳跃并旋转再回到老位置,该怎么办呢?实际上很简单,我们以“娃”字为例,我们选中“娃”,然后点击网格的头部,在2秒以后的区域比如3秒的时候添加一帧,添加一帧的具体含义就是将该元素的某个属性变化一下,就会自动添加一帧,这个点击实际上也就是定位而已,比如我这里设置“娃”的竖向位移 Y Coordinate, X方向也可以调整一下。这里面有几个要点是:1,绿色条表示的是某个时间段内(某个帧的开始结束时间对),某个属性从开始到结束的属性变化,比如下图为Position属性。2,红色调表示的是不变化的时间间隔,即是到下一个帧开始之前都维持当前的属性变化值。这和空白是不同的,这种也是表示的是动画状态,只不过是一般用于过渡而已,比我我们现在要做的,需要停止一段时间再开始新动作,如果不停止这一段时间,则会变成到下一帧开始变化的国富动画。这一点和Blend里面是有类似之处的。
所以下图的具体含义就是:从0到2秒,“娃"的position属性中的某个值从0秒的值过渡到2秒的值,即时一个过渡动画。然后从2秒到3秒,维持2秒的position的属性值,然后从3秒开始,值会开始变化,从3秒的值过渡打3.4几秒的值,我们这个例子中就是将"娃"的竖向位移往上移动了一定距离,动画效果就是移动到顶峰的感觉。然后从3.4几秒到3.8秒,表示我们在顶峰这个位置停留了这么长的时间,然后从3.8秒开始,"娃"将从顶峰下降到原来的水平位置。也就是说,接近5秒的这一帧就是回到了2秒的位置。(仅限于本例中)。
ZAM 3D的这个帧动画和Blend有一些不同在于:Blend中没有停止即是下图中红色区域这种概念,我们需要手动的拖动持续区域的条来达到这样的“滞留”效果。而且Blend中的空白所表示的意思就是当前状态的值的意思,它会从这个状态开始过渡到下一帧开始的值。经常使用Blend的话这个应该还是比较好理解的吧。Blend的一些基础操作我以后也会抽点时间来介绍一下,包括行为,事件,样式,动画等等。
好,如果一切OK的话,目前的效果应该是和下面差不多的:(当然时间,路径各方面,都是可以随意调节的。)
最后,剩下就是在这个过程中的翻转了,如果使用过Blend的,那么也很好做了,和上面的差不多,只不过我们这次改变的是Rotation 旋转这个属性:
确保Rotation 5个红色区间的X,Y,Z值分别为:0.0 0.0 0.0/180.0 0.0 0.0/0.0 0.0 0.0/180.0 0.0 0.0/0.0 0.0 0.0,其中,1,3,5分别是初始,顶峰和结束时候的XYZ旋转值。2和4是中间值,如果不设置也就谈不上旋转不旋转了。这里要注意的是,第二和第四个值输入后有可能系统会帮你校正它的Rotation值,这个不用管它改成多少那就用多少吧。最后效果图如下:
位置,时间的多少,都是可以自行调整的。Tips:和Blend一样每一帧都是可以有缓冲效果的,只不过都很简单,而且只能自己拖动。方法是选中某一帧,然后右键菜单的Propertites选项。
最后就是File->Export Scene To Xaml了,一路默认Next就可以了,剩下的大家应该都懂了,就可以直接拿到WPF中去使用了。也可以在Blend中打开看看是怎么样子的,默认是ViewBox缩放的。
把时间和缓冲加上,然后把路径拉到Scene之外,最后的再WPF中效果差不多是这样的:
眼睛好一点的也许发现了,在实际的WPF程序当中,动画和ZAM 3D中的动画是有一些偏差和出入的,比如ZAM 3D中娃字是要等待一下然后再跳起来,而到了WPF中则是很连贯的,这点我们可以在Blend中打开修改一下应该就可以一致了。
总结一下:实际上ZAM 3D 中还有很多功能值得探讨,比如灯光,模型等等,比较有趣的一个是可以自己手绘一些基本的3D形状拿来生产,嗯,不过审美观不行的还是算了吧,还是拿设计好的模型比较靠谱。由于3D字都是用路径绘制而成,因此也就失去了一些通用性,不过应该没什么问题,一般都是定制的。所以如果要更换字幕,这些流程一定要熟悉才行,不然就冤大头了啊。话说Blend的界面还是要顺眼多了,这个ZAM 3D实际上还有很多改进的顶峰,比如有时候点击关键帧它会出现误操作,妖魔拖不动要么莫名其妙的多了一格出来,嗯,也许是我操作不当造成的,反正就是感觉不如Blend来得顺手啊。反正也不是经常用,先就这样吧。
对了,最后生成的XAML代码如下:
12 3 4 293 2945 246 2476 2457 188 129 1110 13 1714 1615 19 2520 2421 2322 26 3227 3128 3029 33 3934 3835 3736 40 4641 4542 4443 47 5348 5249 5150 54 6055 5956 5857 61 6762 6663 6564 68 7469 7370 7271 75 8476 77 78 8279 8180 83 85 9486 87 88 9289 9190 93 99 104 105 114106 107 108 112109 111110 113 119 124 125 134126 127 128 132129 131130 133 139 144 145 154146 147 148 152149 151150 153 159 164 165 174166 167 168 172169 171170 173 179 184 185 194186 187 188 192189 191190 193 199 204 205 214206 207 208 212209 211210 213 219 224 225 234226 227 228 232229 231230 233 239 244 248 250 251249 252 292253 291254 290255 256 257 258 261259 260 262 265263 264 266 269267 268 270 273271 272 274 277275 276 278 281279 280 282 285283 284 286 289287 288 295 497 498296 496297 302298 299 300 301 303 308304 305 306 307 309 314310 311 312 313 315 320316 317 318 319 321 326322 323 324 325 327 332328 329 330 331 333 337334 335 336 338 342339 340 341 343 347344 345 346 348 353349 350 351 352 354 359355 356 357 358 360 365361 362 363 364 366 417367 371368 370369 372 376373 375374 377 381378 380379 382 386383 385384 387 391388 390389 392 396393 395394 397 401398 400399 402 406403 405404 407 411408 410409 412 416413 415414 418 425419 420 421 422 423 424 426 433427 428 429 430 431 432 434 441435 436 437 438 439 440 442 447443 444 445 446 448 453449 450 451 452 454 459455 456 457 458 460 465461 462 463 464 466 471467 468 469 470 472 477473 474 475 476 478 483479 480 481 482 484 489485 486 487 488 490 495491 492 493 494 499 505 506 507500 504501 503502