接上文:
从零开始的 Swift UI (二)
https://innei.ren/posts/programming/swift-ui-meet_2
上篇文章介绍了如何使用 UserDefaults 和 ObserveableObject 来进行数据管理。
这篇文章来完成 LikeView 的布局和功能实现。

Layout
在 LikeView 中编写如下代码。

再修改 HomeView 中的 Like Button 代码。
Like.swift 中新增一个方法。
上面 Like Button 时候被选中,可以根据 Like 中有没有存储判断。
将 ActionView 修改为如下代码:
liked
计算属性根据 model 中的 uuid 推断状态。因为使用了 @Binding
所以上层 View 还需要传一个 Binding 给他。可以理解为 React 中的 Props。注意的是 只有加了 @Binding
的参数传递才是引用传递,也就是上层数据更新后下层也会被更新。在 HomeView 中修改为
ActionView(model: $model).offset(x: 0, y: reader.size.height / 2 - 50)
被
@State
装饰的属性,取他的 Binding 只需要在前面加一个 $
这样点击 Like Button 后 ❤就会变红啦。
Navigation
为了实现能在各个 View 之间导航。使用 NavigationView 就可以做到啦。
修改 HomeView,在外层加上 NavigationView。
修改 LikeView,在外层加上 NavigationView。
注意在设定
.navigationBarTitle
必须加在 NavigationView 的子 View 上才会生效。
接下来,调整一下 List 的 style,让 Item 撑满整个宽度。只需要使用内置的
.listStyle(PlainListStyle())
即可。其余知识点将通过小 Demo 描述。
- Share
- Sheet Modal
完整 App:
https://github.com/Innei/meet-swift
https://github.com/Innei/meet-swift
(完)
文章标题:
文章作者:
文章链接: [复制]
最后修改时间:
商业转载请联系站长获得授权,非商业转载请注明本文出处及文章链接,未经站长允许不得对文章文字内容进行修改演绎。
本文采用创作共用保留署名-非商业-禁止演绎4.0国际许可证
亲亲留个评论再走呗
正在加载评论区...