以防万一,如果页面的屏幕上半部分有一些数据,而屏幕的下半部分中有一个标签栏,则标签栏视图包含一个 inputtextfield ,即使将 resizeToAvoidBottomPadding 设置为 true < / strong>,
键盘涵盖了输入字段
并且它不会向上滚动。
下面提供了父窗口小部件页面:
class ParentWidget extends StatefulWidget {
@override
_ParentWidgetState createState() => _ParentWidgetState();
}
class ParentWidget extends StatefulWidget {
@override
_ParentWidgetState createState() => _ParentWidgetState();
}
class _ParentWidgetState extends State<ParentWidget> with TickerProviderStateMixin{
List<Tab> tabList = List();
int _index;
int _currentIndex;
TabController _tabController;
_handleTabSelection() {
setState(() {
_currentIndex = _tabController.index;
print("index"+_currentIndex.toString());
});
}
@override
void initState() {
super.initState();
_tabController = new TabController(vsync: this, length: tabList.length);
_index = 0;
tabList.add(new Tab(
child: Text(
"Tab1",
),
));
tabList.add(new Tab(
child: Text(
"Tab2",
),
));
tabList.add(new Tab(
child: Text(
"Tab3",
),
));
setState(() {
_tabController = new TabController(vsync: this, length: tabList.length);
_tabController.addListener(_handleTabSelection);
this._index = _index;
print(_index);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
appBar: AppBar(
backgroundColor: Colors.white,
elevation: 0.0,
titleSpacing: 0.0,
brightness: Brightness.light,
centerTitle: false,
iconTheme: IconThemeData(
color: Colors.black,
),
leading: IconButton(
icon: Icon(
Icons.arrow_back,
color: Colors.black,
size: 30.0,
),
onPressed: () => Navigator.pop(context),
),
title: Text(
"Demo",
style: TextStyle(
fontSize: 16,
fontFamily: "IBMPlexSans",
fontWeight: FontWeight.w500,
color: Colors.black,
),
textAlign: TextAlign.left,
),
),
body: Container(
color: Colors.white,
child: Column(
children: <Widget>[
Container(
margin: EdgeInsets.symmetric(horizontal: 20),
height: 150.0,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
'https://img.etimg.com/thumb/msid-66398917,width-643,imgsize-702055,resizemode-4/bill-gates-wants-to-reinvent-the-toilet-save-233-billion-while-at-it.jpg'
)
),
borderRadius: BorderRadius.all(Radius.circular(8.0)),
color: Colors.redAccent,
),
),
Container(
margin: EdgeInsets.symmetric(horizontal: 20,vertical: 10),
child: Text(
"Description: William Henry Gates III (born October 28, 1955) is an American business magnate, software developer, investor, and philanthropist. He is best known as the co-founder of Microsoft Corporation.",
style: TextStyle(
fontSize: 12,
color: Colors.black54,
fontWeight: FontWeight.w400,
),
),
),
Container(
margin: EdgeInsets.symmetric(horizontal: 20,vertical: 10),
height: 150.0,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
'https://image.businessinsider.com/5c62d63c2628982cad752452?width=1100&format=jpeg&auto=webp'
)
),
borderRadius: BorderRadius.all(Radius.circular(8.0)),
color: Colors.redAccent,
),
),
Container(
margin: EdgeInsets.symmetric(horizontal: 20,vertical: 10),
child: Text(
"Description: William Henry Gates III (born October 28, 1955) is an American business magnate, software developer, investor, and philanthropist. He is best known as the co-founder of Microsoft Corporation.",
style: TextStyle(
fontSize: 12,
color: Colors.black54,
fontWeight: FontWeight.w400,
),
),
),
Container(
margin: EdgeInsets.only(left:20,
right: 20),
height: (40),
child: TabBar(
isScrollable: true,
controller: _tabController,
indicatorColor: Colors.blueAccent,
labelColor: Colors.blueAccent,
unselectedLabelColor: Colors.black54,
indicatorSize: TabBarIndicatorSize.tab,
tabs: tabList,
unselectedLabelStyle: TextStyle(
fontSize: 14,
fontFamily: "IBMPlexSans",
fontWeight: FontWeight.w400,
),
labelStyle: TextStyle(
fontSize: 14,
fontFamily: "IBMPlexSans",
fontWeight: FontWeight.w500,
),
indicator: UnderlineTabIndicator(
borderSide: BorderSide(width: 2.0,color: Colors.blueAccent ),
insets: EdgeInsets.symmetric(horizontal:0.0),
),
),
),
Expanded(
child: TabBarView(
controller: _tabController,
children: [
ChildWidget(),
ChildWidget(),
ChildWidget(),
],
),
),
],
),
),
);
}
}
以下提供了子窗口小部件代码:
class ChildWidget extends StatefulWidget {
@override
_ChildWidgetState createState() => _ChildWidgetState();
}
class _ChildWidgetState extends State<ChildWidget> {
@override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
Container(
margin: EdgeInsets.only(left: 20, top: 20),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
/**Circular Avatar**/
Container(
height: 30,
width: 30,
margin: EdgeInsets.only(left: 0, top: 0),
decoration: new BoxDecoration(
shape: BoxShape.circle,
image: new DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
'https://img.etimg.com/thumb/msid-66398917,width-643,imgsize-702055,resizemode-4/bill-gates-wants-to-reinvent-the-toilet-save-233-billion-while-at-it.jpg'))),
),
Expanded(
child: Container(
height: 40,
margin: EdgeInsets.only(left: 20,right: 20),
decoration: BoxDecoration(
border: Border.all(color: Colors.black),
color:Colors.white,
borderRadius: BorderRadius.all(Radius.circular(5)),
),
child: Row(
children: <Widget>[
Container(
height: 18,
width: 200,
margin: EdgeInsets.only(left: 13,top: 10,bottom: 10),
child: GestureDetector(
child: TextFormField(
style: TextStyle(
color: Colors.black38,
fontWeight: FontWeight.bold,
fontStyle: FontStyle.normal,
fontSize: 14,
),
textInputAction: TextInputAction.done,
decoration: new InputDecoration.collapsed
(
hintText: "Post Query",
hintStyle: TextStyle (
color: Colors.white30,
fontWeight: FontWeight.w400,
fontStyle: FontStyle.normal,
fontSize: 14,
),
),
),
),
),
],
),
),
),
],
),
),
Expanded(
child: ListView.separated(
itemCount: 1000,
itemBuilder: (context, index) {
return ListTile(
leading: Icon(Icons.account_circle),
title: Text('Sun'),
);
},
separatorBuilder: (context, index) {
return Divider();
},
),
),
],
);
}
}
以下是屏幕截图: