位置：首页>> 电脑教程>> 苹果Mac教程>> 使用QuartzCode进行水填充动画的方法，QuartzCode for Mac教程

使用QuartzCode进行水填充动画的方法，QuartzCode for Mac教程

　　发布时间：2023-02-07 22:03:57　

标签：QuartzCode,for,Mac使用方法,QuartzCode,for,Mac教程

QuartzCode for Mac是一款快速，轻巧，功能强大的动画工具，从6个独特的图层和超过25个可动画的属性中选择和组合，以创建令人惊叹的动画。下面我们来看看使用QuartzCode进行水填充动画的方法。

使用QuartzCode进行水填充动画的方法

这将是最终结果，动画是完全矢量，这意味着不会使用任何图像。1.创建一个矩形作为水的玻璃。
2.使用“插入”>“CALayer”将CALayer添加到画布。CALayer充当填充玻璃的水，因此使用图层检查器将CALayer背景颜色设置为蓝色。
3.将矩形和CALayer的大小设为{150,180}。
4.将CALayer重命名为water并将CALayer的高度设置为1.这表示玻璃杯最初是空的。
5.将水锚点设置为{0.5,1}。这是为了确保高度动画将动画，因为锚点位于底部。
6.然后在时间轴面板中，将边界时间轴添加到水层。7.在“关键帧检查器”面板上，在toValue关键帧处将高度设置为160作为最大注水量。所以这是我们动画的第一个结果。好的，好像。如果你想知道为什么我们不使用使用CAShapelayer的普通矩形，这是因为在QuartzCode中支持边界动画的图层只有CALayer和UIView。10.为了产生水的噪音，我们使用很少的动画组合。
11.首先使用矢量工具创建一个类似于此路径的路径，这是我们水噪声的第一个状态。将路径重命名为噪音。
12.将噪声填充设置为蓝色，类似于水彩，并将其线宽设置为0。13.将噪音移到玻璃底部，并将噪音作为水的子层，因此图层顺序应如下所示。
14.我们需要将噪声作为子层，以便噪声将遵循其父动画，这意味着它将在水高增加时上升。15.要创建不同的噪声，请复制噪声层并在画布上粘贴两次。使用顶点模式，将噪声路径更改为类似这些的路径。复制原始噪声层非常重要，因为路径需要具有相同的控制点计数才能正确地进行动画处理。
16.要为水的噪音制作动画，我们需要使用路径动画为噪点设置动画。首先，使用时间轴面板添加路径时间轴。在路径时间轴的中间添加关键帧，这意味着路径动画将具有3个关键帧或3个不同的状态。然后在关键帧检查器的“路径”部分，将关键帧2和关键帧3的路径分别更改为noise2和noise3。17.因为我们没有使用noise2和noise3图层，所以使用图层列表隐藏它18.播放动画。现在你会看到动画的噪音！现在，对于噪声路径的时间轴，将“自动反转”设置为“是”，将“重复计数”设置为3.这将使动画重复并且看起来更自然。水填充动画媒体
19.为了使动画更好，我们将使用变换和位置动画并将它们应用于噪声层，以使摇动的水看起来更真实。
20.将变换时间线添加到噪声层，并使其具有3个具有相同时间的关键帧。将时间轴关键帧值更改为这些，并将“自动反转”设置为“是”，
关键帧1：保持原样
关键帧2：翻译{2,12,0}，旋转{0,0，-9}
关键帧3：翻译{-3,14,0}，旋转{0,0,7}
如果它更好，请随意尝试其他价值。
21.将位置时间轴添加到噪声层。在toValue处，将其向下移动，使水位低于玻璃水位，低于水层。这是您的最终时间轴面板的样子。22.所以这就是最终动画的样子。

投稿

使用QuartzCode进行水填充动画的方法，QuartzCode for Mac教程

猜你喜欢