カテゴリ一覧 著者一覧
再実装Flutter UIフレームワークをゼロから自作する
0件
2,750円(税込)
獲得ポイント: 28pt
通常:
28pt

再実装Flutter UIフレームワークをゼロから自作する

発売日 : 2023年1月27日
想定ページ数 : 312ページ
ISBN : 9784295601746
ダウンロード : PDF EPUB
全文検索 : 対応
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による描画
1.1 Skiaとは?
1.2 LWJGL+GLFW
1.3 プロジェクトの用意
1.4 画面を作る
第2章 Skiaで遊ぼう
2.1 図形の描画
2.2 文字の描画
2.3 移動・変形
2.4 状態の保存と復元
2.5 透明度の適用
2.6 切り取り
第3章 TaskRunnerの実装
3.1 マルチスレッドについて
3.2 Flutterの内部構造
3.3 実装計画
3.4 Task Runnerを実装する
3.5 GLViewを実装する
3.6 Rasterizerを実装する
3.7 Shellを実装する
3.8 mainからEngine関連のコードを呼ぶ
第4章 Layerツリーの実装と表示
4.1 Layerツリーとは?
4.2 Layerツリー描画の詳細
4.3 レイアウトに関する寸法の表現
4.4 実装計画
4.5 寸法用のクラスを実装する
4.6 レイヤを実装する
4.7 Layerツリーを表示する
4.8 さまざまな効果をもつレイヤを追加
4.9 発展
第5章 RenderツリーからLayerツリーの構築
5.1 描画パイプライン
5.2 Renderツリーとは?
5.3 RenderツリーからLayerツリーの生成手法
5.4 ボックスレイアウトモデルと制約
5.5 実装計画
5.6 PaintingContextを実装する
5.7 BoxConstraintsを実装する
5.8 RenderObjectを実装する
5.9 RenderPipelineを実装する
5.10 Renderツリーから画面を描画する
第6章 色々なRenderObject
6.1 RenderPositionedBox
6.2 RenderFlex
6.3 RenderCustomClip
第7章 Elementツリー・Widgetツリーの構築1
7.1 3つのツリー
7.2 各ツリーの根
7.3 Elementツリー生成の流れ
7.4 Elementツリーの登場人物
7.5 実装計画
7.6 RenderObjectを修正する
7.7 Elementを実装する
7.8 利用するWidgetを実装する
第8章 Elementツリー・Widgetツリーの構築2
8.1 実装計画
8.2 複数の子をもつRenderObjectの修正
8.3 MultiChildRenderObjectElementを実装する
8.4 利用するWidgetを実装する
8.5 信号機をWidgetツリーで構築する
第9章 テキストの表示
9.1 RichTextについて
9.2 実装計画
9.3 RenderParagraphを実装する
9.4 RichTextの実装
9.5 テキストを表示してみる
第10章 runAppとWidgetsFlutterBinding
10.1 runApp()
10.2 WidgetsFlutterBindingとは?
10.3 実装計画
10.4 runApp()とEngineの準備
10.5 Shellの修正
10.6 WidgetsFlumeBindingの実装
10.7 main関数でrunApp()を呼ぶ
第11章 Engineの隠蔽と画面の更新タイミング
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章 Engineのキー入力対応
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 キーボードを使って信号機を点滅させる
第13章 markNeedsPaint()
13.1 flushPaintで行われていること
13.2 実装計画
13.3 RenderObjectの更新
13.4 PaintingContextの実装
13.5 RenderPipelineの実装
13.6 子をもつRenderObjectのinterfaceの更新
13.7 Elementの更新
13.8 各RenderObjectの修正
13.9 WidgetsFlumeBindingの実装
13.10 画面の表示
第14章 markNeedsLayout()
14.1 ノードのdepth
14.2 RelayoutBoundary
14.3 実装計画
14.4 BoxConstraintsの更新
14.5 RenderObjectの更新
14.6 RenderPipelineの更新
14.7 RenderObjectのinterfaceの更新
14.8 各RenderObjectの更新
14.9 プログレスバーのようなものの作成
第15章 WidgetにGenericsを適用しよう
15.1 Dartのオーバーライドの柔軟性
15.2 Genericsによる代替
15.3 実装計画
15.4 RenderObjectWidgetの更新
15.5 各Widgetの更新
15.6 Elementの更新
第16章 Widgetツリーの差分計算1
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 動かしてみる
第17章 Widgetツリーの差分計算2
17.1 複数の子の差分計算
17.2 実装計画
17.3 各RenderObjectの更新
17.4 Widgetの更新
17.5 updateChildren()の実装
17.6 MultiChildRenderObjectElementの更新
17.7 信号機を動かしてみる
第18章 StatefulWidgetとStatelessWidgetの実装
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で書き直してみよう
第19章 ○×ゲームを作ってみよう
第20章 ポインターイベントの処理
20.1 PointerEventとは
20.2 Widgetへの分配
20.3 実装計画
20.4 Engineの修正
20.5 HitTest周りのクラスを追加
20.6 RenderObjectの修正
20.7 Listenerの実装
20.8 WidgetsFlumeBindingの修正
20.9 ポインタの動きを追うアプリを作る
第21章 アニメーションの実装
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章 InheritedWidgetの実装
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を用いたアプリケーションの作成
第23章 ○×ゲームを進化させよう

ユーザーレビュー

レビューがありません
書籍をシェアする