watchOS 6 の注目点をふまえてSwiftUIでWatch Appを作ってみた!!

var body: some View {
    List {
        // カルーセルビューにデータを渡す処理
    }
    .listStyle(CarouselListStyle())
}

var body: some View {
    List {
        // カルーセルビューにデータを渡す処理
    }
    .onDelete { index in
        // 該当の index のデータを削除 
        self.activityData.remove(at: index)
    }
}

// 各項目の識別をenumなどで表現
enum SettingType {
    case webhook
    case github
    case userName
    case favColor
}

struct SlackSettingContentsView: View {

    var title: String           // 項目名
    var placeHolder: String     // TextField の Placeholder
    @Binding var text: String   // TextField の入力値(親Viewへ通知)
    var type: SettingType
    @State var isPresented = false  // for help button

    var body: some View {
        Group {
            HStack {
                // 項目名
                Text(title)
                    .font(.subheadline)
                    .padding(Edge.Set.top, 2.0)
                // ボタンとアクション処理
                Button(action: {
                    self.isPresented.toggle()
                }) {
                    Image(systemName: "questionmark.circle.fill")
                }
                .frame(width: 20.0, height: 20.0)
                .cornerRadius(10.0)
                .sheet(isPresented: $isPresented, content: {
                    // タイプによって説明画面を出しわけ
                    ScrollView {
                        Text(self.showDescription(type: self.type))
                            .foregroundColor(self.textColor(type: self.type))
                    }
                })
            }
            // 項目名とボタンの下の TextField
            TextField(placeHolder, text: $text)
        }
    }
}

struct SlackSettingsView: View {

    @State private var webHookUrl: String = ""
    @State private var gitHubLink: String = ""
    @State private var userName: String = ""
    @State private var favoriteColorHex: String = ""

    var body: some View {
        ScrollView {
            VStack(alignment: .leading) {
                SlackSettingContentsView(title: "Webhook URL*",
                                         placeHolder: "https://hooks.slack...",
                                         text: $webHookUrl,
                                         type: .webhook)
                SlackSettingContentsView(title: "GitHub's account*",
                                         placeHolder: "JohnnyDev",
                                         text: $gitHubLink,
                                         type: .github)
                SlackSettingContentsView(title: "Your Name",
                                         placeHolder: "John Smith",
                                         text: $userName,
                                         type: .userName)
                SlackSettingContentsView(title: "Favorite Color",
                                         placeHolder: "009944",
                                         text: $favoriteColorHex,
                                         type: .favColor)
                // 省略
            }
        }.navigationBarTitle(Text("Slack Settings"))
    }
}

final class PostActivity: ObservableObject {

    // @Published をつけて宣言して値の変化のイベント発行可能にする
    @Published var isShowDialog = false // アラートを表示させるかのフラグ
    @Published var isSuccess = false    // 投稿成功か失敗かのフラグ
    @Published var message = ""         // 投稿成功or失敗時のエラーメッセージ

    /// Post User's Activity to Slack
    /// - Parameter activity: User's Activity
    func post(activity: ActivityModel) {
        let webhookUrl = {SlackのWebhook URLを取得}

        var request = URLRequest(url: URL(string: webhookUrl)!)
        request.httpMethod = "POST"
        request.addValue("application/json", forHTTPHeaderField: "Content-Type")

        // generate payload Json
        let params = PostJsonGenerator.generate(activityName: activity.name)

        do {
            request.httpBody = try JSONSerialization.data(withJSONObject: params, options: [])
        } catch {
            self.isShowDialog = true
            self.isSuccess = false
            self.message = error.localizedDescription
        }

        let task = URLSession.shared.dataTask(with: request)
        { (data: Data?, response: URLResponse?, error: Error?) in
            if let error = error {
                self.isShowDialog = true
                self.isSuccess = false
                self.message = error.localizedDescription
                return
            }
            guard let _ = data, let response = response as? HTTPURLResponse else {
                self.isShowDialog = true
                self.isSuccess = false
                self.message = "No data or No response."
                return
            }
            if response.statusCode == 200 {
                self.isShowDialog = true
                self.isSuccess = true
                self.message = "Posted your activity!"
            } else {
                self.isShowDialog = true
                self.isSuccess = false
                self.message = "Status Code: " + String(response.statusCode)
            }
        }
        task.resume()
    }
}

struct SendActivityView: View {

    @State private var activityData: [ActivityModel] = []
    // 通信クラス宣言(イベント発行を受けられる)
    @ObservedObject var postActivity = PostActivity()

    var body: some View {
        List {
            ForEach(self.activityData){ activity in
                // 設定の場合は設定リスト画面へPush遷移
                if activity.name == "Settings" {
                    NavigationLink(destination: SettingsView()) {
                        ActivityCarouselView(activity: activity)
                    }
                } else {
                    // アクティビティの場合はボタンタップでSlackに投稿
                    Button(action: {
                        // Post actiity to Slack
                        self.postActivity.post(activity: activity)
                    }) {
                        ActivityCarouselView(activity: activity)
                    }
                }
            }
        }
        .alert(isPresented: $postActivity.isShowDialog) { () -> Alert in
            Alert(title: Text(postActivity.isSuccess ? "Success": "Failure"),
                  message: Text(postActivity.message),
                  dismissButton: .default(Text("OK")))
        }
        .listStyle(CarouselListStyle())
        .navigationBarTitle(Text("Activity List"))
        .onAppear {
            self.activityData = self.udConfig.loadActivityList()
        }
    }
}