如何在单击按钮时添加新的小部件

时间:2020-03-23 22:35:09

标签: flutter flutter-layout

    class CustomFlatButton extends StatefulWidget {
  String ButtonName="";
  CustomFlatButton(String ButtonName){
    this.ButtonName=ButtonName;
  }
  @override
  _CustomFlatButtonState createState() => _CustomFlatButtonState(ButtonName);
}

class _CustomFlatButtonState extends State<CustomFlatButton> {
  String ButtonName="";
  _CustomFlatButtonState(String ButtonName){
    this.ButtonName=ButtonName;
  }
  @override
  Widget build(BuildContext context) {
    return FlatButton(
                                  color: Colors.blue,
                                  textColor: Colors.white,
                                  disabledColor: Colors.grey,
                                  disabledTextColor: Colors.black,
                                  padding: EdgeInsets.all(8.0),
                                  splashColor: Colors.blueAccent,
                                  onPressed: () {
                                    ListWheelScrollView(itemExtent: 31,useMagnifier: true,magnification: 1.5,children: <Widget>[
                                      Container(color: Colors.red,height: 200,width: 200)
                                    ],);
                                  },
                                  child: Text(
                                    ButtonName,
                                    style: TextStyle(fontSize: 20.0),
                                  ),
                                );
  }
}

用户单击按钮时如何呈现窗口小部件。在代码中

onPressed: () {
                                ListWheelScrollView(itemExtent: 31,useMagnifier: true,magnification: 1.5,children: <Widget>[
                                  Container(color: Colors.red,height: 200,width: 200)
                                ],);
                              }

我要在按下按钮时显示ListWheelScrollView窗口小部件,这意味着当按下按钮时,应该显示ListWheelScrollView。

我是新手。如果您在理解我的问题时遇到任何困难,请告诉我

1 个答案:

答案 0 :(得分:1)

您可以创建一个变量,该变量表示如果按下按钮,我们将其称为hasPressed,如果为true,则显示ListWheelScrollView,如果为false,则显示一个空的{{1} }。当按下按钮时,将调用Container(height: 0, width: 0)来重建小部件。看起来类似于以下内容:

setState()

您将在声明Row( children: <Widget>[ FlatButton( color: Colors.blue, textColor: Colors.white, disabledColor: Colors.grey, disabledTextColor: Colors.black, padding: EdgeInsets.all(8.0), splashColor: Colors.blueAccent, onPressed: () { setState(() { isPressed = true; }); }, child: Text( ButtonName, style: TextStyle(fontSize: 20.0), ), ), (isPressed) ? ListWheelScrollView( itemExtent: 31, useMagnifier: true, magnification: 1.5, children: <Widget>[ Container(color: Colors.red, height: 200, width: 200) ], ) : Container( height: 0, width: 0, ) ], ); 的地方声明bool isPressed = false。希望这会有所帮助,如果可以,请投赞成票,否则请发表评论。