gpt4 book ai didi

flutter - Flutter-如何从BottomNavigationBar删除填充?

转载 作者:行者123 更新时间:2023-12-03 02:52:02 28 4
gpt4 key购买 nike

我在flutter应用程序中使用了BottomNavigationBar。我对外观有其他要求,这是我得到的结果。除了顶部和底部填充(图中的箭头)之外,其他一切都很好。
enter image description here
这是我的代码:

BottomNavigationBar(
selectedFontSize: 0,
type: BottomNavigationBarType.fixed,
currentIndex: currIndex,
items: tabs.map((e) {
return BottomNavigationBarItem(
title: SizedBox.shrink(),
icon: _buildIcon(e),
);
}).toList(),
)


Widget _buildIcon(Data data) {

return Container(
width: double.infinity,
height:kBottomNavigationBarHeight ,
child: Material(
color: _getBackgroundColor(data.index),
child: InkWell(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Icons.email_outlined),

Text('111', style: TextStyle(fontSize: 12, color: Colors.white)),
],
),
onTap: () {
onTabSelected(data.index);
},
),
),
);
}
我如何删除那些顶部和底部填充?任何想法,我将不胜感激。

最佳答案

我使用您的零件代码制作了示例代码。
但是我无法通过共享您的代码重现您的问题。
您能否共享Scaffold的bottomNavigationBar的一部分或其他与代码相关的东西。
enter image description here

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
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>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.display1,
),
],
),
),
bottomNavigationBar: BottomNavigationBar(
selectedFontSize: 0,
type: BottomNavigationBarType.fixed,
currentIndex: 0,
items: [
new BottomNavigationBarItem(
icon: _buildIcon(),
title: SizedBox.shrink(),
),
new BottomNavigationBarItem(
icon: _buildIcon(),
title: SizedBox.shrink(),
),
new BottomNavigationBarItem(
icon: _buildIcon(),
title: SizedBox.shrink(),
)
]));
}

Widget _buildIcon() {
return Container(
width: double.infinity,
height: kBottomNavigationBarHeight,
child: Material(
color: Colors.grey,
child: InkWell(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Icons.email_outlined),
Text('111', style: TextStyle(fontSize: 12, color: Colors.white)),
],
),
onTap: () {},
),
),
);
}
}

关于flutter - Flutter-如何从BottomNavigationBar删除填充?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64699632/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com