こんな感じになります やり方 オンラインコードサンドボックスの Zapp を使用します。 zapp.run 埋め込みコードの取得 上記にアクセスし、右上のGet Startedか、真ん中のView All Templatesを押します。 テンプレートが表示されるので、Flutterを選択します…

flutter_inappwebview | Flutter Package webview_flutterではスクロールイベントを取得できないので、flutter_inappwebviewを使う。(onScrollChangedプロパティ) mobile - How to hide BottomNavigationBar when scrolling - Flutter - Stack Overflow Anim…

Full-screen dialogとは？ 通常はNavigator.pushを行うと右側から左側（←方向）に次のWidgetが入り込んでくるが、MaterialPageRouteのfullscreenDialogを使うと下側から上側（↑方向）に向かって次のWidgetが入り込んでくるようにできる。 See the Pen by pop…

ButtonなどはonPressedやonTapをnullにすれば非活性化するが、複数の要素へのユーザー操作を無効にしたい場合はAbsorbPointerやIgnorePointerが便利。 AbsorbPointer class - widgets library - Dart API IgnorePointer class - widgets library - Dart API …

flutter_styled_toast ? 上からひょこっと出てくる通知領域的な何かを実装するためのパッケージ。 pub.dev やり方 showToastWidgetで指定するWidgetをCardWidgetにして、elevationを0より大きい値にする。shapeにRoundedRectangleBorderを指定することで角を…

デモ See the Pen flutter_estimate_brightness by popy1017 (@popy1017) on CodePen. 手順 1. 背景色が明色か暗色かを判定する ThemeData.estimateBrightnessForColor(backgroundColor);を使う。 final Brightness brightness = ThemeData.estimateBrightne…

SnackBar.shapeにRoundedRectangleBorderを指定する。 SnackBar( content: ~~~ shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(40.0), ), ~~ ); See the Pen flutter_snackbar_sample by popy1017 (@popy1017) on CodePen.

Flutter2からボタンの色は、MaterialAppのTheme.primarySwatchに引っ張られるようになった。 デザインの統一性を持たせるためには便利になったが、ボタン単体で色(primaryColor)を変えるには、以下のようにする。 TextButton( onPressed: (){}, child: Text(…

完成図 const double size = 300; const double padding = 20; class Home extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.spaceAround, …

1.22から2.0系への変更は地道な作業や検索してもあまりジャストな解決策がないものが多いので、時間がたっぷり取れるときにやったほうがいい。 null-safetyへの対応 パッケージ ※具体的な進め方は調べるとたくさん記事が出てくるので割愛。 以下でも説明され…

ファイルのアップロード 下記によれば、 Simple upload Multipart upload Resumable upload の3種類の方式があるが、3つ目の方式をgoogleapiパッケージを使ってやろうとしたところ、無理そうだと言うことがわかった。 パッケージを使って簡単にやるのが無理…

実装した物 github.com 方針 閉じたいWidgetに画面遷移(またはモーダル表示)する スクロール位置に応じてそのWidgetを閉じる 画面遷移 閉じたいWidget(ソースコード: SliverItemView)を表示する方法としては、以下の3パターンを検討。 Navigator.push(contex…

(先に)結論 以下にDocumentが用意されているが、iOS(最近のiPhone)では根本的な解決には至っていない模様。 (2021/01/31現在) flutter.dev Androidでは上記で紹介されている対処方法で解決することができる模様。 現象 以下のように、初回のアニメーションに…

ReorderableListViewは標準で実装されているがReorderableGridViewは現状ないので、pub.devでパッケージを調査。 関連パッケージとしては、以下3つのパッケージ(+1ソースコード)が見つかった。 (他にあったら教えてください ) drag_and_drop_gridview reorde…

今年の1月くらいから勉強を初めて、3〜4月くらいに作り始めたFlutterアプリがようやくAppleの厳しい？審査を経て世に出ました。長かった。。。 Flutterを勉強し始めたきっかけ 結論: いろいろなやり方を試してみて、Flutterが一番とっつきやすいなと思ったか…

半年くらいだらだら続けてきたFlutterアプリ開発だが、ついに審査に出すことができた。 しかし、AppStoreの謎のリジェクト（時間かかってるから連絡するまで待っててね❤️）をくらった。 そして昨日、噂通りにしばらく待つと再度レビュー中になり、本日無事リ…

審査までの流れ iOSアプリを登録、申請して公開するまで スクリーンショットの作成 App Store提出用のスクリーンショットを無料で自作する AppStore用スクリーンショット画像制作の忘備録 | フロンティアビジョン（株） iPhone, iPad両方に対応する場合は、3…

以下のパッケージを使います。 connectivity | Flutter Package 基本的な使い方 await Connectivity().checkConnectivityで接続状態(ConnectivityResult)を取得。 ConnectivityResultをConnectivityResult.mobile, ConnectivityResult.wifi, ConnectivityRes…

結論 Enumを拡張して、文字列に変換する関数を追加する。 {Enum名}.{要素名}でも良い場合は、{Enum名}.{要素名}.toString()で得られる。 import 'package:flutter/foundation.dart'; enum Animal { dog, cat, bird, } /************************************…

成果物 動作 ソースコード メモ Flutterで使えるModalBottomSheet(MBS) showModalBottomSheet function - material library - Dart API modal_bottom_sheet | Flutter Package 成果物 動作 FlutterのModalBottomSheet pic.twitter.com/JUX19AVmxp— かーにゃ …