我是Flutter的新手,所以也许我的问题对某人来说很基本。
问题是,在我的应用程序中,当未选中CheckBox时,我想隐藏TextField。一个TextField旁边是一个应该是静态的按钮。我的问题是,当我想隐藏此TextField时,按钮移至左侧。我认为最好的选择是向您展示
这是我正在使用的代码:
bool secondLayer = false;
void _secondLayer(bool value) => setState(() => secondLayer = value);
@override
Widget build(BuildContext context) {
return new Scaffold(
/*appBar: new AppBar(
title: new Text('Name Here'),
),*/
resizeToAvoidBottomInset: false,
body: SingleChildScrollView(
child: new Container(
padding: new EdgeInsets.all(32.0),
child: new Center(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
child: new Row(
children: <Widget>[
Expanded(
child: Column(
children: <Widget>[
new TextField(
decoration: InputDecoration(
labelText: 'First Hidden Layer',
hintText: '25',
),
autocorrect: true,
autofocus: true,
keyboardType: TextInputType.number,
),
],
),
),
Expanded(
child: Column(
children: <Widget>[
new SizedBox(
width: 100,
child: new RaisedButton(onPressed: null, child: new Text('ADD DATA'),)
)
],
),
)
],
),
),
Container(
child: new CheckboxListTile(
value: secondLayer,
onChanged: _secondLayer,
title: new Text(
'Use Second Hidden Layer',
style: new TextStyle(
fontSize: 12
),
),
controlAffinity: ListTileControlAffinity.leading,
),
),
Container(
child: new Row(
children: <Widget>[
Visibility(
visible: secondLayer,
child: new Expanded(
child: Column(
children: <Widget>[
new TextField(
decoration: InputDecoration(
labelText: 'Second Hidden Layer',
hintText: '25',
),
autocorrect: true,
autofocus: true,
keyboardType: TextInputType.number,
),
],
),
),
),
Expanded(
child: Column(
children: <Widget>[
new SizedBox(
width: 100,
child: new RaisedButton(onPressed: null, child: new Text('OPTIONS'),)
)
],
),
)
],
),
),
Container(
child: new TextField(
decoration: InputDecoration(
labelText: 'Epochs',
hintText: '5000',
),
autocorrect: true,
autofocus: true,
keyboardType: TextInputType.number,
),
),
Container(
child: new TextField(
decoration: InputDecoration(
labelText: 'Learning Rate',
hintText: '0.00333',
),
autocorrect: true,
autofocus: true,
keyboardType: TextInputType.number,
),
),
Container(
padding: EdgeInsets.only(top: 20),
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
width: MediaQuery.of(context).size.width/3,
height: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
border: Border.all(color: Color.fromRGBO(0, 0, 0, 100)),
),
child: new Text('data')
),
Container(
width: MediaQuery.of(context).size.width/3,
height: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
border: Border.all(color: Color.fromRGBO(0, 0, 0, 100)),
),
child: new Text('data')
)
],
)
)
],
),
)
)
)
);
答案 0 :(得分:1)
这是因为您没有向replacement
小部件添加任何Visibility
属性。
Visibility(
visible: secondLayer,
child: Expanded(
child: Column(
children: <Widget>[
// your text field here
]
),
),
replacement: Expanded(child: Container()), // the widget which will fill the space when hiddden
)
当您将TextField
内的Container
替换为空白的Expanded
以填充空白时,这样的事情应该起作用。
答案 1 :(得分:0)