我在Flutter中使用此代码,我希望某些行或列可见/不可见。在android studio和java中,我们使用:
msg.setVisibility(View.INVISIBLE);
但是如何在Flutter中将ID用于行和窗口小部件以及不可见/可见窗口小部件和行?这是我的代码:
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home : MyHomePage()
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
body: Column(children: <Widget>[
Row(
//ROW 1
children: [
Container(
color: Colors.lightGreen,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
Container(
color: Colors.orange,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
],
),
Row(
//ROW 1
children: [
Container(
color: Colors.blueAccent,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
Container(
color: Colors.green,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
],
),
]),
bottomNavigationBar: new Container(
color: Colors.redAccent,
height: 55.0,
alignment: Alignment.center,
child: new BottomAppBar(
color: Colors.blueAccent,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
new IconButton(icon: new Icon(Icons.add , color: Colors.black), onPressed: (){ print("helllo"); } ),
new IconButton(icon: new Icon(Icons.remove , color: Colors.black), onPressed: (){ print("helllo"); } ),
],
),
)
),
);
}
}//MyHomePage
我想使用IconButton来显示/隐藏两行。我该怎么办?
有一个名为Visibility的特殊小部件。请记住,Flutter中使用的状态管理反转。您调用setState()并设置小部件可见性的条件。并且不要忘记将您的Widget更改为StatefulWidget
请参阅https://api.flutter.dev/flutter/widgets/Visibility-class.html
用法:
child: Visibility(
visible: false,
),
这里是在您的方案中应该使用的示例,它隐藏了单击“删除”按钮时的行,并在添加时显示:
class MyHomePage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _WidgetState();
}
}
class _WidgetState extends State<MyHomePage> {
bool visible = true;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(children: <Widget>[
Visibility(
visible: visible,
child: Row(
//ROW 1
children: [
Container(
color: Colors.lightGreen,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
Container(
color: Colors.orange,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
],
),
),
Visibility(
visible: visible,
child: Row(
//ROW 1
children: [
Container(
color: Colors.blueAccent,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
Container(
color: Colors.green,
margin: EdgeInsets.all(25.0),
child: FlutterLogo(
size: 60.0,
),
),
],
),
),
]),
bottomNavigationBar: new Container(
color: Colors.redAccent,
height: 55.0,
alignment: Alignment.center,
child: new BottomAppBar(
color: Colors.blueAccent,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
new IconButton(
icon: new Icon(Icons.add, color: Colors.black),
onPressed: () {
print("show");
setState(() {
visible = true;
});
}),
new IconButton(
icon: new Icon(Icons.remove, color: Colors.black),
onPressed: () {
print("hide");
setState(() {
visible = false;
});
}),
],
),
)),
);
}
}