import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context){
//添加文本编辑控制器 监听文本输入内容变化
final TextEditingController controller = TextEditingController();
controller.addListener((){
print('your input is : ${controller.text}');
});
return MaterialApp(
title: 'TextField example',
home:Scaffold(
appBar: AppBar(
title: Text('TextField example'),
),
body: Center(
child: Padding(
padding: const EdgeInsets.all(20.0),
child: TextField(
controller: controller, //绑定controller
maxLength: 30, //最大长度,右下角会出现输入数量统计
maxLines:1, //最大行数
autocorrect: true, //是否自动更正
autofocus: true, //是否自动对焦
obscureText: false, //是否为密码
textAlign: TextAlign.center, //文本对齐方式
style: TextStyle(fontSize: 26.0,color: Colors.green), //输入文本的样式
//文本内容改变时回调
onChanged: (text){
print('文本内容改变时回调 $text');
},
//文本内容提交时回调
onSubmitted:(text){
print('内容提交时回调 $text');
},
enabled: true, //是否禁用
//添加装饰效果
decoration: InputDecoration(
fillColor: Colors.grey.shade200, //添加灰色填充色
filled: true,
helperText: '用户名',
prefixIcon: Icon(Icons.person), //左侧图标
suffixText: '用户名啊', //右侧文本提示
),
),
),
),
),
);
}
}
Flutter - textfield控件
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- TextFiled文本输入框。 构造方法 1.decoration输入器装饰 ①labelText 效果如图: 无...
- TextField( controller: TextEditingController.fro...