Flutter Challenge!💥 練習編

参考にしている書籍やサイトなど Flutter実践入門 スマホで動くアプリを作ろう!ゼロから始めるFlutter実践入門編 ※1~3含めて Flutter 日本語ドキュメント STEP1 開発機の選定。 マウス・キーボードの設定。 Homebrewのインストール。 AndroidStudioのインストール。 Gitのインストール。 ローカル&リモートリポジトリの設定。 教材の選定。 STEP2 画像と文字を画面に表示するアプリを作成(写経+アレンジ)。 意義:基本的な使い方を把握する。 assets/を作成して画像をコピーしてくる。ymlを書き換えて画像ファイルを認識させる。 Image()で画像を表示。 Text()で文字を表示。 body: Centor()(全体配置)、Column()(縦配置)、Row()(横配置)でレイアウト。 MainAxisAlignment.で配置パターンを設定。 child: []とchildren: []で入れ子構造の設定。 リポジトリ:flutter_practice_display STEP3 名前と日付を入力することで、生まれてから現在までの日数を計算するアプリを作成(写経+アレンジ)。 意義:async・awaitの処理に触れる。小技を覚える。画面遷移の手法やその書き方を身につける。 appbar:で画面上端のバー+テキストを表示。 StringとDateTimeの型で変数生成。 InputDecoration()でテキスト入力欄のデザイン設定。 print()でconsoleに値を出力。デバッグでも有効。 Icon:でアイコンを表示。 Padding()で4方向のレイアウト調整。 SingleChildScrollView()画面内に治まらない時のスクロールに対応。 if文でnull回避。hoge!にてnullで無いことの証明。 TextField()やShowDatePicker()を使用して入力パターンを設定。 onPressed:を使用してタップ動作の検知。 aysncとawaitを使用して動作に時間差があるデータの格納に対応(カレンダーを表示する→日付を選択する)。 新たなclassを作成。 lib/に.dartファイルを追加して、新たな画面を作成。 変数の作成、変数の画面間渡し。 Navigator.push()とMaterialPageRoute(builder: (context) =>)を使用してmain.dartから画面遷移。 リポジトリ:flutter_practice_calc STEP4 本記事の初回作成。 プロフィールを表示して、シェアするアプリを作成中(写経+アレンジ)。 意義:パッケージの導入方法とその適用の勘所を身につける。例外処理、async・awaitの処理に慣れる。 url_launcherパッケージのインストールと適用。 launchURLでメールアプリの自動起動と適用するテキストを設定。 Future<void>、async、awaitで時間がかかる処理の対応。 if + throwで例外処理。 fontSize:とfontWeight:で、文字の大きさと強さを変更できる。 share_pluspackageを導入して、シェア動作を入れる。 screenshotpackageを導入して、スクリーンショットを取る動作を入れる。 path_providerpackageを導入して、スクリーンショットのデータとのパスを繋ぐ。 backgroundColor:で背景色を指定する。 下記のErrorが発生。SDKの紐づけが出来ていなかった(NoSDK)のが原因っぽい。File→Project Structureで、SDKを設定したところ、解消された。 参考サイト:Android Studioで作成したFlutterプロジェクトがGradleまわりのErrorを… Cannot resolve symbol 'Properties' Cannot resolve symbol 'Properties' 書くコードの量が多くなってきており、手間取った。また入れ子構造への理解が薄い、VScodeもまだ使い慣れているとは言い難いので、時間を要してしまう。 リポジトリ:flutter_practice_share...

August 19, 2022 · rinyacho

Flutter Challenge!💥

Dart+Flutterを使用したAndroid、iPhoneのアプリ開発にチャレンジしてみようと思います。 Flutterをおさらい FlutterはWindows、MacOS、Linux、iPhone、Android、向けにアプリケーションを開発できるSDK(Software Development Kit・ソフトウェア開発キット)です。特に近年スマートフォンアプリの開発で注目されています。通常、スマートフォンのネイティブアプリの開発では、AndroidではKotlin+Android Studioが、iPhoneではSwift+Xcodeをが使用されると思います。しかし、Dart+FlutterではどちらのスマートフォンOSにも対応した開発をすることができます。DartはFlutterで使用される言語ですね。 クロスプラットフォーム開発への憧れ Java+Android StudioでAndroidアプリの教本に載っているアプリを写経+アレンジしたことがありますが、それだけでもやることが多く、それなりに大変だった記憶があります。しかも、当たり前ですが、Androidでしか動作しません。それが、共通のソースコードでAndroid、iPhoneのどちらにも対応できるなんて、何てお得💴なんだと思いました。お得なものは、みんな使用したくなりますよね! それぞれの機器それぞれが持つ値のI/Oなど、仕様が異なる部分が盛りだくさんだと思うのですが、その辺りをどのように解決していくのか、楽しみでもあります。今のところ、センサーの値の引っ張ってきて何かをする予定はありませんが。 新しいものへの興味 Dartは2011年、Flutterは2017年に開発されたもので、比較的新しい開発手法です。何事もそうですが、新しいものに興味をソソられます。従来のものとはどのように差があるのか、どんな問題を解決していて、逆にどんな弱点があるのか、完全な上位互換なのか等が気になるタイプです。また、新しいということは、触れている人が少ないということでもあります。それは自分の個性の取得に繋がるかもしれませんし、まだ多くの人が見ていない景色を見ることが出来るかもしれません。未開の地🌏って、ワクワクしますよね。無人島だけが冒険じゃないんだぜ! 尚、体系化された日本語リファレンスが圧倒的に少ないとうデメリットもあります。英語の公式ドキュメントを何とか読み解くか、数少ない日本語の参考資料を自分なりに繋げていく作業が必要になりそうです。 2022/09/01更新:日本語の公式ドキュメントありました。リサーチ不足でした😇 スマートフォンアプリ開発の実績の解除🎮 これから就職活動を行っていく上で、何が必要なのか、求人を見ながら考えました。条件等が合致しそうな企業の中に、スマートフォンのアプリ開発経験が必要なところがありましたので、その実績解除が出来れば良いと考えました。しかも、言葉の捉えようによってはAndroid、iPhoneのどちらのアプリも開発した実績を得ることが出来るので、お得だなという思いもありました(本当に捉え方次第ですが😂)。 スマートフォンというデバイスの面白み📱 パソコンやスマートフォン、VRゴーグルやグラス、時計や指輪等、色々なIT機器が出ています。その中でも、人の生活に溶け込んだデバイスをプラットフォームとした開発は、面白いのではと思っています。人がそのデバイスを頼りにする機会も多く、また直感的な操作感覚やその体験を、より直に感じやすいのではと思っています。UI/UXの凝り甲斐がありますね(挫折フラグ🚩)。 また、スマートフォンは圧倒的に普及しているデバイスなので、その広がりの大きさも魅力的だと思いました。作ったアプリケーションを、ITやその機器に詳しくないような、自分の身近な人に使って貰える可能性があるって、ステキじゃないですか! 尚、挫折する可能性もありまして。。。 色々書きましたが、まずは最低限の機能で作っていくと思います。挫折が一番怖いですからね。 暖かく見守っていただき、挫折したなと見受けられる時はGitHubにスター🌟ください! リリースできた時は倍スター🌟ください!

August 14, 2022 · rinyacho