TabBar sample

[prasant10050]

How can we do handle state management with tabBar in flutter?Please upload a simple basic example where there are two tabs one tab showing seven days and seconds tab is showing 1 to 30 date's value,
it's urgent for my production app

[felangel]

Hi @prasant10050 👋
Thanks for opening an issue!

Can you please provide some more information/example of what you're trying to build? I'm not sure why you need a bloc for a TabBar. You can have a bloc manage the state of each tab and wrap the tab in BlocProvider like so:

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

void main() {
  runApp(TabBarSample());
}

class TabBarSample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 2,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.directions_transit)),
              ],
            ),
            title: Text('Tabs Demo'),
          ),
          body: TabBarView(
            children: [
              BlocProvider(
                builder: (context) => BlocA(),
                child: TabA(),
              ),
              BlocProvider(
                builder: (context) => BlocB(),
                child: TabB(),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Hope that helps 👍

[prasant10050]

Hi, First of all thank you that you have given me the reply. I liked your package very much and I am using it but sometimes I have been facing issue like this issue and am using your package at my own risk in production app of company, Now I test that only what you have answered can solve my issue.i will reply you. Again thank you.

…

On Fri, Oct 4, 2019 at 10:16 AM Felix Angelov ***@***.***> wrote: Hi @prasant10050 <https://github.com/prasant10050> 👋 Thanks for opening an issue! Can you please provide some more information/example of what you're trying to build? I'm not sure why you need a bloc for a TabBar. You can have a bloc manage the state of each tab and wrap the tab in BlocProvider like so: import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; void main() { runApp(TabBarSample()); } class TabBarSample extends StatelessWidget { @OverRide Widget build(BuildContext context) { return MaterialApp( home: DefaultTabController( length: 2, child: Scaffold( appBar: AppBar( bottom: TabBar( tabs: [ Tab(icon: Icon(Icons.directions_car)), Tab(icon: Icon(Icons.directions_transit)), ], ), title: Text('Tabs Demo'), ), body: TabBarView( children: [ BlocProvider( builder: (context) => BlocA(), child: TabA(), ), BlocProvider( builder: (context) => BlocB(), child: TabB(), ), ], ), ), ), ); } } Hope that helps 👍 — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#549?email_source=notifications&email_token=ADH7S3NMZTIRSVTOBS5QWRTQM3DBRA5CNFSM4I5AUHO2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEAKMCNQ#issuecomment-538231094>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ADH7S3LT3F4S2HNIBDQS3CLQM3DBRANCNFSM4I5AUHOQ> .

[prasant10050]

HI, In your example i have added on icon button on app bar which call a dialog box where I go from a dialog box with a radio button to another screen, and then come again from that screen Then the dialog box is not opening again. I am opening the dialog box with Schedule Binding and all naviagtion and pop method is called under Schedule Binding.Please fix my issue.

…

On Fri, Oct 4, 2019 at 10:16 AM Felix Angelov ***@***.***> wrote: Hi @prasant10050 <https://github.com/prasant10050> 👋 Thanks for opening an issue! Can you please provide some more information/example of what you're trying to build? I'm not sure why you need a bloc for a TabBar. You can have a bloc manage the state of each tab and wrap the tab in BlocProvider like so: import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; void main() { runApp(TabBarSample()); } class TabBarSample extends StatelessWidget { @OverRide Widget build(BuildContext context) { return MaterialApp( home: DefaultTabController( length: 2, child: Scaffold( appBar: AppBar( bottom: TabBar( tabs: [ Tab(icon: Icon(Icons.directions_car)), Tab(icon: Icon(Icons.directions_transit)), ], ), title: Text('Tabs Demo'), ), body: TabBarView( children: [ BlocProvider( builder: (context) => BlocA(), child: TabA(), ), BlocProvider( builder: (context) => BlocB(), child: TabB(), ), ], ), ), ), ); } } Hope that helps 👍 — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#549?email_source=notifications&email_token=ADH7S3NMZTIRSVTOBS5QWRTQM3DBRA5CNFSM4I5AUHO2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEAKMCNQ#issuecomment-538231094>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ADH7S3LT3F4S2HNIBDQS3CLQM3DBRANCNFSM4I5AUHOQ> .

[felangel]

@prasant10050 can you please share the complete code which isn’t working for you?

[prasant10050]

I haven't share the code because it's completely against company protocol, I have only share the situation what am I facing

…

On Fri, 4 Oct, 2019, 6:48 PM Felix Angelov, ***@***.***> wrote: @prasant10050 <https://github.com/prasant10050> can you please share a the complete code which isn’t working for you? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#549?email_source=notifications&email_token=ADH7S3I5FKQP2PQAOLTOTGDQM47D3A5CNFSM4I5AUHO2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEALTUQY#issuecomment-538393155>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ADH7S3N5ZANMK2WPDWQ5K23QM47D3ANCNFSM4I5AUHOQ> .

[felangel]

@prasant10050 can you create a simple example? I don't need to see the company code, I just want to see a sample app which illustrates the same problem you're facing. Thanks!

[prasant10050]

Sure!

[prasant10050]

The first screen has two tabs, and each tab has a list of data.The list of data has two parts, the first header and the second its child inside that header,There is an add and delete button in the header section, a dialog box opens upon pressing the add button,The dialog box has two or three testfields and a submit button, after pressing the submit button, the data of the text field becomes the child of the header.You can also take a text field.But the issue is that the child is created, but the screen does not show immediate reflection, when I come from the second tab to the first tab, the result is visible.
In the same way, if you press the delete button from the header section, the child does not see any effect,
But if I work in a single screen, the effect of add and delete operation is seen, but the same screen not effect in tab bar view.I will thank you very much if you give me the solution for my issue

[felangel]

@prasant10050 thanks for the explanation but can you please create a sample flutter app that reproduces the issue and share the link with me? It's very hard to help without that.

[gutisalex]

I might have a case it would be convenient but I am not sure if I need a cubit/bloc for that.. I have a TabBar and some views. Inside of a view somewhere in the depth of the widget tree I have a button and want to change the currentIndex of the tabBar. Either I would use a cubit to save the currentIndex or I could probably use a GlobalKey for that?! But what if I want to change tab styles according to the currentIndex:

borderRadius: BorderRadius.only(
                topLeft: Radius.circular(_tabController.index == 0 ? 9 : 0),
                topRight: Radius.circular(_tabController.index == 3 ? 9 : 0),
              ),

What do you think?

[xErik]

The example above helped me figuring out using TabBarView and Bloc.

It should be noted that the child-widget accesses the returned state-value like this:

class TabA extends StatelessWidget {
  const TabA({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var state = context.read<BlocA>().state;
    var payload = state.your_payload;
  }
}

Also, the construction of the BlocProvider has to be updated:

BlocBuilder<BlocA, StateA>(
  builder: (context, state) => TabA(),
)