Постоянная нижняя панель приложения Flutter для отображения только текста (без навигации)
Моему двухстраничному приложению Flutter нужна постоянная нижняя панель приложения, чтобы отображать до нескольких строк текста, без навигации. Кроме того, этот нижний раздел не должен перекрывать какой-либо контент; скорее ограничьте его, как верхнюю панель приложения. предложения оценены. примеры супер оценены. Благодарность!
================@chunhunghan ================
спасибо за предложение. к сожалению, нижний лист скрывает содержимое:
2 ответа
Вы можете скопировать и вставить полный код ниже.
Вы можете использоватьbottomSheet
и завернуть AppBar
с Container
установлен kToolbarHeight
bottomSheet: Container(
height: kToolbarHeight,
child: AppBar(
title: Text("bottom sheet"),
),
),
рабочая демонстрация
полный код
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: ListView(
children:
List.generate(100, (i) => Text("line" + i.toString()))),
),
],
),
),
bottomSheet: Container(
height: kToolbarHeight,
child: AppBar(
title: Text("bottom sheet"),
),
),
);
}
}
Предложил бы пойти дальше и использовать bottomNavigationBar
вот так:
Widget build(BuildContext context) {
return new Scaffold(
body: new Center(
child: new ListView(
children: List.generate(100, (i) => Text("this is a line" + i.toString()))
),
),
bottomNavigationBar:Text(
"this is some info"
)
);
}
В этом примере вы можете видеть, что все элементы в списке отображаются, а не скрыты под нижней панелью приложения.