skip to Main Content

My main screen is Tabbarview. I have different error states, and need to implement different UI for each. What is the best approach to deal with this if I only want one instance of Tabbarview, but need to have errors shown like this:

  1. State1 Error: show specific error inside individual tab content
  2. State2 Error: show error pop-up on top of Tabbarview, but hide tab content
  3. State3 error: show generic error on all tabs
  4. State4 error: show error fullscreen

2

Answers


  1. Are you using a state management library in your project, such as Bloc, Provider, or any other?

    Login or Signup to reply.
  2. Here is how I will do it.

    I will create an enum to group the definition of all error cases.

    enum ErrorState {
      state1, 
      state2, 
      state3, 
      state4, 
      none,
    }
    

    I will add the variable to track the error state in my StatefulWidget

    class MyScreen extends StatefulWidget {
      @override
      _MyScreenState createState() => _MyScreenState();
    }
    
    class _MyScreenState extends State<MyScreen> {
      ErrorState _errorState = ErrorState.none;
    
      @override
      Widget build(BuildContext context) {
        ...
      }
    }
    

    And I will implement the display of errors in separate functions

    @override
    Widget build(BuildContext context) {
      switch (_errorState) {
          case ErrorState.state1:
            return _buildUiOfErrorState1();
          case ErrorState.state2:
            return _buildUiOfErrorState2();
          case ErrorState.state3:
            return _buildUiOfErrorState3();
          case ErrorState.state4:
            return _buildUiOfErrorState4();
          default:
            return _buildNormalUI();
        }
    }
    
    Widget _buildUiOfErrorState1() {
    }
    
    Widget _buildUiOfErrorState2() {
    }
    
    Widget _buildUiOfErrorState3() {
    }
    
    Widget _buildUiOfErrorState4() {
    }
    

    This approach allows you to keep a single instance of TabBarView and manage the display according to different possible error states.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search