flutter 无状态组件中添加普通组件

在组件内添加其他组件时,直接作为 child 即可,例如:

Positioned(
 top: 10,
 left: 0,
 child: Container(
     width: 240,
     alignment: Alignment(0, 0),
     child: Text(
         title,
         style:
         TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
         ),
     ),
)

但是在添加组件时,需要查看父级组件是有状态还是无状态,例如:

无状态:

class AlertDialog extends StatelessWidget {

有状态:

class index_page extends StatefulWidget {

无状态的情况下,添加动态是不能实时被修改的

我的一个简单例子:

需要对数据进行修改并且关闭编辑后需要实时看到被修改后的内容

 

 

 

 简易操作:

1.列表中显示 111111

2.弹框中点击编辑可以对标题进行编辑

3.编辑后保存

4.列表中显示新的数据

showDialog(
        context: context,
        builder: (context) {
          return AlertDialog(
            contentPadding: EdgeInsets.only(top:8,bottom: 8),
            buttonPadding: EdgeInsets.all(5),
            title: editNumberTitle(nmodel,number),//编辑的新方法
            content: selectTime(nmodel,item),
            actions: <Widget>[
              FlatButton(
                child: Text('Cancel'),
                onPressed: () {
                  Navigator.of(context).pop('Cancel');
                },
              ),
              FlatButton(
                child: Text('Ok'),
                onPressed: () async {
                  Loading.show(context);
                  //请求接口
                  var result = await nmodel.editParticipant(nmodel.number,nmodel.startTime, nmodel.endTime,id,state);
                  if (result != null && result.code == 200) {
                    //成功请求接口进行操作
                  }
                  Loading.dismiss(context);
                  Navigator.of(context).pop('Cancel');
                }
              ),
            ],
          );
        })
class editNumberTitle extends StatefulWidget{
  user_providerModel nmodel;//对象
  String number;
  editNumberTitle(this.nmodel,this.number);
  @override
  _editNumberTitle createState() => _editNumberTitle();
}

class _editNumberTitle extends State<editNumberTitle>{
  //对编辑的标题进行赋值
  TextEditingController  _userNumberCOntroller;
  @override
  void initState(){
    super.initState();
    //点击编辑时,编辑的样式
    _userNumberCOntroller=TextEditingController.fromValue(
      TextEditingValue(
        text: widget.number,
        selection: TextSelection.fromPosition(
          TextPosition(
            affinity: TextAffinity.downstream,
            offset: widget.number.length,
          )
        )
      )
    );
  }
  //切换 编辑 笔 和 勾 的 样式
  bool isEdit = false;

  @override
  Widget build(BuildContext context) {

    return Container(
        child: Row(children: [
          Text("Edit "),
          isEdit ? Container(
              alignment: Alignment.center,
              height: ScreenUtil().setHeight(40),
              width: ScreenUtil().setWidth(120),
              margin: EdgeInsets.only(bottom: 10),
              child:TextField(
                autofocus: false,
                style: TextStyle(
                    fontSize: 18,
                ),
                onChanged: (T) async {
                 setState(() {
                   //赋值
                   widget.number=_userNumberCOntroller.text;
                   widget.nmodel.number=_userNumberCOntroller.text;
                 });
                },
                controller: _userNumberCOntroller,
              )
          ):Text(widget.number),
          isEdit ? new GestureDetector(
            child: Icon(Icons.check,color:PColor.blue),
            onTap: (){
              setState(() {
                isEdit=!isEdit;
              });
            },
          ) : new GestureDetector(
            child: Icon(Icons.edit,color:PColor.blue),
            onTap: (){
              setState(() {
                //赋值且切换编辑状态
                widget.number=_userNumberCOntroller.text;
                widget.nmodel.number=_userNumberCOntroller.text;
                isEdit = !isEdit;
              });
            },
          ),
        ],)
    );
  }
}

此时 change 操作的方法 extends 有状态

class editNumberTitle extends StatefulWidget{

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值