CODEWITHSUNDEEP
flutterdart
Mahmoud Al-Haroon
Mahmoud Al-Haroon

Reputation: 2449

How to change tab bar item size in flutter

I have the below TabBar:

bottom: TabBar(
                  onTap: (index) {
                    cubit.changeBottomNavIndex(index);
                  },
                  indicator: BoxDecoration(
                    border: Border.all(color: goldDefaultColor, width: 1),
                    shape: BoxShape.rectangle,
                    borderRadius: BorderRadius.circular(50),
                    color: Colors.grey[600],
                  ),
                  labelColor: goldDefaultColor,
                  unselectedLabelColor: Colors.white,
                  tabs: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      children: [
                        Tab(
                          text: 'Live',
                        ),
                        CircleAvatar(
                          radius: 5.0,
                          backgroundColor: Colors.red,
                        ),
                      ],
                    ),
                    Tab(
                      text: 'Map',
                    ),
                    Tab(
                      text: 'Device',
                    ),
                  ],
                  controller: _tabController,
                ),

looks like the below image:

enter image description here

I want to make it smaller like the below image: enter image description here

is it possible to do this?

Upvotes: 1

Views: 410

Answers (1)

Sajad Abdollahi
Sajad Abdollahi

Reputation: 1741

You can set the size of tabs to be the minimum size by adding

        indicatorSize: TabBarIndicatorSize.label,

to TabBar widget

Upvotes: 2

Related Questions