我正在尝试使用Flutter提供的Bloc模式实现一个ToggleButton,代码非常简单,但是有一个问题,当我尝试更新我的索引,以便它可以从Bloc发出来将我的值从bool更改时,整个事情将毫无作用,我已经尝试重新编写代码来查找问题,但我的猜测是更新不会通过。有人知道如何解决这个问题吗?
这里是我的集团:
import 'package:bloc/bloc.dart';
import 'package:equatable/equatable.dart';
import 'package:flutter/cupertino.dart';
part 'calculate_event.dart';
part 'calculate_state.dart';
class CalculateBloc extends Bloc<CalculateEvent, CalculateState> {
///Constructor
CalculateBloc()
: super(CalculateInitial(
selection: List.filled(3, false),
totalAmount: '',
textEditingController: TextEditingController())) {
///On-Method to emit the State
on<CalculateEvent>((event, emit) {
///UpdateSelectionEvent
if (event is UpdateSelectionEvent) {
///emit the Index of the button-press
final updateSelect = List.of(state.selection);
for (int i = 0; i < updateSelect.length; i++) {
updateSelect[i] = event.selectIndex == i;
}
emit(UpdateSelectionState(
selection: updateSelect,
totalAmount: state.TotalAmount,
tip: state.tip,
textEditingController: state.textEditingController));
}
///CalculatePercentageEvent
if (event is CalculatePercentageEvent) {
final controller = state.textEditingController;
final totalAmount = double.parse(controller.text);
final selectedIndex = state.selection.indexWhere((element) => element);
final tipPercentage = [0.1, 0.15, 0.2][selectedIndex];
final tipTotal = (totalAmount * tipPercentage).toStringAsFixed(2);
emit(CalculatePercentageState(
selection: state.selection,
totalAmount: totalAmount.toString(),
tip: tipTotal,
textEditingController: state.textEditingController));
}
});
}
}
这是我的国家级:
part of 'calculate_bloc.dart';
@immutable
abstract class CalculateState extends Equatable {
final List<bool> selection;
final String? tip;
final String TotalAmount;
final TextEditingController textEditingController;
CalculateState(
{this.tip = '',
required this.TotalAmount,
required this.selection,
required this.textEditingController});
@override
List<Object?> get props => [selection, tip, TotalAmount];
}
class CalculateInitial extends CalculateState {
CalculateInitial(
{required List<bool> selection,
String? tip = '',
required String totalAmount,
required TextEditingController textEditingController})
: super(
selection: selection,
TotalAmount: totalAmount,
textEditingController: textEditingController);
}
class CalculatePercentageState extends CalculateState {
CalculatePercentageState(
{required List<bool> selection,
String? tip = '',
required String totalAmount,
required TextEditingController textEditingController})
: super(
selection: selection,
TotalAmount: totalAmount,
tip: tip,
textEditingController: textEditingController);
}
class UpdateSelectionState extends CalculateState {
UpdateSelectionState(
{required List<bool> selection,
String? tip = '',
required String totalAmount,
required TextEditingController textEditingController})
: super(
selection: selection,
TotalAmount: totalAmount,
tip: tip,
textEditingController: textEditingController);
}
下面是我的事件类:
part of 'calculate_bloc.dart';
@immutable
abstract class CalculateEvent {}
class CalculatePercentageEvent extends CalculateEvent {}
class UpdateSelectionEvent extends CalculateEvent {
final int selectIndex;
UpdateSelectionEvent(this.selectIndex);
}
我的用户界面:
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_day_1/bloc/calculate_bloc.dart';
class HomePage extends StatelessWidget {
const HomePage({super.key});
@override
Widget build(BuildContext context) {
return BlocProvider(
create: (context) => CalculateBloc(),
child: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
BlocBuilder<CalculateBloc, CalculateState>(
bloc: BlocProvider.of<CalculateBloc>(context),
builder: (context, state) {
if (state.tip != null) {
return Column(
children: [
Padding(
padding: const EdgeInsets.all(20),
child: Text(state.tip ?? '',
style: const TextStyle(fontSize: 30)),
),
const Text('Total Amount'),
SizedBox(
width: 80,
child: TextField(
controller: state.textEditingController,
keyboardType:
const TextInputType.numberWithOptions(),
textAlign: TextAlign.center,
decoration:
const InputDecoration(hintText: '\$100.00'),
),
),
Padding(
padding: const EdgeInsets.all(20),
child: ToggleButtons(
onPressed: (index) =>
BlocProvider.of<CalculateBloc>(context)
.add(UpdateSelectionEvent(index)),
isSelected: state.selection,
children: const [
Text('10%'),
Text('15%'),
Text('20%'),
],
),
),
],
);
} else {
return Container(
child: const Text('flase'),
);
}
}),
ElevatedButton(
onPressed: () {
BlocProvider.of<CalculateBloc>(context)
.add(CalculatePercentageEvent());
},
child: const Text('Calculate Amount'),
),
],
),
),
),
);
}
}
我试过使用一些BlocListener,但是它不起作用。我的另一个猜测是使用additionl状态来发出它。
1条答案
按热度按时间33qvvth11#
我已经发现了问题,在主页上,BlocProvider不断地用CalculateInitialState构建应用,这样新的值就不会被传递了。