使用堆栈和形状编写内容

第 1 步

将 VStack 更改为 ZStack (深度堆栈)。

第 2 步

打开视图列表 ，然后滚动到底部，找到胶囊、圆形、椭圆形、矩形和圆角矩形等形状。

第 3 步

在 ZStack 中添加一个形状来制作头部。可使用 RoundedRectangle 来制作方形脸，也可使用 Capsule 来制作圆形脸。

提示

圆角矩形需要设置圆角半径。

第 1 步

在胶囊下面添加一个空白行，然后打开修饰符列表。

第 2 步

搜索 frame，然后轻点一下，以将其添加到你的代码中。

第 3 步

填写大致的高度和宽度值，以制作头部。

第 1 步

在 frame 下面添加一个空白行，然后打开修饰符列表。

第 2 步

在搜索栏中键入 foregroundStyle。轻点一下，将其添加到你的代码中。

第 3 步

要更改颜色，请选择括号内的代码并打开颜色列表。

第 4 步

轻点任意颜色，将其添加到你的代码中。

提示

你也可以创建自己的颜色。选择其中一个代码片段，然后根据你的肤色编辑值。

第 1 步

运用所学知识，添加一个矩形来制作颈部，然后使用 frame 修饰符调整大小。

第 2 步

在矩形下面添加一个空白行，然后在修饰符列表中搜索 offset。

第 3 步

轻点 offset 并编辑值，将矩形向下移。你也可以删除任何不使用的参数。

第 4 步

将颈部移到头部下方。

选择矩形和你添加的任何修饰符。将代码剪切并粘贴到深度堆栈的顶部。然后更改颜色，使其与头部颜色一致。

第 5 步

运用所学知识，添加一件衬衫，将它放到屏幕上合适的位置，然后给它上色。

第 1 步

添加一个圆形来制作头发。使用 frame 调整大小，让圆形与头部大致相同或略大。

第 2 步

在圆形下面添加一个空白行。键入 .trim，并在代码补齐功能中出现这个修饰符后，轻点 Return 键。

请注意，trim 修饰符必须位于形状的正下方。

第 3 步

尝试使用多个值来调整修剪的起始和结束位置。

第 4 步

调整刘海儿或短发的位置。继续添加其他元素来完成你的发型设计。

提示

如果一个堆栈中的视图数量超过十个，你会收到“Extra arguments at position…”(……位置有多余的参数) 警告。

如果出现这种情况，请按照如图所示对元素进行分组。

第 1 步

在代码中找到制作头部所用的形状。在这个形状下面添加一个空白行，然后在修饰符列表中搜索 shadow。

第 2 步

编辑阴影的半径。尝试换用不同的值，看看效果如何。

提示

另外，你也可以为阴影上色。