我正在尝试更新项目数(CrossAxisCount)以及基于方向的SliverGrid中的childAspectRatio。
我尝试用OrientationBuilder包装SliverGrid,这会抛出一个RenderLayout错误,因为在sliver中,直接的孩子应该是一个RenderSliver!
_gridview()中的SLiverGrid : GridList.dart
import 'package:app_jokally/model/Items.dart';
import 'package:flutter/material.dart';
import 'ItemList.dart';
class GridList extends StatefulWidget {
@override
_GridListState createState() => _GridListState();
}
class _GridListState extends State<GridList> {
List<Items> itemList;
@override
Widget build(BuildContext context) {
itemList = _itemList();
return Container(
child: _gridView(),
);
}
Widget _gridView() {
return SliverGrid(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
childAspectRatio: 0.86,
),
delegate: SliverChildBuilderDelegate(
(context, index) {
return ItemList(context, items: itemList[index]);
},
childCount: itemList.length,
),
);
}
List<Items> _itemList() {
return [
Items(
id: 0,
shopName: "Demo",
shopCategory: "General",
street: "Lorem Ipsum 149",
//houseNo:
//zipCode:
city: "Demo",
province: "Demo",
country: "Demo",
rating: 4,
imageUrl: 'assets/images/shop1.png',
bannerUrl: 'assets/images/shop1.png',
shopImg1: 'assets/images/shop1.png',
shopImg2: 'assets/images/shop1.png',
shopImg3: 'assets/images/shop1.png',
shopImg4: 'assets/images/shop1.png',
),
Items(
id: 1,
shopName: "Demo",
shopCategory: "General",
street: "Lorem Ipsum 149",
//houseNo:
//zipCode:
city: "Demo",
province: "Demo",
country: "Demo",
rating: 4,
imageUrl: 'assets/images/shop1.png',
bannerUrl: 'assets/images/shop1.png',
shopImg1: 'assets/images/shop1.png',
shopImg2: 'assets/images/shop1.png',
shopImg3: 'assets/images/shop1.png',
shopImg4: 'assets/images/shop1.png',
),
];
}
}
父CustomScrollView: ShopsList.dart
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'GridList.dart';
class ShopList extends StatefulWidget {
@override
_JkShopList createState() => _JkShopList();
}
class _JkShopList extends State<ShopList> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Container(
margin: EdgeInsets.all(5),
child: OrientationBuilder(
builder: (context, orientation) {
return CustomScrollView(
slivers: <Widget>[
SliverAppBar(
automaticallyImplyLeading: false,
floating: true,
titleSpacing: 0,
backgroundColor: Colors.white,
elevation: 1.0,
title: _searchCard(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
SliverToBoxAdapter(
child: _shopListTitle(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
SliverToBoxAdapter(
child: ScrollableBadges(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
GridList(),
],
);
},
),
),
),
);
}
}
微件库捕获到══╡异常
╞═══════════════════════════════════════════════════════════
flutter: The following assertion was thrown building OrientationBuilder:
flutter: A RenderViewport expected a child of type RenderSliver but received a child of type
flutter: _RenderLayoutBuilder.
flutter: RenderObjects expect specific types of children because they coordinate with their children during
flutter: layout and paint. For example, a RenderSliver cannot be the child of a RenderBox because a
flutter: RenderSliver does not understand the RenderBox layout protocol.
flutter:
flutter: The RenderViewport that expected a RenderSliver child was created by:
flutter: Viewport ← IgnorePointer-[GlobalKey#fce57] ← Semantics ← Listener ← _GestureSemantics ←
flutter: RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#22327] ← Listener ← _ScrollableScope ←
flutter: _ScrollSemantics-[GlobalKey#3c1e1] ← Scrollable ← PrimaryScrollController ← CustomScrollView ← ⋯
flutter:
flutter: The _RenderLayoutBuilder that did not match the expected child type was created by:
flutter: LayoutBuilder ← OrientationBuilder ← Container ← GridList ← Viewport ←
flutter: IgnorePointer-[GlobalKey#fce57] ← Semantics ← Listener ← _GestureSemantics ←
flutter: RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#22327] ← Listener ← _ScrollableScope ←
flutter: ⋯
flutter:
flutter:
发布于 2019-06-04 02:50:05
从我给出的评论来看,我认为这就是你想要的:
class _JkShopList extends State<ShopList> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Container(
margin: EdgeInsets.all(5),
child: new OrientationBuilder(builder: (context, orientation){
return new CustomScrollView(
slivers: <Widget>[
SliverAppBar(
automaticallyImplyLeading: false,
floating: true,
titleSpacing: 0,
backgroundColor: Colors.white,
elevation: 1.0,
title: _searchCard(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
SliverToBoxAdapter(
child: _shopListTitle(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
SliverToBoxAdapter(
child: ScrollableBadges(),
),
SliverToBoxAdapter(
child: SizedBox(height: 15),
),
new SliverGrid(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: orientation == Orientation.portrait ? 2 : 3,
childAspectRatio: 0.86,
),
delegate: SliverChildBuilderDelegate(
(context, index) {
return ItemList(context, items: itemList[index]);
},
childCount: itemList.length,
),
),
],
);
}),
),
),
);
}
}
https://stackoverflow.com/questions/56432721
复制相似问题