How to change text after button click using Bloc flutter-CodePudding

So I'm learning basics of bloc and I wanted to know how to change a text using a button without setstate(), this whole time ive been using setstate but I would like to know how to change a text after a button click using bloc, state, event.

This is what I have so far

Main.dart

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
        providers: [
          BlocProvider(
            create: (_) => SecscreenBloc(),
          ),

        ],
        child: MaterialApp(
            onGenerateRoute: Routes().onGenerateRoute,
            title: 'Flutter Demo',
            theme: ThemeData(
              primarySwatch: Colors.blue,
            ),
            home: SecScreen()),
      );
  }
}

SecScreen.dart

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

  @override
  State<SecScreen> createState() => _SecScreenState();
}

class _SecScreenState extends State<SecScreen> {
  var numm = 1;
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => SecscreenBloc()..add(LoadSecscreenEvent(numm)),
      child: Scaffold(
        appBar: AppBar(
          title: Text("Bloc Increment"),
        ),
        body: BlocBuilder<SecscreenBloc,SecscreenState>(
          builder: (context,state){
            if(state is SecScreenLoadedState){
              return Column(
                children: [
                  Text("Activity:   ${state.number}"),
                  SizedBox(height: 30),
                  ElevatedButton(
                    onPressed: () => BlocProvider.of<SecscreenBloc>(context).add(LoadSecscreenEvent(
                      numm
                    )),
                    child: Icon(Icons.add),
                  ),
                ],
              );
            }
            return Container(
              color: Colors.red,
            );
          }
        ),
      ),
    );
  }
}

SecScreen_event.dart

abstract class SecscreenEvent extends Equatable {
  const SecscreenEvent();
}
class LoadSecscreenEvent extends SecscreenEvent{
  final int number;

  LoadSecscreenEvent(this.number);
  @override
  List<Object?> get props => [number];
}

SecScreen_state.dart

        part of 'secscreen_bloc.dart';

abstract class SecscreenState extends Equatable {
  const SecscreenState();
}

class SecscreenInitial extends SecscreenState {
  @override
  List<Object> get props => [];
}

class SecScreenLoadedState extends SecscreenState{

  final int number;
  SecScreenLoadedState(this.number);

  @override
  List<Object?> get props => [number];
}

secscreen_bloc.dart

class SecscreenBloc extends Bloc<SecscreenEvent, SecscreenState> {
  SecscreenBloc() : super(SecscreenInitial()) {
    on<LoadSecscreenEvent>((event, emit) {
      if (event is LoadSecscreenEvent){
        emit(SecScreenLoadedState(event.number   1));
      }
    });
  }
}

I've been stuck at this for an embarssingly long time, would appreciate some help!

CodePudding user response：

actually it is changed every time you press but every time the value gone to the bloc 1 and back 2 so you did not see the effection

just change the following line

onPressed: () => BlocProvider.of<SecscreenBloc>(context).add(LoadSecscreenEvent(
                  numm
                )),

to this one :

 onPressed: () => BlocProvider.of<SecscreenBloc>(context)
                  .add(LoadSecscreenEvent(state.number)),