データを更新・削除してみようは医療関係者向けだけの内容ですか。

医療分野の例が含まれる場合もありますが、医療関係者だけに限定した内容ではありません。生成AI、AI活用、DX、業務改善、プロトタイプ開発など、一般的なAI学習の事例として読める内容です。

AI初心者でも読めますか。

はい。AIをこれから学ぶ方、数学が苦手な方、仕事でAIを使いたい方にも読み進めやすいように、教材の章と節の流れに沿って整理しています。

サムネイル画像は必ず表示されますか。

はい。教材にcoverUrlが設定されている場合はその画像を表示し、未設定の場合は代替サムネイル画像を表示します。

Flutterアプリケーション開発概論のほかの章も読めますか。

はい。教材トップから章立てを確認でき、前後の節へもページ下部のナビゲーションから移動できます。

データを更新・削除してみよう | Flutterアプリとデータベース連携入門｜アプリのデータを残す仕組み | Flutterアプリケーション開発概論・生成AIオンライン教材

項目	内容
教材名	Flutterアプリケーション開発概論
章	Flutterアプリとデータベース連携入門｜アプリのデータを残す仕組み
節	データを更新・削除してみよう
カテゴリ	Flutter / iOS / Android / MacOS / Windows / 基礎から学ぶ / 開発 / アプリ開発
学習内容	生成AI、AI活用、DX、業務改善を実践しながら理解するための教材です。

この章で学ぶこと

この章では、保存したデータをあとから変更したり、削除したりする考え方を学びます。

最初に覚えることは、これだけです。

更新 = すでにあるデータを変える
削除 = いらなくなったデータを消す

Todoアプリで考えると、次のような操作です。

未完了 → 完了にする
タスク名を編集する
いらないTodoを削除する

9-1. 完了状態を切り替える

Todoアプリでは、タスクが終わったら「完了」にします。

例えば、最初はこの状態です。

□ レポートを書く

レポートを書き終わったら、チェックします。

☑ レポートを書く

このとき、データベースでは is_done を変更しています。

is_doneとは？

is_done は、Todoが完了したかどうかを表すデータです。

false = 未完了
true = 完了

データベースでは、このように保存されます。

id	title	is_done
1	レポートを書く	false

チェックを押すと、こうなります。

id	title	is_done
1	レポートを書く	true

つまり、完了状態を切り替えるとは、is_done の値を変えることです。

完了状態を切り替える流れ

流れはこうです。

1. チェックボックスを押す
2. Flutterが対象のTodoを確認する
3. is_doneを反対にする
4. データベースを更新する
5. 画面も更新する

例えば、false なら true にします。

false
↓
true

逆に、完了を取り消す場合は true を false に戻します。

true
↓
false

コードの考え方

実際の処理は、このようなイメージです。

final bool newValue = !todo.isDone;

! は、反対にするという意味です。

!false = true
!true = false

チェックボックスの切り替えでよく使います。

9-2. データを編集する

データを編集するとは、すでに保存されている内容を変更することです。

Todoアプリなら、タスク名を変える操作です。

例えば、変更前です。

レポートを書く

変更後です。

英語のレポートを書く

このように、内容を書き換えることを更新と呼びます。

編集の流れ

Todoを編集する流れは、こうです。

1. 編集したいTodoを選ぶ
2. 今のタイトルを入力欄に表示する
3. 新しい文字に書き換える
4. 保存ボタンを押す
5. データベースを更新する
6. 一覧表示を更新する

大事なのは、どのTodoを編集するかです。

そのために id を使います。

id: 1 のTodoを編集する

idを使う理由

同じ名前のTodoが2つある場合を考えます。

レポートを書く
レポートを書く

名前だけでは、どちらを編集するのか分かりません。

そこで、id を使います。

id: 1 レポートを書く
id: 2 レポートを書く

これなら、正確に1件を選べます。

編集で変えるデータ

Todo編集でよく変えるのは、次のデータです。

title
is_done
updated_at

updated_at は、最後に更新した日時です。

最初は必須ではありませんが、あとから管理しやすくなります。

9-3. データを削除する

削除とは、いらなくなったデータを消すことです。

Todoアプリなら、終わったTodoや不要なTodoを消します。

例えば、削除前です。

□ レポートを書く
□ 買い物に行く
□ 英単語を覚える

「買い物に行く」を削除すると、こうなります。

□ レポートを書く
□ 英単語を覚える

削除の流れ

Todoを削除する流れは、こうです。

1. 削除ボタンを押す
2. Flutterが対象のTodoを確認する
3. idを使ってデータベースから削除する
4. 一覧から消す

ここでも大事なのは id です。

id: 2 のTodoを削除する

このように指定すると、正確に削除できます。

画面だけ消すのではなく、データベースから消す

ここは大事です。

画面から消しただけでは、データベースに残っている場合があります。

画面から消えた
↓
でもデータベースには残っている
↓
次に読み込むとまた表示される

そのため、削除するときは、データベース側のデータも削除します。

9-4. 削除前に確認する理由

削除は、取り返しがつかないことがあります。

そのため、実際のアプリでは、削除前に確認画面を出すことがあります。

本当に削除しますか？

ユーザーが間違えて削除ボタンを押してしまうことがあるからです。

確認画面が必要な場面

特に、次のようなデータは確認した方が安全です。

予約情報
注文履歴
ユーザー情報
大切なメモ
長文の記録
仕事で使うデータ

Todoのような軽いデータでも、確認があると安心です。

確認画面の流れ

削除確認の流れは、こうです。

1. 削除ボタンを押す
2. 確認画面を表示する
3. 「キャンセル」なら何もしない
4. 「削除する」ならデータベースから削除する

ユーザーに選ばせることで、誤操作を防げます。

確認メッセージの例

シンプルで分かりやすい文章にします。

このTodoを削除しますか？

ボタンは、分かりやすく分けます。

キャンセル
削除する

危険な操作は、はっきり伝えることが大切です。

実装イメージ

完了状態を切り替える処理のイメージです。

Future<void> toggleTodo(Todo todo) async {
  final bool newValue = !todo.isDone;

  // データベースの is_done を更新する
}

削除処理のイメージです。

Future<void> deleteTodo(String id) async {
  // idを使ってデータベースから削除する
}

削除前確認のイメージです。

final bool? result = await showDialog<bool>(
  context: context,
  builder: (context) {
    return AlertDialog(
      title: const Text('確認'),
      content: const Text('このTodoを削除しますか？'),
      actions: [
        TextButton(
          onPressed: () => Navigator.pop(context, false),
          child: const Text('キャンセル'),
        ),
        TextButton(
          onPressed: () => Navigator.pop(context, true),
          child: const Text('削除する'),
        ),
      ],
    );
  },
);

if (result == true) {
  // 削除する
}

最初は、細かいコードを全部覚えなくて大丈夫です。

大事なのは流れです。

選ぶ
↓
確認する
↓
更新・削除する
↓
画面を更新する

よくある勘違い

チェックを押したら画面だけ変えればよい？

画面だけ変えても、データベースに保存されていなければ、次に開いたときに戻ってしまいます。

画面だけ完了
↓
データベースは未完了
↓
再読み込みすると未完了に戻る

完了状態は、データベースにも保存します。

タスク名で更新・削除してもよい？

基本的には、id を使うのがおすすめです。

同じタスク名があると、間違ったデータを更新・削除する可能性があります。

idで指定する
↓
安全

削除確認は面倒だから不要？

練習アプリなら省略してもよいです。

ただし、実際に人が使うアプリでは、削除確認がある方が安全です。

特に、仕事や予約、顧客情報などは慎重に扱います。

インストールや準備について

この章では、新しいインストール作業はありません。

実装に進む場合は、これまでと同じ準備を使います。

Flutter SDK
Visual Studio Code
Supabase
supabase_flutter

参考URLです。

Flutter公式インストール
https://docs.flutter.dev/install

Flutter × VS Code
https://docs.flutter.dev/tools/vs-code

Supabase Flutter Quickstart
https://supabase.com/docs/guides/getting-started/quickstarts/flutter

supabase_flutter
https://pub.dev/packages/supabase_flutter

この章では、まず更新と削除の考え方を理解できればOKです。

9-5. この章のまとめ

この章では、データの更新と削除を学びました。

更新とは、すでにあるデータを変更することです。

未完了 → 完了
タスク名を変更する