Flutter - 我的 BlocBuilder 没有收到状态更改的通知

Question

我的

我的 BlocBuilder 没有收到状态更改的通知，但我确实发出了 MenuAnimationError 。 我的输出：

Instance of 'MenuAnimationInitial'
INITIAL
[-in]
MenuAnimationError instantiated
[in-]

我的主文件。

// main.dart
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:pmu/features/players/menu_animation_cubit.dart';
import 'package:pmu/features/players/player_page.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MultiBlocProvider(
        providers: [
          // BlocProvider(create: (context) => PlayerCubit()),
          BlocProvider<MenuAnimationCubit>(create: (_) => MenuAnimationCubit()),
        ],
        child: PlayerPage(),
      ),
    );
  }
}

我的小部件 BlocBuilder 在哪里。 玩家页面.dart

// features/players/player_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:pmu/features/players/menu_animation_cubit.dart';

class PlayerPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Player Page'),
      ),
      body: 
          BlocBuilder<MenuAnimationCubit, MenuAnimationState>(
            builder: (context, state) {
              final menuAnimationCubit = context.read<MenuAnimationCubit>();
              print(state);
              if (state is MenuAnimationLoaded) {
                print("LOADED");
              } else if (state is MenuAnimationInitial) {
                print("INITIAL");
                menuAnimationCubit.loadMenuAnimation();
                return Container(
                  color: Colors.yellow,
                  width: double.infinity, // Takes up the full width
                  height: double.infinity, // Takes up the full height
                );
              } else if (state is MenuAnimationError) {
                return Container(
                  color: Colors.red,
                  width: double.infinity, // Takes up the full width
                  height: double.infinity, // Takes up the full height
                );
              } else {
                return Container(
                  color: Colors.blue,
                  width: double.infinity, // Takes up the full width
                  height: double.infinity, // Takes up the full height
                );
              }
            },
          ),
    );
  }
  
}

我的状态

功能/玩家/menu_animation_state.dart

// features/players/menu_animation_state.dart

part of 'menu_animation_cubit.dart';

abstract class MenuAnimationState {
  const MenuAnimationState();
}

class MenuAnimationInitial extends MenuAnimationState {
  const MenuAnimationInitial();
}

class MenuAnimationLoading extends MenuAnimationState {}

class MenuAnimationLoaded extends MenuAnimationState {
  final VideoPlayerController videoController;

  const MenuAnimationLoaded(this.videoController);
}

class MenuAnimationError extends MenuAnimationState {
  final String error;

  const MenuAnimationError(this.error);

  // Add a named constructor for debugging purposes
  MenuAnimationError.debug(this.error) {
    print('MenuAnimationError instantiated');
  }
}

我的肘 功能/玩家/menu_animation_cubit.dart

// features/players/menu_animation_cubit.dart

import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:bloc/bloc.dart';

part 'menu_animation_state.dart';

class MenuAnimationCubit extends Cubit<MenuAnimationState> {
  MenuAnimationCubit() : super(const MenuAnimationInitial());

  void loadMenuAnimation() {
    print("[-in]");
    emit(MenuAnimationError.debug("Error loading video"));
    print("[in-]");
  }
  
}

我的 loadMenuAnimation() 函数被调用，我的 MenuAnimationError 类被实例化，但我的 BlocBuilder 没有收到状态更改的通知...

Answer 1

您可以使用

scheduleMicrotask

或 postFrameCallback 而不是在构建期间直接更改状态。

} else if (state is MenuAnimationInitial) {
  print("INITIAL");
  scheduleMicrotask(() {
    menuAnimationCubit.loadMenuAnimation();
  });

很可能您会在此方法上执行一些异步操作，那么就不需要它了。

  void loadMenuAnimation() async {
    print("[-in]");
    await Future.delayed(const Duration(seconds: 2)); //your future code here
    emit(MenuAnimationError.debug("Error loading video"));
    print("[in-] ${state}");
  }