Day28：Update the Data and the Featured View

前言

今天要来更新 JSON data，
并且构建 the Featured view。

实作

更新 data

用新的 JSON 文件替换之前的文件
新的文件中的一组数据如下图：

可以发现 ingredients 里的内容由 [Srting] 变成多个 [Srting] 的集合，
并新增了 highlights：[String]
进入 Models 新增及修改内容

var highlights:[String]
var ingredients:[Ingredients]
class Ingredients: Identifiable, Decodable {
    var id:UUID?
    var name:String
    var num:Int?
    var denom:Int?
    var unit:String?
}

3. 进入 DataService 给 Ingredients 设置 id

4. 进入 DetailView 修改显示的 ingredients
只需显示名字：

补充 the FeaturedView
我设想 the FeaturedView 将会是带有食谱的可以滑动更换的卡片

检查 JSON 文件，会发现有名为 "featured" 的 bool 值，
如果显示为 true 则显示图片，
false 则跳过。
为每个 "featured" == true 的 recipe 创建一个可滑动变换的矩形

TabView {
            ForEach (0..<model.recipes.count) {
                index in
                if model.recipes[index].featured == true {
                    Rectangle()
                }
            }
        }

在 Previews 添加环境修饰，以便於可以 canvas 可以呈现。
3. 改成可滑动式矩形

4. 用 GeometryReader 调整矩形大小并显示卡片下面的 indicator

5. 添加图像
先暂时 hardcode image 名称并将其图片和名字堆叠在这个矩形上：

6. 添加顶部及底部的文字

7. 换成多个 image 和 text

这样 the Featured View 就完成了。