とらのメモ

IT関係やガジェットについての雑記

最近Flutterの勉強をしたまとめ

最近業務で使う予定のあるFlutterを勉強したので、そのまとめ

Swiftでのアプリ開発経験を主にしているので、それに照らし合わせながら勉強していくのが主な勉強方法です。
まだ勉強中なので不定期で更新します。

Flutterって何？

Flutterとは、2017年にGoogleが発表したオープンソースのモバイルアプリケーションのフレームワーク。

Flutterを用いることで、Android/iOS/Webの3種類を全く同じコードで開発することができ、非常に高い生産性を実現できる。

Flutterのあれこれ

initState をオーバーライドする

// NG

class _ThemeModeSelectionPageState extends State<ThemeModeSelectionPage> { ThemeMode _current = widget.mode // これはエラー 
@override 

------
// OK

class _ThemeModeSelectionPageState extends State<ThemeModeSelectionPage> { 
void initState() {
    super.initState();
     _current = widget.mode; 
}
@override

UserDafaultのようなもの(アプリを消すまで端末固有に持たせる変数)

変数のアンダーバー

Dartの変数名の先頭の(アンダーバー _ )はプライベート変数であることを示す。

int _counter = 0;

Swiftで書くと

private var counter: Int = 0

と同等の意味。 Dart vs Swiftを見るとわかりやすい。

エラー発生箇所

パッケージのバージョンエラー

# Error: Cannot run with sound null safety, because the following dependencies don't support null safety

原因: パッケージがNull Safety に対応していないバージョンのため ex) http パッケージのサイト https://pub.dev/packages/http/versionsを確認 versionタブを確認→ プロジェクトフォルダ/pubspec.yaml からパッケージをNull Safetyのマークのあるバージョンまで上げる。

パッケージのインストール

基本的に https://pub.dev/packages を参照して最新バージョンを利用する。 サイトからパッケージのバージョンを確認して, Null Safetyマークが ついているバージョンをpubspec.yml の dependencies　直下に記載する

dependencies:s
    http: ^0.12.0+4

terminalで下記コマンド

flutter pub get

Webブラウザ版のAPIリクエスト

MacBook pro(AndroidStadio)で、シミュレータにChromeを選択して実行。 クライアントの問題で基本的にXMLHttpRequest errorが出ると思われる。 回避方法はあると思われるが、簡単な対策としてWebブラウザ以外で実行すると通る。

テストの書き方

UIを表示して動作確認を行うIntegrationテストの他にもより単体で行うことができるテストがある。 1. Unitテスト(単体テスト) 2. Widgetテスト 3. Integrationテスト

Zen: https://zenn.dev/kazutxt/books/flutter_practice_introduction/viewer/beginner_test 公式: https://docs.flutter.dev/cookbook/testing

その他参考になった資料