Question

我在GridView-builder索引的顶部设置图像，在底部设置多行文本。接下来，我希望图像高度大小将动态更改，而文本行将更改。假设，当底部文本行增加时，顶部图像的高度将在索引中减小。

 class category_route extends StatelessWidget {


 @override
 Widget build(BuildContext context) {



var sizeDevice = MediaQuery.of(context).size;
final orientation = MediaQuery.of(context).orientation;

final double itemHeight = (sizeDevice.height - kToolbarHeight - 24) / 3;
final double itemWidth = sizeDevice.width / 3;



return MaterialApp(
  home: Scaffold(

    backgroundColor: Colors.yellow,

    body: GridView.builder(
      padding: EdgeInsets.all(8),
      itemCount: categoryTitleArray.length,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: (orientation == Orientation.portrait) ? 3 : 4,
        crossAxisSpacing: 5,
        mainAxisSpacing: 5,
        childAspectRatio: (itemWidth / itemHeight),
      ),


      itemBuilder: (BuildContext context, int index) {
        return new Card(

        child: new GridTile(
          
            child:  Image.asset(categoryImageArray[index],
            ),
            footer: Text("${categoryTitleArray[index]}"),

          ),
        );
      },
    ),


  ),
);
}
}

Answer 1

代替使用GridTile，请使用此

return 
new Card(
  child: new Column(
    children: [
      Expanded(
        child: Image.network(
          categoryImageArray[index],
        ),
      ),
      Text("${categoryTitleArray[index]}")
    ],
  ),
);

我对此进行了测试，并且运行良好。希望我回答这个问题。

颤振：图像高度动态会根据文本高度的增加和减少而改变

1 个答案: