the last item is not visible

[shahmirzali49]

current situation :

https://user-images.githubusercontent.com/49102327/116006953-870df280-a61e-11eb-9cfe-f35cff5879fe.mov

what we need :

https://user-images.githubusercontent.com/49102327/116006969-93924b00-a61e-11eb-8a73-64ae7016af1a.mov

my Code : https://pastebin.ubuntu.com/p/PFSSmVx9dW/

appBar: AppBar( brightness: Brightness.dark, title: Text('PRAY'), centerTitle: true, backgroundColor: Color(0xff16112a), bottom: ButtonsTabBar( height: 70, decoration: BoxDecoration( gradient: LinearGradient( colors: <Color>[ Color(0xFF0D47A1), Color(0xFF1976D2), Color(0xFF42A5F5), ], ), ), radius: 100, contentPadding: EdgeInsets.symmetric(horizontal: 30), buttonMargin: EdgeInsets.only(top: 10, bottom: 17, left: 20, right: 10), unselectedBackgroundColor: Color(0xff1c1b20), unselectedLabelStyle: TextStyle(color: Colors.white), labelStyle: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w600), controller: _tabController, tabs: newsTabs, ), ),

[afonsocraposo]

Please post the necessary code to recreate this issue

[shahmirzali49]

Please post the necessary code to recreate this issue

@Afonsocraposo you mean this - > https://stackoverflow.com/questions/54230115/horizontally-scrollable-tabs-focus-on-center-with-snap-in-flutter. ?

[afonsocraposo]

No @Shahmirzali-Huseynov . I mean the code you used to build what we're seeing in the video you posted.

[shahmirzali49]

@Afonsocraposo this video (second video ) is from Pray application in the google play store , unfortunately, I don't have any code :/ , that's why I create an issue

[afonsocraposo]

@Shahmirzali-Huseynov I'm referring to the code in which you use the buttons_tabbar package.

[shahmirzali49]

okay sorry :) i got

[shahmirzali49]

appBar: AppBar( brightness: Brightness.dark, title: Text('PRAY'), centerTitle: true, backgroundColor: Color(0xff16112a), bottom: ButtonsTabBar( height: 70, decoration: BoxDecoration( gradient: LinearGradient( colors: [ Color(0xFF0D47A1), Color(0xFF1976D2), Color(0xFF42A5F5), ], ), ), radius: 100, contentPadding: EdgeInsets.symmetric(horizontal: 30), buttonMargin: EdgeInsets.only(top: 10, bottom: 17, left: 20, right: 10), unselectedBackgroundColor: Color(0xff1c1b20), unselectedLabelStyle: TextStyle(color: Colors.white), labelStyle: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w600), controller: _tabController, tabs: newsTabs, ), ),

[shahmirzali49]

code : https://pastebin.ubuntu.com/p/PFSSmVx9dW/

[afonsocraposo]

https://user-images.githubusercontent.com/30601767/116012138-a3ab2a00-a620-11eb-9923-35a731f0008d.mp4

I tested your code and was not able to reproduce your error.

  late TabController _tabController;
  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: 5);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        brightness: Brightness.dark,
        title: Text('PRAY'),
        centerTitle: true,
        backgroundColor: Color(0xff16112a),
        bottom: ButtonsTabBar(
          height: 70,
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: <Color>[
                Color(0xFF0D47A1),
                Color(0xFF1976D2),
                Color(0xFF42A5F5),
              ],
            ),
          ),
          radius: 100,
          contentPadding: EdgeInsets.symmetric(horizontal: 30),
          buttonMargin:
              EdgeInsets.only(top: 10, bottom: 17, left: 20, right: 10),
          unselectedBackgroundColor: Color(0xff1c1b20),
          unselectedLabelStyle: TextStyle(color: Colors.white),
          labelStyle: TextStyle(
              color: Colors.white, fontSize: 20, fontWeight: FontWeight.w600),
          controller: _tabController,
          tabs: [
            Tab(
              text: "All",
            ),
            Tab(
              text: "Sleep",
            ),
            Tab(
              text: "Quran",
            ),
            Tab(
              text: "Category",
            ),
            Tab(
              text: "Health",
            ),
          ],
        ),
      ),
      body: SafeArea(
        child: TabBarView(
          controller: _tabController,
          children: <Widget>[
            Center(
              child: Icon(Icons.directions_car),
            ),
            Center(
              child: Icon(Icons.directions_transit),
            ),
            Center(
              child: Icon(Icons.directions_bike),
            ),
            Center(
              child: Icon(Icons.directions_car),
            ),
            Center(
              child: Icon(Icons.directions_transit),
            ),
          ],
        ),
      ),
    );
  }

[shahmirzali49]

@Afonsocraposo please don't close the issue immediately. the issue is continuing, please look at

same code + test in 2 devices same time : https://youtu.be/rC64n_P87R8

[afonsocraposo]

I just created a new Flutter project and used the code I sent you. Everything is working as supposed to. Please verify your code, maybe you wrote something that is messing with the Buttons TabBar.