$shibayu36->blog;

クラスター株式会社のソフトウェアエンジニアです。エンジニアリングや読書などについて書いています。

Daily Do 1.3.0でTODO追加&完了時に触覚フィードバックを追加しました & 実現方法の紹介

Daily Do 1.3.0で触覚フィードバックを追加して、操作感を向上させました。

Daily Doの1.3.0でTODO追加時と完了時に触覚フィードバックを追加しました。これにより操作の手応えを感じられるようになり気持ちよく操作できるようになるといいなと思います。

Download on the App Store

実現方法

SwiftUIのsensoryFeedbackモディファイアを使って実装した。iOS 17以降の機能で、UIKitに依存しない純粋なSwiftUI実装が簡単にできるのが良い。

TODO追加時の振動実装

struct TodoListView: View {
  @State private var triggerAddFeedback = false  // TODO追加時の振動フィードバックトリガー
  
  var body: some View {
    VStack {
      // 入力欄のUI
    }
    .background(.regularMaterial)
    .sensoryFeedback(.selection, trigger: triggerAddFeedback) // triggerAddFeedbackの値を変えることで振動を発生させる
  }
  
  private func addItem() {
    viewModel.addTodo(content: newItemText)
    newItemText = ""
    triggerAddFeedback.toggle() // TODO追加時の振動を発生させる
  }
}

TODO追加時は、triggerAddFeedbackというState変数を用意して、TODO追加のタイミングでtoggleしている。sensoryFeedbackモディファイアは、triggerの値が変化した時に振動するので、この仕組みで実現できる。

TODO完了時の振動実装

struct TodoRowView: View {
  let item: TodoItem
  
  var body: some View {
    HStack {
      // TODOの表示UI
    }
    .sensoryFeedback(.success, trigger: item.isCompleted) { oldValue, newValue in
      // 未完了→完了の時のみ成功フィードバックを発生させる
      !oldValue && newValue
    }
  }
}

TODO完了時は、item.isCompletedの値を直接triggerとして使っている。ただしここで工夫したのが、クロージャの部分だ。oldValue(変更前)とnewValue(変更後)を比較して、!oldValue && newValueの場合、つまり「未完了から完了に変わった時だけ」振動するようにした。

これによって、間違って完了したTODOを未完了に戻す時は振動せず、本当にタスクを完了した時だけ.successの振動が発生するようになった。

まとめ

今回はDaily Doの1.3.0で触覚フィードバックを追加した告知および実装方法を紹介しました。ぜひDaily Doも使ってみてください。