import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
class GoodsInfo extends StatefulWidget {
var arguments;
GoodsInfo({this.arguments});
@override
_GoodsInfoState createState() => _GoodsInfoState(arguments:this.arguments);
}
class _GoodsInfoState extends State<GoodsInfo> {
var arguments;
bool checkBox;
TextEditingController _userNameController = TextEditingController(); //用于实现表单的默认值, TextField的controller参数需要接收这个类
String _userName = ""; //如果用userNameController.text 记录onChange的值, 表单会被不停的重置, 光标一直跑到首位, 所以用单个_userName记录onChange的值, 不用setState, 因为不用刷新页面
_GoodsInfoState({this.arguments});
@override
void initState() { //初始化函数, 在构造函数之后执行
// TODO: implement initState
super.initState();
this._userNameController.text = "表单的默认值";
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("GoodsInfo"),
),
body: Center(
child: Column(
children: [
Padding(
padding: EdgeInsets.only(left: 5, right: 5, top: 5),
child: TextField(
maxLines: 1, //文本框高度变化, 输入多余一行之后折叠, 如果是默认值, 输入多余一行会向右滚动
decoration:InputDecoration(
icon: Icon(Icons.account_box_outlined), //在输入框前面加一个图标
// hintText: "请输入用户名", //横线上的默认提示文字
border: OutlineInputBorder(), //把输入线变成了输入框
labelText: "用户名",
),
controller: this._userNameController, //为表单添加默认值, 可用作默认提交内容
onChanged: (value){
// print(value);
this._userName = value;
},
)
),
Padding(
padding: EdgeInsets.only(left: 5, right: 5, top: 5),
child: TextField(
obscureText: true, //隐藏文字, 编程密码框
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: "请输入密码"
),
)
),
Padding(
padding: EdgeInsets.only(left: 5, right: 5, top: 5),
child: Row(
// mainAxisAlignment: MainAxisAlignment.end,
children: [
Expanded(
flex: 5,
child: Text(
this.checkBox ? "嗯嗯, 已经记住登陆了~" : "不会记住登陆哦~",
// textAlign: TextAlign.right,
textDirection: TextDirection.rtl,
),
),
Expanded(
flex: 1,
child: Container(
alignment: Alignment.centerLeft,
// color: Colors.orange,
padding: EdgeInsets.only(left: 0),
child: Checkbox(
value: this.checkBox, //选中状态, true or false
activeColor: Colors.orange, //选中时背景色
checkColor: Colors.white, //选中时前景色, 就是对勾的颜色
onChanged: (value){
print(value);
setState(() {
this.checkBox = value;
});
},
),
)
),
],
),
),
CheckboxListTile(
value: this.checkBox, //选中状态 true or false
onChanged: (value){
setState(() {
this.checkBox = value;
});
},
title: Text("要记住登陆嘛?"),
subtitle: Text("~~~~~~~~~~~~"),
secondary: Icon(Icons.home), //最前面加点啥, 加个图标啥的
selected: this.checkBox, //文字也随着选中状态变化
),
//沾满全屏幕
Container(
width: double.infinity, //宽度占满
child: RaisedButton(
color: Colors.orange,
child: Text("注册"),
onPressed: (){
print(this._userName);
},
),
),
],
),
),
);
}
}
TextField & Checkbox & CheckboxListTile - flutter
最新推荐文章于 2024-06-04 16:33:04 发布