Flutterを使うことで得られる技術的知見について
- dart言語の習得
- Flutterを使ってモバイルアプリのバックエンドとフロントエンドの学習ができる
- モバイルアプリ(ios,Android)開発の流れを知る
- リリースまでの流れがわかる
- モバイルアプリの仕組みがわかる
- AndroidStudioの使用方法：追加
- Xcodeの使用方法：追加
- Firebaseの使用方法(主にバックエンドを担うつもりで使用しようと思っています。使わない可能性も。。)：追加
読み手のメリット
- Flutterでの開発方法がわかる。
- iosアプリ開発の過程がわかる。
- dart言語を利用してクロスプラットフォームでの開発がわかる。
- iosアプリのバックエンドとフロントエンドの構成がわかる。
- モバイルアプリのリリース方法までのやり方がわかる。
対象読者について
- Flutterをやってみたい人
- モバイルアプリの開発に興味がある人
- 柔軟に開発を行いたい人
Flutterのクロスプラットフォームを使ったモバイルアプリの開発方法について(随時更新)
開発する手順としては以下の通りです。
①Flutter開発環境の構築
②dart言語の基礎を学習
③Flutterを実際にいじってみる。
④いじりながら開発を行い修正するところや追加する部分は組み替えていく
①モバイルアプリケーションの開発環境の構築について
引用元：Flutter大学の開発環境構築
②dart言語の基礎を学習
- 簡単な記法
- for文
- 関数について
- データ型の付け方
③Flutterを実際にいじってみる
- ウィジェットの学習
- dart言語でのスクリプトの実装により動的にしてみる
- データベースの作成とテーブルの作成からデータの登録
④いじりながら開発を行い修正するところや追加する部分は組み替えていく
- 色やウィジェットの位置の微調整
- スクリプトにより制御や動的な仕組みを取り入れる
- データベースに複数のテーブルを追加することでデータへ柔軟性を持たせる
- その他必要な機能の追加と実装(チャット機能など)：追加
ここまでは基本前回と似た内容になっています。(前回記事に追記した部分は「：追加」を記載しています。)
実際に作成しした画面について
今回はチャットの画面と機能をメインに開発していきます。
ここではFlutterの便利なライブラリ「flutter_chat_ui」を使ってみての開発になります。
Flutterではモダンな作りができるに加えて工数削減で簡単に実装できる仕組みがあります。
①チャットの機能開発
チャット画面
チャットの一覧
ここで使用する技術や機能の想定
- 非同期処理
- アイコン
- メッセージ送受信機能
- 画像の添付処理、ファイルの送信処理
- 送信者、受信者名など
....他思いついたら機能を追加予定
## 環境依存ファイルについて
Flutterでは以下の環境依存ファイルがある。
- pubspec.yaml
上記へライブラリなどの追加をおこなったり変更した場合には以下のコマンドで変更の反映を行う
$ flutter pub get
使用したウィジェットについて
Stack
https://nzigen.com/reference/flutter/2018-04-18-stack/(使い方引用)
※メインの実装画面は現在は公開することができませんのでご了承ください。
今後も随時更新をしていきますのでぜひよろしくお願いします。参考になれば幸いです。