悩ましいUndo/Redo – 開発日記(43) - アイディア・レーン開発ブログ (Flutter Web)

2023/07/16

Undo、Redoの実装に着手

どうやって実装するか全体的に悩ましいが、中でもTextFieldのUndo/Redoの扱いが難しい。ネットを相当調べたりソースを読んだりしたが、なかなか良い感じに解決できていない。

TextFieldで元々使えるundo/redo機能を活用したかったが、カプセル化されていて他のClassから中が見られないので使い勝手が悪い。
残り回数なども見られずにただundo/redoが実行出来るだけなので、他のWidgetも含めた全体のUndo/Redo管理の観点では上手く利用できない。
さらにTextFieldで使えるundo/redo機能はどうも反応が悪い。特に１文字目がうまくUndo出来ない事がある。色々と試したが何かおかしい。いつかFlutter側で直りそうだが。。。
かといって全部自分で実装すると、文字入力の変化を全て捉えることになる。結果、一文字ずつのundo/redoになってしまう。それだと操作感がイマイチ。TextFieldの純粋なundoの場合、数文字まとめて元に戻してくれることがあるのだがそれを再現するのはどうしたらよいのか。

とかなり時間をかけて調べたつもりだが、結局のところUndoHistoryウィジェットのようなものを作って独自実装するしかないのか。。。

引き続きUndo、Redoの実装。

Undo、Redoは思ったよりも面倒だ。複数の挙動の組み合わせ(例えば下線と取り消し線は一度に両立しない)があれば一緒に元に戻すなど、考慮することがそれなりにある。。。

その他細かな挙動を修正。例えば拡大縮小率を覚えておき、次回起動時に自動読み込みが出来るようにした。それに合わせて設定関連のソースを一部リファクタリング。

設定関連の挙動はこれまでいきあたりばったりで複雑だったので、リファクタリング含め結構時間がかかった。目に見えた進捗は少ないが、整理されたり効率化された部分があるので良かった。

引き続きUndo・Redoの実装。

今日はアイディアのテキスト色変更について対応。Undo、Redoにまつわるアクション周りは現状かなり複雑な実装になっている。

最初は何かコマンドを実行するごとにStateをまるごと記憶すれば簡単だと思ったが、文字を打ったり何かするたびに全部覚えていたら、膨大な処理になってしまう。メモリも食うし処理も遅くなるだろう。

そうなるとやはり、まず記憶する範囲を狭める必要性がある。そうなると色々と整合性が崩れるので、何かコマンドを打つ→Undoが行われた、となったら「１つ前のコマンドの逆の処理をする」という挙動を実装せざるを得ない。

たとえばアイディアを１つ移動したら、それに伴って他のアイディアの場所も変更しないといけない。そうするとどこまで記憶するの？という話になるし、元に戻す動作も複雑になってくる。

引き続きUndo・Redoの実装。

今日はアイディアの移動の一部とインデント変更についてUndo・Redo対応した。
Undo・Redoまわりの複雑さを減らそうと試行錯誤したが、厳しい。そもそも難しい処理なのもありある程度の複雑さは許容が必要になりそう。

引き続きUndo・Redoの実装。

今日はアイディアの新規追加と、レーンをまたがるアイディアの移動についてUndo・Redo対応した。

結局、コマンドごとにDo / Undo / Redo とゴリゴリと処理を書いていくことになっている。めちゃくちゃ手間がかかるし大変だ。。。

引き続きUndo・Redoの実装。

今日はテキスト入力関連とリレーションア系のUndo・Redo統合にトライ。

この時点のUndo/Redo系対応状況

引き続きUndo・Redoの実装。

今日はチェックボックスモードON/OFFとチェック状態のON/OFF、リレーションの文字及び矢印の指定、リレーションの削除、レーンのサイズ変更、キャンバスのタイトル指定のUndo・Redoに対応

それ以外ではツリーの描画処理を修正。以前はhiddenアイディアが無かったので、新しく考慮しなければならなくなっていた。とても面倒だ。。。（hiddenアイディアとは、存在はするが見た目は何もなく、マウスオーバーすると薄い枠が出て入力可能になるもの）

※本記事は当時の記録をもとに作成し、必要に応じて加筆・補足しています

記事の通りコツコツ作った、テキストベースの思考整理ツール「アイディア・レーン」最新版はこちら。