一つづつ実装していく

https://zenn.dev/kazutxt/books/flutter_practice_introduction/viewer/04_chapter1_outline

Demo分析

  • StatelessWidget 親クラス
    • 状態(State)を持たない静的Widget
  • Widget
    • 自身のUIの構成情報と子Widgetをfinalなフィールドとして保持するImmutableなクラス。createElement()メソッドによってElementを生成、createRenderObject()によってRenderObjectを生成。

以下がエントリーポイントっぽい

void main() {  
  runApp(const MyApp());  
}

画面作成

動機

Iphone 向けのドット絵ツール作りたいなと思ったから。

資料

https://zenn.dev/kazutxt/books/flutter_practice_introduction

環境整備

https://docs.flutter.dev/get-started/install/macos 公式はパッケージマネージャ使ってない感じだったので、Homebrew から導入 https://formulae.brew.sh/cask/flutter v3.10.4

brew install --cask flutter

インストール後、以下コマンドで確認していく

flutter doctor

最初は送らないけど、二回目以降はデータ送るぽい。設定無効化しておく

  ║ Flutter tool analytics are not sent on the very first run. To disable      ║
  ║ reporting, type 'flutter config --no-analytics'. To display the current    ║
  ║ setting, type 'flutter config'. If you opt out of analytics, an opt-out    ║
  ║ event will be sent, and then no further information will be sent by the    ║
  ║ Flutter tool.

flutter config --no-analytics

たまたま以下以外はOKだった。しばらくは Android 向けは試さないので、このままいく

[!] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for more details.

IntelliJ で Plugin インストール

  • Flutter
  • Dart (Flutter を選択すると依存関係で勝手にインストールされる)

New Project から Flutter Project を作成 SDKの場所を問われ、以下で通った

/usr/local/Caskroom/flutter/3.10.4/flutter

どうやらできたっぽい

iOS の Simulator が起動しない問題

Unable to find application named ‘Simulator.app’

コマンドラインツールがきどうしてないっぽい。 Xcode を起動し追加ツールインストールで動作を確認

欲しい画面

  • 起動画面
  • 一覧表示画面
  • 描画画面
  • エクスポート画面

最低限欲しい機能

  • タッチでドットを描く機能
  • ファイルロード・書き込み
  • エクスポート