TextField & Checkbox & CheckboxListTile - flutter

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);
                  },
                ),
            ),
          ],
        ),
      ),
    );
  }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值