title: Flutter bloc: updating the state does not refresh my view which is manged by bloc
body: <p>gender_page</p>
  <pre><code>class GenderPage extends StatelessWidget {
    final UserRepository userRepository;
  
    GenderPage({@required this.userRepository});
  
    @override
    Widget build(BuildContext context) {
      return BlocProvider(
        create: (context) =&gt; SexblocBloc(userRepository: userRepository),
        child: SelectGenderPage(userRepository: userRepository),
      );
    }
  }
  
  // ignore: must_be_immutable
  class SelectGenderPage extends StatelessWidget {
    UserRepository userRepository;
    FirebaseUser user;
    ProgressDialog pr;
    SexblocBloc sexblocBloc;
   bool isSelecte=false;
   bool isSelecteds=true;
  
    SelectGenderPage({this.userRepository});
    @override
    Widget build(BuildContext context) {
       sexblocBloc = BlocProvider.of&lt;SexblocBloc&gt;(context);
      pr = ProgressDialog(
        context,
        type: ProgressDialogType.Normal,
        isDismissible: false,
      );
      pr.style(
          message: 'Loading please wait...',
          borderRadius: 2.0,
          progressWidget: Padding(
            padding: const EdgeInsets.all(8.0),
            child: CircularProgressIndicator(
                valueColor: AlwaysStoppedAnimation(Colors.pinkAccent),
                strokeWidth: 2.0),
          ),
          elevation: 10.0,
          insetAnimCurve: Curves.easeInOut,
          messageTextStyle:
              TextStyle(fontSize: 18.0, fontWeight: FontWeight.w300));
  
      // Size size = MediaQuery.of(context).size;
      return Scaffold(
        
        bottomNavigationBar: BottomAppBar(
          child: InkWell(
            onTap: () {
              
            },
            child: Container(
              color: Colors.pink,
              height: 46,
              width: double.infinity,
              child: Center(
                child: Text(
                  'Next',
                  style: TextStyle(
                    fontSize: 16,
                    color: Colors.white,
                  ),
                ),
              ),
            ),
          ),
        ),
  
        body:  Builder(builder: (BuildContext context) {
          return Container(
                padding: EdgeInsets.only(left: 16, right: 16),
                  child: Container(
                    child:  BlocListener&lt;SexblocBloc, SexblocState&gt;(
                listener: (context, state)  async {
                  if (state is SexLoadingState) {
                          pr.hide();
                  } else if(state is SexblocInitial){
                        isSelecte=false;
                        isSelecteds=true;
                          pr.hide();
                  }
                  else if (state is SexblocSelectedMaleState)  {
                      pr.hide();
                        print(&quot;Malee&quot;);
                        isSelecteds=true;
                        isSelecte=false;
                   
                  } else if (state is SexblocSelectedFemaleState)  {
                      pr.hide();
                       print(&quot;FeMale&quot;);
                        isSelecte=true;
                        isSelecteds=false;
                  }
                  else if (state is SexFailState) {
                       pr.hide();
                    }
                },
  
        
        child : Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: &lt;Widget&gt;[
              Container(
                padding: EdgeInsets.only(bottom: 10),
                width: 320,
                child: Text('I am a',
                    style: TextStyle(
                      fontSize: 30,
                      // color: Colors.pink,
                    )),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: &lt;Widget&gt;[
                  DispalyBox(
                    context:context,
                     sexblocBloc : sexblocBloc,
                      userRepository: userRepository,
                      imgURL: 'images/male.png',
                      sex: 'Male',
                      backColor: Color(0xFF4286F4),
                      isSelected: isSelecteds),
                      
                  SizedBox(
                    width: 20,
                  ),
                  DispalyBox(
                     context:context,
                       sexblocBloc : sexblocBloc,
                      userRepository: userRepository,
                      imgURL: 'images/female.png',
                      sex: 'Female',
                      backColor: Color(0xFF0F9D58),
                      isSelected: isSelecte),
                ],
              ),
            ]),
  
             ),
            ),
        
          );
        }),
        
      );
    }
  
    void navigateToUserPage(
        BuildContext context, UserRepository userRepository, String gender) {
      //prefs.setGenderVal(gender);
      Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) {
        return SelectUserPage(userRepository: userRepository);
      }));
    }
  }
  
  class DispalyBox extends StatelessWidget {
    const DispalyBox({
      Key key,
       @required this.context,
      @required this.userRepository,
      @required this.imgURL,
      @required this.sex,
      @required this.backColor,
      @required this.isSelected,
       @required this.sexblocBloc,
    }) : super(key: key);
  
    final UserRepository userRepository;
      final  BuildContext context;
    final String imgURL;
    final String sex;
    final Color backColor;
    final bool isSelected;
    final  SexblocBloc sexblocBloc;
    
    @override
    Widget build( context) {
       print(isSelected);
      return InkWell(
        onTap: () {
  
          if(sex=='Male'){
             sexblocBloc.selectGender(sex);
          }else{  
            sexblocBloc.selectFemaleGender(sex);
          }
          
         
        },
        child: Container(
            height: 180,
            width: 150,
            foregroundDecoration: BoxDecoration(
              color: isSelected ? Colors.transparent : Colors.black,
              backgroundBlendMode: BlendMode.saturation,
            ),
            child: Card(
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(7.0),
              ),
              child: Stack(
                children: &lt;Widget&gt;[
                  Positioned(
                    top: 10,
                    left: 10,
                    child: Icon(
                      Icons.adjust,
                      color: backColor,
                      size: 24.0,
                      semanticLabel: '',
                    ),
                  ),
                  Positioned(
                    top: 10,
                    left: 40,
                    child: Text(sex,
                        style: TextStyle(
                          fontSize: 20,
                          color: Colors.amber,
                        )),
                  ),
                  Positioned(
                    bottom: 0,
                    right: 3,
                    child: Image(
                      width: 135,
                      image: AssetImage(imgURL),
                    ),
                  ),
                ],
              ),
            )),
      );
    }
  }
  </code></pre>
  <p>gender_bloc</p>
  <pre><code>class SexblocBloc extends Bloc&lt;SexblocEvent, SexblocState&gt; {
  UserRepository userRepository;
  
    SexblocBloc({UserRepository userRepository}) : super(null) {
      this.userRepository = userRepository;
    }
  
    SexblocState get initialState =&gt; SexblocInitial();
  
    @override
    Stream&lt;SexblocState&gt; mapEventToState(SexblocEvent event,) async* {
   if (event is SexButtonPressed) {
        yield SexLoadingState();
        try {
          
          yield SexblocSelectedMaleState(true);
        } catch (e) {
          print(e.toString());    
          yield SexFailState(e.toString());
        }
      }else if(event is FeMaleSexButtonPressed) {
        yield SexLoadingState();
        try {
          
          yield SexblocSelectedFemaleState(true);
        } catch (e) {
          print(e.toString());    
          yield SexFailState(e.toString());
        }
      }
  
      
    }
  
  
   //Gender button pressed
    selectGender(String sex) async {
      //SessionManager prefs=SessionManager();
      //String sex = await prefs.getGenderValue();
      print('GenderButtonPressed');
      add(
        SexButtonPressed(sex:sex),
      );
    }
  
    //Gender button pressed
    selectFemaleGender(String sex) async {
      //SessionManager prefs=SessionManager();
      //String sex = await prefs.getGenderValue();
      print('GenderButtonPressed');
      add(
        FeMaleSexButtonPressed(sex:sex),
      );
    }
  
  }
  </code></pre>
  <p>gender_state</p>
  <pre><code>abstract class SexblocState extends Equatable {
    const SexblocState();
  }
  
  class SexblocInitial extends SexblocState {
    @override
     List&lt;Object&gt; get props =&gt; null;
  }
  
  class SexLoadingState extends SexblocState {
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  
  class SexblocSelectedMaleState extends SexblocState {
     final bool select ;
    SexblocSelectedMaleState(this.select);
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  class SexblocSelectedFemaleState extends SexblocState {
     final bool select ;
    SexblocSelectedFemaleState(this.select);
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  
  class SexFailState extends SexblocState {
    final String message;
    SexFailState(this.message);
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  </code></pre>
  <p>gender_event</p>
  <pre><code>abstract class SexblocEvent extends Equatable {
    const SexblocEvent();
  }
  
  class SexButtonPressed extends SexblocEvent {
    final String sex;
    SexButtonPressed({this.sex});
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  class FeMaleSexButtonPressed extends SexblocEvent {
    final String sex;
    FeMaleSexButtonPressed({this.sex});
    @override
    List&lt;Object&gt; get props =&gt; null;
  }
  </code></pre>
  <p>I'm trying Bloc pattern for this with click event to select gender and after selecting it will change its color through state but have problem on my view when I use to click on it it won't change the color n not refresh it .Please help me with it as am not very much familiar with this bloc pattern.</p>