enter image description here
I'm having a layout issue with my Flutter application. I've created a MyCardWidget which contains a Card widget. Inside the card, I'm trying to center its contents using a Column with mainAxisAlignment: MainAxisAlignment.center and crossAxisAlignment: CrossAxisAlignment.center. However, when I place multiple MyCardWidget instances inside a horizontal ListView, the cards' are not centered as expected.

      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(child: CircularProgressIndicator());
        } else if (snapshot.hasError) {
          return Center(child: Text('Hata: ${snapshot.error.toString()}'));
        } else {
          return Container(
              width: MediaQuery.of(context).size.width,
              height: MediaQuery.of(context).size.height,
              decoration: const BoxDecoration(
                image: DecorationImage(
                  image: AssetImage('lib/assets/images/home.jpg'),
                  fit: BoxFit.cover,
                ),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text("Istanbul 20"),
                  SizedBox(
                    width: MediaQuery.of(context).size.width,
                    height: 150,
                    child:   Obx(() => ListView(
                      scrollDirection: Axis.horizontal,
                      children: cards
                          .map((card) => card)
                          .toList(),
                    )),
                  )

这是Card Widget

class _MyCardWidgetState extends State<MyCardWidget> {
  @override
  Widget build(BuildContext context) {
    return Card(

      color: Colors.transparent,
      elevation: 2,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,  // <-- Bu satırı ekledik
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Image.network(
              "https://openweathermap.org/img/wn/${widget.icon}@2x.png"),
          Text(widget.temp.value),
          // Diğer String verilerini kullanabilirsiniz
        ],
      ),
    );
  }

推荐答案

您用Center包装ListView个小部件,然后在ListView上添加 shrinkWrap: true.

child: Center(
  child: ListView(
    scrollDirection: Axis.horizontal,
    shrinkWrap: true, //not so optimal but work out
    children: [

Flutter相关问答推荐

Firebase Auth异常未被catch捕获

Box约束强制无限高:SizedBox. Expand()

如何在2024年使用Ffltter将用户数据保存在云FireStore中?

悬停时打开Flutter 下拉按钮

如何将assets资源 实体类型转换为文件类型?

为什么Spotify Auth API返回400,而";code_verier不正确?

Flutter :执行com.android.build.gradle.internal.tasks.MergeNativeLibsTask$MergeNativeLibsTaskWorkAction时出现故障

如何将WebViewWidget和WillPopScope结合起来

抖动问题:检测到0个或2个或更多具有相同值的[DropdownMenuItem]

从图标启动器打开时,VSCode未检测到Web设备

使用 forLoops 在 Dart 中进行单元测试会返回 stackoverflow

如何在 VS Code 中启用 Flutter 运行/调试工具栏?

如何设置行中项目之间的空格相等?

如何在 Flutter 中使用 drawLine() 和 drawCircle() 绘制等距离的 4 条线

如何按值对列表中的 map 进行排序

如何在 flutter 中制作这种类型的扩展瓦片

Banner Ad.test 广告单元 ID 是否已过时?

在 flutter 中使用 Firebase 实时数据库数据创建无限滚动效果

Flutter Web App 未启动:脚本的 MIME 类型不受支持

如何做到这一点,当我们在 textified 中输入 ab 然后将 applebanana 显示为一个单词?飘飘然