afonsocraposo / buttons_tabbar

A Flutter package that implements a TabBar where each label is a toggle button.
https://pub.dev/documentation/buttons_tabbar/latest/
MIT License
103 stars 34 forks source link

Tab Scroll issue while less 4 tab #33

Closed PinalGangani closed 1 year ago

PinalGangani commented 1 year ago

See below video for reference

https://user-images.githubusercontent.com/16683693/232491147-0363ddaa-e771-4fce-b850-b9734da9787d.mp4

afonsocraposo commented 1 year ago

Hey @PinalGangani ! Can you share the code you used to create that Tab Bar?

realitymolder commented 1 year ago

try to remove the flag "true" on center attribute.

PinalGangani commented 1 year ago

Okay Thank you

On Wed, 7 Jun 2023, 4:51 pm Daniel Toubul, @.***> wrote:

try to remove the flag "true" on center attribute.

— Reply to this email directly, view it on GitHub https://github.com/afonsocraposo/buttons_tabbar/issues/33#issuecomment-1580577274, or unsubscribe https://github.com/notifications/unsubscribe-auth/AD7JFLL2NK7HVKLUDBTUU4LXKBPZZANCNFSM6AAAAAAXBE44U4 . You are receiving this because you were mentioned.Message ID: @.***>

afonsocraposo commented 1 year ago

@PinalGangani did this fixed the issue?

afonsocraposo commented 1 year ago

Worked for me with the following code:

import 'package:buttons_tabbar/buttons_tabbar.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Example(),
    );
  }
}

class Example extends StatefulWidget {
  const Example({Key? key}) : super(key: key);

  @override
  // ignore: library_private_types_in_public_api
  _ExampleState createState() => _ExampleState();
}

class _ExampleState extends State<Example> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: DefaultTabController(
          length: 3,
          child: Column(
            children: <Widget>[
              ButtonsTabBar(
                unselectedBackgroundColor: Colors.grey[300],
                unselectedLabelStyle: const TextStyle(color: Colors.black),
                labelStyle:
                    const TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
                decoration: BoxDecoration(color: Colors.blue[900]),
                tabs: const [
                  Tab(
                    icon: Icon(Icons.directions_car),
                    text: "car",
                  ),
                  Tab(
                    icon: Icon(Icons.directions_transit),
                    text: "transit",
                  ),
                  Tab(icon: Icon(Icons.directions_bike)),
                ],
              ),
              const Expanded(
                child: TabBarView(
                  children: <Widget>[
                    Center(
                      child: Icon(Icons.directions_car),
                    ),
                    Center(
                      child: Icon(Icons.directions_transit),
                    ),
                    Center(
                      child: Icon(Icons.directions_bike),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
PinalGangani commented 1 year ago

Thanks Afonsocraposo/Buttons_tabbar

On Mon, 26 Jun 2023, 11:56 pm Afonso Raposo, @.***> wrote:

Worked for me with the following code:

import 'package:buttons_tabbar/buttons_tabbar.dart';import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key});

@override Widget build(BuildContext context) { return const MaterialApp( home: Example(), ); } } class Example extends StatefulWidget { const Example({Key? key}) : super(key: key);

@override // ignore: library_private_types_in_public_api _ExampleState createState() => _ExampleState(); } class _ExampleState extends State { @override Widget build(BuildContext context) { return Scaffold( body: SafeArea( child: DefaultTabController( length: 3, child: Column( children: [ ButtonsTabBar( unselectedBackgroundColor: Colors.grey[300], unselectedLabelStyle: const TextStyle(color: Colors.black), labelStyle: const TextStyle(color: Colors.white, fontWeight: FontWeight.bold), decoration: BoxDecoration(color: Colors.blue[900]), tabs: const [ Tab( icon: Icon(Icons.directions_car), text: "car", ), Tab( icon: Icon(Icons.directions_transit), text: "transit", ), Tab(icon: Icon(Icons.directions_bike)), ], ), const Expanded( child: TabBarView( children: [ Center( child: Icon(Icons.directions_car), ), Center( child: Icon(Icons.directions_transit), ), Center( child: Icon(Icons.directions_bike), ), ], ), ), ], ), ), ), ); } }

— Reply to this email directly, view it on GitHub https://github.com/afonsocraposo/buttons_tabbar/issues/33#issuecomment-1608003081, or unsubscribe https://github.com/notifications/unsubscribe-auth/AD7JFLNSYKMJPVQPWCHS4FLXNHH6DANCNFSM6AAAAAAXBE44U4 . You are receiving this because you were mentioned.Message ID: @.***>