「Flutter/UI/TextField」の版間の差分
提供: 初心者エンジニアの簡易メモ
(→入力フォームにデフォルトで文字入力) |
(→入力フォームにスクロール追加) |
||
行43: | 行43: | ||
==入力フォームにスクロール追加== | ==入力フォームにスクロール追加== | ||
− | + | <pre> | |
+ | return ListView( | ||
+ | children: [ | ||
+ | Container( | ||
+ | padding: const EdgeInsets.symmetric(horizontal: 6.0, vertical: 0.0), | ||
+ | child: TextField( | ||
+ | keyboardType: TextInputType.multiline, | ||
+ | maxLines: 20, | ||
+ | decoration: InputDecoration( | ||
+ | hintText: "テキストを作成", | ||
+ | ), | ||
+ | autofocus: true, | ||
+ | onChanged: (text) { | ||
+ | // 変更時の処理 | ||
+ | }, | ||
+ | ), | ||
+ | ), | ||
+ | ], | ||
+ | ); | ||
+ | </pre> | ||
+ | |||
+ | 参考:http://karmactonics.hatenablog.com/entry/2018/09/08/102436 |
2019年5月8日 (水) 15:09時点における版
入力フォーム
TextFormField( decoration: InputDecoration( labelText: 'Enter your username' ), ),
複数行入力フォーム
Container( margin: EdgeInsets.all(8.0), // hack textfield height padding: EdgeInsets.only(bottom: 40.0), child: TextField( keyboardType: TextInputType.multiline, maxLines: 6, decoration: InputDecoration( hintText: "テキストを作成", border: OutlineInputBorder(), ), autofocus: true, onChanged: (text) { // value = text; }, ), ),
入力フォームにデフォルトで文字入力
TextEditingController _controller; @override void initState() { super.initState(); _controller = new TextEditingController(); _controller.text = "hogehoge"; // _controller = new TextEditingController(text: 'hogehoge'); // こちらでもよい } // 略 child: TextField( controller: _controller, keyboardType: TextInputType.multiline, ),
参考:https://stackoverflow.com/questions/43214271/how-do-i-supply-an-initial-value-to-a-text-field
入力フォームにスクロール追加
return ListView( children: [ Container( padding: const EdgeInsets.symmetric(horizontal: 6.0, vertical: 0.0), child: TextField( keyboardType: TextInputType.multiline, maxLines: 20, decoration: InputDecoration( hintText: "テキストを作成", ), autofocus: true, onChanged: (text) { // 変更時の処理 }, ), ), ], );
参考:http://karmactonics.hatenablog.com/entry/2018/09/08/102436