flutter控件之TextField

import 'package:flutter/material.dart';
class LearnTextField extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return new _LearnTextField();
  }
}
class _LearnTextField extends State<StatefulWidget>{
  TextEditingController textEditingController=new TextEditingController();
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Column(
        children: <Widget>[
          new Container(
            child:new Text('學(xué)習(xí)TextField',
              style: new TextStyle(
                decoration: TextDecoration.none,
                fontSize: 30.0,
                color: Colors.black,
              ),
            ),
            margin: EdgeInsets.fromLTRB(0.0, 30.0, 0.0, 30.0),
          ),
          new Container(
            margin: EdgeInsets.fromLTRB(0.0, 30.0, 0.0, 20.0),
            child:new Material(
              shape: new OutlineInputBorder(
                  borderRadius:new BorderRadius.all(new Radius.circular(20.0)),
                  borderSide: new BorderSide(
                    style:BorderStyle.solid ,
                    color: Colors.blue,
                    width: 5.0,
                  )
              ),
              child: new TextField(
              ),
            ),
          ),
          new Material(
            shape: new StadiumBorder(
              side: new BorderSide(
                color: Colors.blue,
                width: 5.0,
              ),
            ),
            child:
            new TextField(//文本輸入控件
              onChanged: (String str){//輸入監(jiān)聽
                print('用戶輸入變更');
              },
              onSubmitted:(String str){//提交監(jiān)聽
                print('用戶提交變更');
              },
              keyboardType: TextInputType.number,//設(shè)置輸入框文本類型
              controller: textEditingController,//控制器,控制文字內(nèi)容
              textAlign: TextAlign.left,//設(shè)置內(nèi)容顯示位置是否居中等
              style: new TextStyle(
                fontSize: 20.0,
                color: Colors.blueAccent,
              ),
              autofocus: true,//自動(dòng)獲取焦點(diǎn)
              decoration: new InputDecoration(
//                labelText: '這里輸入labelText',
//                helperText: '這里是helperText',
//                icon: new Container(
//                  padding: EdgeInsets.all(0.0),
//                  child: new Icon(Icons.phone),
//                ),
//                errorText: '這是錯(cuò)誤的errorText',
                contentPadding: EdgeInsets.fromLTRB(20.0, 20.0, 20.0, 20.0),//設(shè)置顯示文本的一個(gè)內(nèi)邊距
//                border: InputBorder.none,//取消默認(rèn)的下劃線邊框
              ),
            ),
          ),
          new Container(
            margin:EdgeInsets.fromLTRB(0.0, 50.0, 0.0, 0.0),
            padding: EdgeInsets.all(15.0),
            decoration: new BoxDecoration(
              color: Colors.blueAccent,
              borderRadius:BorderRadius.all(Radius.circular(10.0)),
            ),
            child: new Builder(
                builder: (BuildContext context){
                  return new GestureDetector(
                    child:new Text('點(diǎn)擊獲取內(nèi)容',
                      style: new TextStyle(
                        color: Colors.white,
                      ),
                    ),
                    onTap: (){
                      Scaffold.of(context).showSnackBar(new SnackBar(content:new Text(textEditingController.text.toString())));
                    },
                  );
                },
            ),
          )
        ],
      ),
    );
  }
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容