facebook twitter hatena line email

「Flutter/UI」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(入力フォームにデフォルトで文字入力)
 
(同じ利用者による、間の25版が非表示)
行1: 行1:
==body内に複数行textを表示==
+
[[flutter/UI/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内にボタンを表示==
+
[[flutter/UI/Button]]
body: Center(
+
        child: Column(
+
          mainAxisAlignment: MainAxisAlignment.center,
+
          children: <Widget>[
+
            Text(
+
              'hello',
+
            ),
+
            RaisedButton(
+
              child: Text('button1'),
+
              onPressed: () {
+
                // ボタン処理
+
              },
+
            ),
+
          ],
+
        ),
+
),
+
  
==画面右下にボタンを表示==
+
[[flutter/UI/Container]]
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),
+
      ),
+
);
+
  
==入力フォーム==
+
[[flutter/UI/TextField]]
TextFormField(
+
              decoration: InputDecoration(
+
                  labelText: 'Enter your username'
+
              ),
+
),
+
  
==複数行入力フォーム==
+
[[flutter/UI/ListView]] [dir]
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(text: 'hogehoge'); // これでもよい
+
    _controller = new TextEditingController();
+
    _controller.text = "hogehoge";
+
  }
+
  
//
+
[[flutter/UI/PageView]]
child: TextField(
+
                controller: _controller,
+
                keyboardType: TextInputType.multiline,
+
),
+
  
参考:https://stackoverflow.com/questions/43214271/how-do-i-supply-an-initial-value-to-a-text-field
+
[[flutter/UI/ListTile]]
 +
 
 +
[[flutter/UI/SwitchListTile]]
 +
 
 +
[[flutter/UI/BottomNavigationBar]]
 +
 
 +
[[flutter/UI/DropdownButton]]
 +
 
 +
[[flutter/UI/Scaffold]]
 +
 
 +
[[flutter/UI/CircleAvatar]]
 +
 
 +
[[flutter/UI/Draggable]]
 +
 
 +
[[flutter/UI/Cupertino]] [dir]
 +
 
 +
[[flutter/UI/余白]]
 +
 
 +
[[flutter/UI/ダークモード]]
 +
 
 +
[[flutter/UI/横縦並び・比率]]
 +
 
 +
[[flutter/UI/別widget切出]]
 +
 
 +
[[flutter/UI/その他]]

2020年1月20日 (月) 23:14時点における最新版

flutter/UI/Text

flutter/UI/Button

flutter/UI/Container

flutter/UI/TextField

flutter/UI/ListView [dir]

flutter/UI/PageView

flutter/UI/ListTile

flutter/UI/SwitchListTile

flutter/UI/BottomNavigationBar

flutter/UI/DropdownButton

flutter/UI/Scaffold

flutter/UI/CircleAvatar

flutter/UI/Draggable

flutter/UI/Cupertino [dir]

flutter/UI/余白

flutter/UI/ダークモード

flutter/UI/横縦並び・比率

flutter/UI/別widget切出

flutter/UI/その他