#flutter #button #navigation
#трепетание #кнопка #навигация
Вопрос:
У меня есть следующий код:
@override
Widget build(BuildContext context) {
// This method is rerun every time setState is called, for instance as done
// by the _incrementCounter method above.
//
// The Flutter framework has been optimized to make rerunning build methods
// fast, so that you can just rebuild anything that needs updating rather
// than having to individually change instances of widgets.
this.setTable();
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Row(children: <Widget>[
Image.asset(
'images/logobig.png',
width: 40.0,
height: 40.0,
),
Text(widget.title),
]),
backgroundColor: Colors.blue,
),
body: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Column(children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
"Currency Exchange Rates",
textScaleFactor: 1,
style: TextStyle(fontWeight: FontWeight.bold),
),
),
DataTable(
// textDirection: TextDirection.rtl,
// defaultVerticalAlignment: TableCellVerticalAlignment.bottom,
// border:TableBorder.all(width: 2.0,color: Colors.red),
showCheckboxColumn: false,
columns: const <DataColumn>[
DataColumn(
label: Text(
'Symbol',
style: TextStyle(fontWeight: FontWeight.bold),
),
),
DataColumn(
label: Text(
'Buy',
style: TextStyle(fontWeight: FontWeight.bold),
),
),
DataColumn(
label: Text(
'Sell',
style: TextStyle(fontWeight: FontWeight.bold),
),
),
],
rows: rows,
),
]),
),
),
bottomNavigationBar: Material(
color: Colors.white,
child: Row(children: <Widget>[
FlatButton(
onPressed: () => {},
color: Colors.white,
padding: EdgeInsets.all(10.0),
child: Column(
// Replace with a Row for horizontal icon text
children: <Widget>[
ImageIcon(
AssetImage('images/dollar_world_grid_selected.png'),
size: 40.0,
),
Text(
"Currency",
style:
TextStyle(color: Color.fromRGBO(43, 73, 193, 0.4)),
)
],
)),
FlatButton(
onPressed: () => {
Navigator.pushReplacement(
context,
new MaterialPageRoute(
builder: (context) => goldRate()))
},
color: Colors.white,
padding: EdgeInsets.all(10.0),
child: Column(
// Replace with a Row for horizontal icon text
children: <Widget>[
ImageIcon(
AssetImage('images/gold-bars.png'),
size: 40.0,
),
Text(
"Gold",
style: TextStyle(
color: Color.fromRGBO(127, 127, 127, 0.4)),
)
],
)),
])));
}
Панель buttomNavigationBar должна перемещаться между различными экранами, когда пользователь нажимает на одну из кнопок.
К сожалению, я получаю следующий результат:
Как вы можете видеть, она отображается вверх. другие компоненты не отображаются, а изображения значков не отображаются. Есть идеи о том, как это исправить или другим способом сделать это? Спасибо
Ответ №1:
Замените нижнюю навигационную панель на persistentFooterButtons:
persistentFooterButtons: <Widget>[
new Container(
height: 100,
child: Row(
children: <Widget>[
FlatButton(
onPressed: () => {},
color: Colors.white,
padding: EdgeInsets.all(10.0),
child: Column(
// Replace with a Row for horizontal icon text
children: <Widget>[
ImageIcon(
AssetImage('images/dollar_world_grid_selected.png'),
size: 40.0,
),
Text(
"Currency",
style:
TextStyle(color: Color.fromRGBO(43, 73, 193, 0.4)),
)
],
)),
FlatButton(
onPressed: () => {},
color: Colors.white,
padding: EdgeInsets.all(10.0),
child: Column(
// Replace with a Row for horizontal icon text
children: <Widget>[
ImageIcon(
AssetImage('images/gold-bars.png'),
size: 40.0,
),
Text(
"Gold",
style:
TextStyle(color: Color.fromRGBO(127, 127, 127, 0.4)),
)
],
),
),
],
),
),
],
Если вы хотите использовать BottomNavigationBar, взгляните на пример в документации.