Home > database >  How to mange state in flutter in dropdown items selection
How to mange state in flutter in dropdown items selection

Time:05-21

enter image description hereHello im new at flutter platform can anyone tell me about how to manage sate in flutter i made an app where it have three dropdown items selection . What i need is when im selected all three items its gona save and reflect to next screen.. As per image my drop down data comming from rest api and need to select them one by one and goes for next screen where the selected data is been displayed... So please guide me how to manage state in this condition.

CodePudding user response:

If is it some kind of form in my opinion best way is create Flutter bloc dedicated to this form. https://pub.dev/packages/flutter_bloc

You can keep state directly in bloc or create repository. By calling events witch each change of selection you can redraw selected parts of form.

STATE

abstract class ParkingState extends Equatable {
  @override
  List<Object?> get props => [];
}

class ParkingIdleState extends ParkingState {}

class PlateSelectedState extends ParkingState {
  final String? selectedPlate;

  PlateSelectedState(this.selectedPlate);

  @override
  List<Object?> get props => [this.selectedPlate];
}

EVENTS

abstract class ParkingEvent extends Equatable {}

class SelectPlateEvent extends ParkingEvent {
  String plate;
  @override
  List<Object?> get props => [this.plate];

  SelectPlateEvent(this.plate);
}

BLOC

class ParkingOrderBloc extends Bloc<ParkingEvent, ParkingState> {
  String? selectedPlate = "";


  ParkingOrderBloc() : super(ParkingIdleState()) {
    on<SelectPlateEvent>(_dealWithSelectPlateEvent);
  }

  FutureOr<void> _dealWithSelectPlateEvent(SelectPlateEvent event, Emitter<ParkingState> emit) {
    this.selectedPlate = event.plate;
    emit(PlateSelectedState(this.selectedPlate));

  }
}

then in form class wrapped in blocbuilder you can call

context.read<ParkingOrderBloc>().add(SelectPlateEvent("PLATNUMBER"));

then read value:

String plate = context.read<ParkingOrderBloc>().selectedPlate;

CodePudding user response:

If you are new to Flutter, it is advisable to use setState.

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

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  String dropdownValue = 'One';

  @override
  Widget build(BuildContext context) {
    return DropdownButton<String>(
      value: dropdownValue,
      icon: const Icon(Icons.arrow_downward),
      elevation: 16,
      style: const TextStyle(color: Colors.deepPurple),
      underline: Container(
        height: 2,
        color: Colors.deepPurpleAccent,
      ),
      onChanged: (String? newValue) {
        setState(() {
          dropdownValue = newValue!;
        });
      },
      items: <String>['One', 'Two', 'Free', 'Four']
          .map<DropdownMenuItem<String>>((String value) {
        return DropdownMenuItem<String>(
          value: value,
          child: Text(value),
        );
      }).toList(),
    );
  }
}
  • Related