再実装Flutter UIフレームワークをゼロから自作する
発売日: 2023/1/27
想定ページ数: 312ページ
ISBN: 9784295601746
全文検索: 対応
★★★★★
★★★★★
0件
-
-
-
-
Widgetを組み合わせるだけでさまざまな画面を作ることができるFlutterですが、なぜそのようなことが可能なのでしょうか。「setState()の魔法」で簡単に画面を書き換えられるのがFlutterですが、なぜそのようなことが可能なのでしょうか？
本書ではFlutterを自身で1から実装し直し、「Flume」という新たなUIフレームワークを作ります。再実装を通じて、UIフレームワークを支える複雑な世界と、Flutterの高速動作を支える差分更新システムの理解を目指します。
Flutter自体はすでに巨大かつ複雑なソフトウェアであり、隅々まで実装するのは困難です。そのためFlumeでは本質的に重要な機能のみをピックアップして説明・実装することにします。
またFlutterのEngineとフレームワークがどのような関係になっているのか、画面をいかに効率的に更新しているのかについて進み、それらを実装していきます。最終的には、自作のフレームワークでsetState()を使った○×ゲームを作ることができるようになります。
機能を絞るため、もちろん実用に足るフレームワークを作ることは叶いません。しかしUIの管理手法というのはFlutterだけでなくWebフレームワークやブラウザ、AndroidやiOSなどのネイティブアプリでも共通して利用されています。まずはシンプルなFlumeの仕様を理解することで、本家Flutterや他のフレームワークのコードを理解する後押しになることを目指しています。
【目次】
第1章 画面の表示とSkiaによる描画
第2章 Skiaで遊ぼう
第3章 TaskRunnerの実装
第4章 Layerツリーの実装と表示
第5章 RenderツリーからLayerツリーの構築
第6章 色々なRenderObject
第7章 Elementツリー・Widgetツリーの構築1
第8章 Elementツリー・Widgetツリーの構築2
第9章 テキストの表示
第10章 runAppとWidgetsFlutterBinding
第11章 Engineの隠蔽と画面の更新タイミング
第12章 Engineのキー入力対応
第13章 markNeedsPaint()
第14章 markNeedsLayout()
第15章 WidgetにGenericsを適用しよう
第16章 Widgetツリーの差分計算1
第17章 Widgetツリーの差分計算2
第18章 StatefulWidgetとStatelessWidgetの実装
第19章 ○×ゲームを作ってみよう
第20章 ポインターイベントの処理
第21章 アニメーションの実装
第22章 InheritedWidgetの実装
第23章 ○×ゲームを進化させよう
目次プレビュー
- はじめに
- 第1章 画面の表示とSkiaによる描画
- 第2章 Skiaで遊ぼう
-
1.1 Skiaとは？
-
1.2 LWJGL+GLFW
-
1.3 プロジェクトの用意
-
1.4 画面を作る
-
2.1 図形の描画
-
2.2 文字の描画
-
2.3 移動・変形
-
2.4 状態の保存と復元
-
2.5 透明度の適用
-
2.6 切り取り
-
4.1 Layerツリーとは？
-
4.2 Layerツリー描画の詳細
-
4.3 レイアウトに関する寸法の表現
-
4.4 実装計画
-
4.5 寸法用のクラスを実装する
-
4.6 レイヤを実装する
-
4.7 Layerツリーを表示する
-
4.8 さまざまな効果をもつレイヤを追加
-
4.9 発展
-
6.1 RenderPositionedBox
-
6.2 RenderFlex
-
6.3 RenderCustomClip
-
7.1 3つのツリー
-
7.2 各ツリーの根
-
7.3 Elementツリー生成の流れ
-
7.4 Elementツリーの登場人物
-
7.5 実装計画
-
7.6 RenderObjectを修正する
-
7.7 Elementを実装する
-
7.8 利用するWidgetを実装する
-
9.1 RichTextについて
-
9.2 実装計画
-
9.3 RenderParagraphを実装する
-
9.4 RichTextの実装
-
9.5 テキストを表示してみる
-
11.1 Engineの隠蔽方法
-
11.2 scheduleFrameとvsyncによる画面更新
-
11.3 実装計画
-
11.4 Layerツリーをディープコピーできるようにする
-
11.5 TaskRunnerの修正
-
11.6 インターフェスの定義
-
11.7 WidgetsFlumeBindingの修正
-
11.8 Shellの修正
-
11.9 runFlume()の実装
-
11.10 main関数の修正
-
12.1 キーイベントとは
-
12.2 EngineからFrameworkへのキーイベントの受け渡し
-
12.3 実装計画
-
12.4 KeyEventの実装
-
12.5 KeyboardControllerの実装
-
12.6 GLViewの修正
-
12.7 WidgetsFlumeBindingの修正
-
12.8 Shellの修正
-
12.9 キーボードを使って信号機を点滅させる
-
16.1 Elementツリーのリビルド
-
16.2 根ノードの更新の流れ
-
16.3 ひとつの子をもつElementの更新の流れ
-
16.4 RenderObjectの一生
-
16.5 実装計画
-
16.6 RenderObjectの更新
-
16.7 各RenderObjectのプロパティーの修正
-
16.8 Widgetの更新
-
16.9 BuildOwnerの実装
-
16.10 Elementの更新
-
16.11 RenderObjectElementの更新
-
16.12 RenderObjectToWidgetElementの更新
-
16.13 SingleChildRenderObjectElementの更新
-
16.14 WidgetsFlumeBindingの修正
-
16.15 動かしてみる
-
18.1 ComponentElementの生成と更新
-
18.2 StatelessElementとStatefulElement
-
18.3 実装計画
-
18.4 BuildContextの実装
-
18.5 StatelessWidgetの実装
-
18.6 StatefulWidgetの実装
-
18.7 ComponentElementの実装
-
18.8 StatelessElementの実装
-
18.9 StatefulElementの実装
-
18.10 信号機をStatefulWidgetで書き直してみよう
-
21.1 Flutterのアニメーション利用
-
21.2 アニメーションシステムの内部構造
-
21.3 実装計画
-
21.4 TimingMeasurerとFrameworkへのタイムスタンプの受け渡し
-
21.5 transientCallbacksの実装
-
21.6 CurveとSimulationの実装
-
21.7 TickerとTickerProviderの実装
-
21.8 AnimationControllerの実装
-
21.9 FadeTransitionの実装
-
21.10 押すとアニメーションする箱を作る
-
22.1 InheritedWidgetとは
-
22.2 _updateInheritance()とInheritedElement
-
22.3 InheritedWidgetにアクセスする
-
22.4 実装計画
-
22.5 BuildContextの修正
-
22.6 Elementの修正
-
22.7 InheritedElementの実装
-
22.8 InheritedWidgetの実装
-
22.9 InheritedWidgetを用いたアプリケーションの作成
試し読み
試し読み
試し読み
試し読み
