Androg

Flutterでテキストフィールドが最大3行になるようにするには

やりたいことFlutterで、LINEでメッセージ入力するときのように、テキストフィールドが最大3行になるようにしたい。つまり、下の動画のようにしたい。コード例とポイント説明ポイントとなる部分だけのコードと説明します。 TextEditingControllerを使って、TextFieldに入力されたテキスト取得できるようにしておきます。ま …

Posted by on Wed, Aug 22, 2018

Flutterあるある

はじめに2018/08/12(日)にGDG神戸主催のFlutter勉強会が開催されました。勉強会全体に関してはこちらのブログを見ていただいて、ここでは僕が「Flutterあるある」というタイトルでLT(LT資料はこちら)したので、それについて書きたいと思います。基本的に原稿をもとに加筆・修正しています。 Flutterあるあるまず自己紹介でチャットアプリ …

Posted by on Thu, Aug 16, 2018

Flutterで画像を角丸にするには

こんな感じに画像を角丸にするには、ClipRRectを使うと良さそう。 SizedBox( height: 180.0, child: Container( child: ClipRRect( borderRadius: BorderRadius.circular(8.0), child: Image.network( …

Posted by on Sun, Aug 5, 2018

Firebase Cloud Messaging(FCM)のトピックについて

Firebase Cloud Messaging(FCM)はTopicをSubscribeすることができて、サーバーはそのSubscribeしたTopicに対して送信することができます。複数のTopicをSubscribeすることができるのですが、複数のTopicに対して送信するにはconditionを使うことができます。これはドキュメントに記載してあり、 …

Posted by on Sat, Aug 4, 2018

Flutterのキーボードを閉じるには

はじめにFlutterでLINEのようなチャットアプリを作っていて、TextFormでキーボードが表示されたら、Androidはバックキーでキーボードを閉じれるけど、iOSはバックキーないので閉じることができなかったので、キーボードを閉じる方法をメモ。キーボードを閉じるにはGestureDetector( onTap: () => …

Posted by on Sun, Jul 29, 2018

Flutterの画面遷移をモーダルにするには

結論PageRouteクラスに、fullscreenDialogプロパティがあるので、trueを設定するだけ。これで、iOSのUINavivationControllerのpushの画面遷移の仕方でなく、モーダルで立ち上がるような遷移になる。左上のボタンも←から☓に変わってくれる。実装例いま作ってるアプリでは、こんな感じのメソッドを自分 …

Posted by on Sat, Jul 28, 2018

FlutterでFileのファイル名を取得するには

pathパッケージをimportして、 import 'package:path/path.dart'; basenameを使う。 File file = File("dir/name.png"); print(basename(file.path)); /// output: /// name.png …

Posted by on Wed, Jul 25, 2018

Flutterでバックキーイベントを検知するには

方法Flutterでバックキー(AndroidのonBackPressed)イベントを検知するには、WillPopScopeクラスを使う。サンプル @override Widget build(BuildContext context) { return WillPopScope( onWillPop: () { // バックキーを押すとここに来る。 // …

Posted by on Wed, Jul 18, 2018

Wifiでadb接続する

Wifi経由でadb接続するには端末とUSBで接続する認識されてることを確認 % adb devices List of devices attached <端末> device adb tcpip PORTを叩く % adb tcpip 5555 restarting in TCP mode port: 5555 adb serverがリス …

Posted by on Tue, Jul 10, 2018

Flutter アイコンリスト

Flutterのアイコンリストは公式ドキュメントにあるhttps://docs.flutter.io/flutter/material/Icons-class.html 以上。

Posted by on Mon, Jul 9, 2018