반응형
질문
나는 gridview.builder
의 자식에게 높이를 주려고 시도하고 있지만, 받아들이지 않고 있습니다. 컨테이너를 사용하여 시도했지만 작동하지 않습니다...
도와주세요
GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
),
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return Container(
height: 280.0,
child: Column(
children: <Widget>[
Padding(
padding:
EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 10.0),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 208.5,
width: 138.75,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10.0),
image: DecorationImage(
image: NetworkImage(
"${snapshot.data[index].url}"),
fit: BoxFit.fill)),
),
),
Text(
snapshot.data[index].title,
style: TextStyle(fontSize: 17.0),
),
],
),
);
},
),`
답변
다음은 SliverGridDelegate
의 childAspectRatio
속성을 MediaQuery
와 함께 사용하는 것이 좋습니다:
class HomePage extends StatelessWidget {
final List<String> items = <String>[
"아이템 1",
"아이템 2",
"아이템 3",
"아이템 4",
"아이템 5",
"아이템 6",
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('홈')),
body: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
childAspectRatio: MediaQuery.of(context).size.width /
(MediaQuery.of(context).size.height / 4),
),
itemCount: items.length,
itemBuilder: (context, index) {
return GridTile(child: Text(items[index]));
},
),
);
}
}
반응형
댓글