I’m going through a problem relating to the TabBar in flutter,I’ve used this TabBar as bottomNavigationBar property in my code.
The aim of utilizing a TabBar is that I’ve prime indicator so to realize that I’ve used it as bottomNavigationBar property.
Please assist me resolve this seemed for a lot of options however not resolved :
class Residence extends StatelessWidget {
HomeTabController homeTabController = Get.put(HomeTabController());
Residence({tremendous.key});
@override
Widget construct(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.appBarColor,
physique: const SafeArea(
youngster: CommonAppBar(),
),
bottomNavigationBar: createTabBar(context),
);
}
Widget createTabBar(BuildContext context) {
return Container(
top: DesignConstants.tabHeight,
width: Get.width,
youngster: TabBar(
indicator: TopIndicator(),
controller: homeTabController.tabController,
labelPadding: EdgeInsets.all(0),
tabs: homeTabController.tabs,
),
);
}
}
Controller Class
class HomeTabController extends GetxController with GetSingleTickerProviderStateMixin{
late TabController tabController;
remaining Record<Tab> tabs = <Tab>[];
var tabpos = 0.obs;
@override
void onInit() {
tremendous.onInit();
getTabs();
tabController = TabController(size: tabs.size, vsync: this);
}
void getTabs() {
tabs.clear();
tabs.add(createTab('Residence',"${ImagePaths.bottomMenuPath}/home_icon.svg",0));
tabs.add(createTab('Matches',"${ImagePaths.bottomMenuPath}/home_icon.svg", 1));
}
Tab createTab(String textual content,String imagePath,int index) {
return Tab(
youngster: Obx(() => Middle(
youngster: Column(
kids: [
SvgPicture.asset(
imagePath,
height: DesignConstants.bottomMenuIconSize,
width: DesignConstants.bottomMenuIconSize,
),
TextLanCommon(text.toUpperCase(),
style: (tabpos.value == index)
? getnotificatontabselected()
: getnotificationtabunselected()),
],
),
)));
}
@override
void onClose() {
tabController.dispose();
tremendous.onClose();
}
}
High Indicator Class
class TopIndicator extends Ornament {
@override
BoxPainter createBoxPainter([VoidCallback? onChanged]) {
return _TopIndicatorBox();
}
}
class _TopIndicatorBox extends BoxPainter {
@override
void paint(Canvas canvas, Offset offset, ImageConfiguration cfg) {
Paint _paint = Paint()
..colour = AppColors.indicatorColor
..strokeWidth = 3
..isAntiAlias = true;
canvas.drawLine(offset, Offset(cfg.dimension!.width + offset.dx, 0), _paint);
}
}
I attempted utilizing theme and background colors however problem with the TabBar itself what I did improper.Please assist me resolve this