fix(recommend): 修正窄筛选行横向居中

This commit is contained in:
Zhou Weidong committed 2026-10-22 20:59:02 +08:00
1 parent c7a0e277f2
commit 196ce69a12
2 files changed
+29 -19

No files matched your search

+2
View File
@@ -1220,3 +1220,5 @@ $ flutter test
- 第 4 行仅最热/最新在滚动区内,44 圆形筛选按钮固定在滚动区外;`flutter analyze` 无问题。 - 第 4 行仅最热/最新在滚动区内,44 圆形筛选按钮固定在滚动区外;`flutter analyze` 无问题。
- 四行统一复用 `_filterRow` 构建,筛选区仅保留一层左右 12 padding。 - 四行统一复用 `_filterRow` 构建,筛选区仅保留一层左右 12 padding。
- 新增量化测试断言四行首项 x 均为 12、相邻 chip 间距均为 10;`flutter analyze` 无问题。 - 新增量化测试断言四行首项 x 均为 12、相邻 chip 间距均为 10;`flutter analyze` 无问题。
- 修复横向 viewport 对短内容居中:滚动内容最小宽度撑满视口后由 Row.start 排列。
- `flutter test test/recommend/all_dramas_filter_alignment_test.dart`:1 项测试通过。
@@ -186,15 +186,9 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
}) { }) {
return _filterRow( return _filterRow(
row: row, row: row,
child: SingleChildScrollView( child: _horizontalChipScroll(
key: Key('all-filter-scroll-$row'), scrollKey: Key('all-filter-scroll-$row'),
scrollDirection: Axis.horizontal, chips: [
physics: const BouncingScrollPhysics(),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
for (var index = 0; index < options.length; index++) ...[ for (var index = 0; index < options.length; index++) ...[
_chip( _chip(
key: Key('all-filter-${options[index].id}'), key: Key('all-filter-${options[index].id}'),
@@ -207,6 +201,27 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
], ],
], ],
), ),
);
}
Widget _horizontalChipScroll({
required Key scrollKey,
required List<Widget> chips,
}) {
return LayoutBuilder(
builder: (context, constraints) => SingleChildScrollView(
key: scrollKey,
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: ConstrainedBox(
constraints: BoxConstraints(minWidth: constraints.maxWidth),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: chips,
),
),
), ),
); );
} }
@@ -286,15 +301,9 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
Expanded( Expanded(
child: SingleChildScrollView( child: _horizontalChipScroll(
key: const Key('all-filter-scroll-3'), scrollKey: const Key('all-filter-scroll-3'),
scrollDirection: Axis.horizontal, chips: [
physics: const BouncingScrollPhysics(),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_chip( _chip(
key: const Key('all-sort-hot'), key: const Key('all-sort-hot'),
label: l10n.hot, label: l10n.hot,
@@ -311,7 +320,6 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
], ],
), ),
), ),
),
const SizedBox(width: AppDimens.filterItemGap), const SizedBox(width: AppDimens.filterItemGap),
Material( Material(
key: const Key('all-dramas-filter-page-button'), key: const Key('all-dramas-filter-page-button'),