日学一语，日行一善。
一、本期目标
实现一个比较流行的按钮UI。
二、项目分析
1、从层次上分析，这个按钮分为三层：① 圆角矩形 ； ② 圆形 ； ③ 开关图形；
2、从颜色上分析，按钮本身是白色的，为了模拟光影效果，所以将圆角矩形的颜色设为淡淡的浅灰色；
3、从光影上分析，模拟左上方打光，所以左上方为亮部，右下方为阴影位置；
三、实现过程
1.构建层次
ZStack( ) // “ ZStack ” 是 以 “ z ” 轴为排列方式，也就是说层叠排列
{
最低层：矩形
中间层：圆形
最上层：图标
}
swiftui中的zstack的层次关系是先写的在最下面，再写的在上面，这就是为什么先布局最底层，然后是中间层和最上层。
下面是具体的代码，黑色部分即为上面的层次分析所对应的代码。
3-1
2、代码解析：
ZStack：布局命令，以Z轴方向的布局。
alignment: 对齐方式。
.center：中间对齐。
RoundedRectangle()：有圆角的矩形命令。
cornerRadius:30：圆角半径为30。
. style: .continuous：圆角的类型，这种圆角比较圆滑，推荐使用。
.frame(width:100,height:100,alignment: .center)：给矩形设置宽度和高度均为100像素的尺寸，对齐方式为中间对齐。
.foregroundColor(Color( colorLiteral(red: 0.9528942704, green: 0.947229445, blue: 0.9572485089, alpha: 1)))：给矩形设置前景色。
Circle ()：圆形命令。
重复的代码省略... ...
.shadow(color: .white, radius:5, x:-5, y:-5)：投影命令，在圆形左上方设置白色的投影，模拟白色的光照效果。
.shadow(color: .secondary, radius:5, x:5, y:5)：在圆形的右下方设置灰色的投影，模拟暗部效果。
Image(systemName:"power")：名为" power " 的图片命令。
.resizable()：将图片设置为可变尺寸的形式。
.scaledToFit()：变化尺寸时图片以原有比例进行调整。
注：“ .resizable() ” 和 “ .scaledToFit() ”这两个命令可视为固定用法，以后写代码的时候只要跟图片缩放有关的，想都不用想，先把这哥俩写上，然后再写尺寸。
三、举一反三
思考一下，如何在这个案例的基础上，让图片有 “ 内阴影 ” 的效果。
你答应过我，我用心写，你用心看；既会点赞，还会 收藏，偶尔还会 分享 和 打赏！
本篇完，感谢阅读！
送给想学《缠论》但一直被缠的朋友，下面这个视频可能是你遇到的最易懂的缠论课程
