- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 flutter_bloc包裹。如果我有一个状态是小部件列表的 Bloc ,这是一种不好的做法吗?我使用此 bloc 从列表中推送(添加)和弹出(删除)小部件/迷你屏幕。我将此列表用作弹出菜单的主体,它具有类似于嵌入式导航的功能。列表的最后一个成员是显示在弹出窗口中的小部件。
每次我按下或弹出时,我都会发出一个新状态。该 bloc 很有用,因为这样我就可以从弹出窗口中显示的小部件/迷你屏幕中的任何位置调用推送或弹出。请让我知道我的用例是否清楚或者您是否需要更多详细信息。谢谢。
相关代码如下:
自定义堆栈(其中 E
的类型为 Widget
):
class PopoverStack<E> {
PopoverStack() : _storage = <E>[];
final List<E> _storage;
void push(E element) {
_storage.add(element);
}
void pop() {
_storage.removeLast();
}
E get last => _storage.last;
bool get isEmpty => _storage.isEmpty;
bool get isNotEmpty => !isEmpty;
PopoverStack.of(PopoverStack<E> stack) : _storage = List<E>.of(stack._storage);
}
Bloc for stack(PopoverPage
是一个抽象类 widgets 将扩展):
class PopoverCardStackBloc extends Cubit<PopoverStack<PopoverPage>> {
PopoverCardStackBloc(PopoverStack<PopoverPage> popoverStack) : super(popoverStack);
void push(PopoverPage element) {
emit(PopoverStack.of(state..push(element)));
}
void pop() {
emit(PopoverStack.of(state..pop()));
}
}
Popover body(在这里你会看到我使用 state.last
作为 Widget
的地方):
class PopoverCardBody extends StatelessWidget {
const PopoverCardBody({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return BlocBuilder<PopoverCardStackBloc, PopoverStack<PopoverPage>>(
builder: (context, state) {
state;
return Material(
color: Colors.transparent,
borderRadius: BorderRadius.circular(16),
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: AnimatedContainer(
decoration: BoxDecoration(borderRadius: BorderRadius.circular(16)),
height: state.last.height,
width: 429,
duration: const Duration(milliseconds: 200),
curve: Curves.decelerate,
child: Column(
children: [
Container(
height: 72,
padding: const EdgeInsets.all(16),
color: AppColors.backgroundLight.withOpacity(.5),
child: CenteredTitleBar(
title: state.last.title,
leadingChild: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: state.last.showBackButton
? () {
context.read<PopoverCardStackBloc>().pop();
}
: () {
BookingCard.tooltip.close();
},
child: state.last.showBackButton
? const Icon(
Icons.chevron_left,
color: Colors.white,
size: 24,
)
: const Text(
'Close',
style: TextStyle(
color: AppColors.textWhite,
fontSize: 16,
fontWeight: FontWeight.w400,
),
),
),
trailingChild: _buildActionButton(context),
),
),
Expanded(
flex: 80,
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
child: state.last as Widget,
),
)
],
),
),
),
);
},
);
}
Widget _buildActionButton(BuildContext context) {
switch (context.read<PopoverCardStackBloc>().state.last.editButtonType) {
case StackActionButtonType.NONE:
return const SizedBox.shrink();
case StackActionButtonType.EDIT:
return MockActionButton(
labelPadding: const EdgeInsets.only(right: 16, left: 16, top: 7, bottom: 9),
backgroundColor: AppColors.accentButton,
borderRadius: BorderRadius.circular(8),
splashColor: AppColors.transparent,
label: 'Edit',
textStyle: const TextStyle(
color: AppColors.textWhite,
fontSize: 16,
fontWeight: FontWeight.w600,
),
onTap: () {
context.read<PopoverCardStackBloc>().push(const EditReservationPage());
},
);
case StackActionButtonType.SAVE:
return MockActionButton(
labelPadding: const EdgeInsets.only(right: 16, left: 16, top: 7, bottom: 9),
backgroundColor: AppColors.accentButton,
borderRadius: BorderRadius.circular(8),
splashColor: AppColors.transparent,
label: 'Save',
textStyle: const TextStyle(
color: AppColors.textWhite,
fontSize: 16,
fontWeight: FontWeight.w600,
),
onTap: () {
//TODO: make request with PopoverEditCardStackBloc state to update booking when api is ready.
BookingCard.tooltip.close();
},
);
}
}
}
这些类(class)只是为那些想要更多地了解该方法的人准备的,但是它们应该没有任何问题。问题更多是关于解决所描述用例的正确方法是什么。
最佳答案
将小部件放在一个 block 中是一种不好的做法。您的 bloc 不应包含任何小部件和来自 Flutter 框架的导入。一个 bloc 应该只有 Dart 代码并保持平台/环境独立。
这是 bloc 架构的第一条规则,也是工程师在 Google 开发它的原因。他们试图为 Flutter 和 AngularDart 应用程序使用相同的业务逻辑代码,并提出了 BloC 架构。您可以观看此视频,:) 这一切是如何开始的:https://www.youtube.com/watch?v=kn0EOS-ZiIc
并查看有关 bloc 架构的链接:https://bloclibrary.dev/#/architecture
关于flutter - 如果我的 Bloc 的状态是一个小部件列表,这是一种不好的做法吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72382245/
如果您想分享更多信息,可以在这里找到整个资源 指针: https://github.com/sergiotapia/DreamInCode.Net 基本上,我的API将为其他开发人员提供
关闭。这个问题需要更多focused .它目前不接受答案。 想改进这个问题吗? 更新问题,使其只关注一个问题 editing this post . 关闭 5 年前。 Improve this qu
我不是 SCM 工具的经验丰富的用户,尽管我确信它们的用处,当然。 我在以前的工作中使用了一些不起眼的商业工具,在当前的工作中使用了 Perforce,并在我的小型个人项目中使用了 TortoiseS
所以我想知道一些我应该避免在 javascript 中做的事情以获得良好的 SEO 排名。在我的下一个站点中,我将广泛使用 jquery 和 javascript,但不想牺牲 SEO。那么您认为我应该
基本上,我想知道什么是避免 future CSS 代码出现问题和混淆的最佳方法... 像这样命名 CSS 属性: div#content ul#navigation div.float-left (真
我是一名优秀的程序员,十分优秀!