flutter TextFormField的使用

TextFormField 就是输入框,支持不同的输入模式,比如邮箱,手机号,或者nunber

autofocus  //是否对焦
keyboardType  //输入模式
initialValue   //默认值
decoration   InputDecoration  TextFormField专门的输入边界
import 'package:demoflutter/utils/utlis.dart';
import 'package:flutter/material.dart';

class Demo2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('输入弹窗'),
      ),
      body: SingleChildScrollView(
        padding: EdgeInsets.symmetric(horizontal: 24),
        child: Column(
          children: [
            SizedBox(
              height: 32,
            ),
            TextFormField(
              //是否自动对焦
              autofocus: false,
              //输入模式,邮件
              keyboardType: TextInputType.emailAddress,
              //输入框,默认值
              initialValue: '[email protected]',
              decoration: InputDecoration(
                //输入框内边距
                  contentPadding:
                      EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                  //输入框内容提示
                  hintText: '请输入弹窗',
                  //输入框边距线
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(32))),
            ),

            SizedBox(height: 20,),
            TextFormField(
              //输入内容,隐藏
              obscureText:true,
              autofocus: false,
              decoration: InputDecoration(
                contentPadding: EdgeInsets.symmetric(horizontal: 20,vertical: 10),
                hintText: '请输入密码',
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(32)
                )
              ),
            ),
            SizedBox(height: 20,),
            FlatButton(onPressed: (){
              Utils.showToast(context,'啦啦啦啦啦啦啦');
            }, child: Text('忘记密码?',style: TextStyle(fontSize: 16,color: Colors.black),))
          ],
        ),
      ),
    );
  }
}

你可能感兴趣的:(flutter开发)