抖动中的自定义高度网格视图

Question

我做我的flutter应用程序。如何在flutter中使用自定义高度和权重进行网格视图？网格视图中的项目应为矩形，而不是正方形。

Answer 1

您将必须使用childAspectRatio。我在下面的横向和纵向模式示例中也做了明确说明。如果要使用正方形网格，请考虑将childAspectRatio用作1。

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<String> cities = ['Kathmandu', 'Baglung', 'Pokhara'];
  var width = 100;
  var height = 200;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        body: Container(
          color: Colors.blueAccent,
          child: GridView.builder(
              itemCount: cities.length,
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: MediaQuery.of(context).orientation ==
                          Orientation.landscape ? 3: 2,
                  crossAxisSpacing: 8,
                  mainAxisSpacing: 8,
                  childAspectRatio: width / height),
              itemBuilder: (context, position) {
                return Container(
                  alignment: Alignment.center,
                  color: Colors.black,
                  child: Text(
                    cities[position],
                    style: TextStyle(color: Colors.white),
                  ),
                );
              }),
        ));
  }
}