facebook twitter hatena line email

「Flutter/UI」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(複数業入力フォーム)
(複数行入力フォーム)
行72: 行72:
  
 
==複数行入力フォーム==
 
==複数行入力フォーム==
            Container(
+
Container(
 
               margin: EdgeInsets.all(8.0),
 
               margin: EdgeInsets.all(8.0),
 
               // hack textfield height
 
               // hack textfield height
行88: 行88:
 
                 },
 
                 },
 
               ),
 
               ),
            ),
+
),
 +
==入力フォームにデフォルトで文字入力==
 +
TextEditingController txt = new TextEditingController();
 +
txt.text = "hoge";
 +
// 略
 +
child: TextField(
 +
                controller: txt,
 +
                keyboardType: TextInputType.multiline,
 +
),

2019年5月6日 (月) 01:27時点における版

body内に複数行textを表示

     body: Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Text(
             'hello',
           ),
           Text(
             '$_counter',
             style: Theme.of(context).textTheme.display1,
           ),
           RaisedButton(
             child: Text('Back to MyPage 1'),
             onPressed: () {
               Navigator.pop(context);
             },
           ),
         ],
       ),
     ),

body内にボタンを表示

     body: Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Text(
             'hello',
           ),
           RaisedButton(
             child: Text('button1'),
             onPressed: () {
               // ボタン処理
             },
           ),
         ],
       ),
     ),

画面右下にボタンを表示

floatingActionButtonをScaffoldの項目に追加

   return Scaffold(
     appBar: AppBar(
       title: Text(widget.title),
     ),
     body: Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Text(
             'hello',
           ),
         ],
       ),
     ),
     floatingActionButton: FloatingActionButton(
       onPressed:() {
              // ボタン処理
            },
       tooltip: 'Increment',
       child: Icon(Icons.add),
     ),
   );

入力フォーム

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 txt = new TextEditingController();
txt.text = "hoge";
// 略
child: TextField(
               controller: txt,
               keyboardType: TextInputType.multiline,
),