Flutter Web和移动设备的带颤振的卡片高度/宽度

我正在尝试使用多张卡片来显示一些结果

我的代码非常适合使用Flutter的web，但不适用于移动设备

@override
  Widget build(BuildContext context) {
    final bool displayMobileLayout = MediaQuery.of(context).size.width < 600;
      return Row(

      children: [
        if (!displayMobileLayout)
          const AppDrawer(permanentlyDisplay: true,),
        Expanded(
          child: Scaffold(
            backgroundColor: Colors.white,
            appBar: AppBar(
              automaticallyImplyLeading: displayMobileLayout,
              backgroundColor: CustomColors.primary,
              elevation: 0,
              centerTitle: true,
              title: Text(
                "My Sessions",
                textAlign: TextAlign.center,
                style: GoogleFonts.nunito(
                  fontSize: 22,
                  fontWeight: FontWeight.w700,
                  color: Theme.of(context).accentColor
                ),
              ),
            ),
            drawer: displayMobileLayout ? const AppDrawer(permanentlyDisplay: false,) : null,
            body: BlocProvider(
              create: (ctxt) => SessionBloc(repository: repository),
              child: displayListSessions(context),
            ),
          ),
        ),
      ],
    );
  }

  Widget displayListSessions(BuildContext context) {
    return BlocBuilder<SessionBloc, SessionState>(
      builder: (context, state) {
        if (state is SessionEmpty) {
          BlocProvider.of<SessionBloc>(context).add(FetchSession());
        }
        if (state is SessionError) {
          return Center(
            child: Text('failed to fetch session'),
          );
        }
        if (state is SessionLoaded) {
          List<Card> tiles = [];
          state.sessions.forEach((element) {
            final startDate = dateTimeHelper(element.startDate);
            tiles.add(
              Card(
                elevation: 10,
                color: Colors.grey[200],
                margin: EdgeInsets.all(12.0),
                child: InkWell(
                  onTap: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                        builder: (context) => SessionScreen(),
                        settings: RouteSettings(
                          arguments: element,
                        ),
                      ),
                    );
                  },
                  child: Container(
                    height: kIsWeb ? 100 : 150,
                    child: Padding(
                      padding: EdgeInsets.all(16.0),
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Image.network("https://fakeimg.pl/370x150", fit: BoxFit.contain,),
                          Padding(padding: EdgeInsets.all(12.0),),
                          Center(
                              child: Text(
                                "Pod in ${element.pod.city}",
                                style: TextStyle(
                                  color: CustomColors.primary,
                                  fontStyle: FontStyle.italic,
                                  fontWeight: FontWeight.bold
                                ),
                              ),
                          ),
                          Padding(padding: EdgeInsets.only(bottom: 20.0),),
                          Text("Session was on $startDate"),
                        ],
                      ),
                    ),
                  ),
                ),
              ),
            );
          });
          return GridView(
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: kIsWeb ? 5 : 1,
              crossAxisSpacing: 5.0,
              mainAxisSpacing: 5.0,
            ),
            children: tiles,
          );
        }
        return Center(
          child: CircularProgressIndicator(),
        );
      },
    );
  }

@覆盖
小部件构建（构建上下文）{
final bool displayMobileLayout=MediaQuery.of（context）.size.width<600；
返回行(
儿童：[
如果（！displayMobileLayout）
const AppDrawer（永久显示：true，），
扩大(
孩子：脚手架(
背景颜色：Colors.white，
appBar:appBar(
自动加载：显示MobileLayout，
背景颜色：CustomColors.primary，
海拔：0，
标题：对，
标题：正文(
“我的会话”，
textAlign:textAlign.center，
风格：GoogleFonts.nunito(
尺寸：22，
fontWeight:fontWeight.w700，
颜色：主题。背景。强调颜色
),
),
),
抽屉：displayMobileLayout？const AppDrawer（永久显示：false，）：null，
正文：BlocProvider(
create：（ctxt）=>SessionBloc（存储库：repository），
子：displayListSessions（上下文），
),
),
),
],
);
}
小部件displayListSessions（构建上下文上下文）{
返回BlocBuilder(
生成器：（上下文、状态）{
if（状态为SessionEmpty）{
BlocProvider.of（context.add）（FetchSession（））；
}
如果（状态为SessionError）{
返回中心(
子项：文本（'获取会话失败'），
);
}
if（状态为sessionload）{
列表分幅=[]；
state.sessions.forEach（（元素）{
final startDate=dateTimeHelper（element.startDate）；
tiles.add(
卡片(
标高：10，
颜色：颜色。灰色[200]，
边距：所有边缘集（12.0），
孩子：InkWell(
onTap:（）{
导航器。推(
上下文
材料路线(
生成器：（上下文）=>SessionScreen（），
设置：路由设置(
参数：元素，
),
),
);
},
子：容器(
高度：kIsWeb？100:150，
孩子：填充(
填充：所有边缘设置（16.0），
子：列(
mainAxisSize:mainAxisSize.min，
crossAxisAlignment:crossAxisAlignment.start，
儿童：[
Image.network（“https://fakeimg.pl/370x150，fit:BoxFit.contain，），
填充（填充：EdgeInsets.all（12.0），），
居中(
子：文本(
“Pod位于${element.Pod.city}”，
样式：TextStyle(
颜色：CustomColors.primary，
fontStyle:fontStyle.italic，
fontWeight:fontWeight.bold
),
),
),
填充（填充：仅限边集（底部：20.0）），
文本（“会话在$startDate上”），
],
),
),
),
),
),
);
});
返回网格视图(
gridDelegate:SliverGridDelegateWithFixedCrossAxisCount(
交叉轴计数：kIsWeb？5:1，
交叉轴间距：5.0，
主轴间距：5.0，
),
儿童：瓷砖，
);
}
返回中心(
子对象：CircularProgressIndicator（），
);
},
);
}

正如你在下面看到的，我只是想改变卡片的高度

我尝试了一切，用Align，用Container，甚至用SizedBox，但是我不能改变我的卡片的宽度和高度

---

有什么线索吗？

这是因为您的网格视图。。。。 在网格视图中更改

childAspectRatio

。。。默认情况下，这是1。。。这意味着你的卡是乡绅。。。

---

例如，将其更改为

childAspectRatio=5/3

。使用参数可获得正确的数字。

这是因为您的网格视图。。。。 在网格视图中更改

childAspectRatio

。。。默认情况下，这是1。。。这意味着你的卡是乡绅。。。

---

例如，将此更改为

childAspectRatio=5/3

。使用参数可获得正确的数字。

到底是什么问题？什么是不期望的？移动的宽度应该只有100吗？我不能随心所欲地操纵高度。不管我做什么，高度总是一样的。到底是什么问题？什么是不期望的？移动的宽度应该只有100吗？我不能随心所欲地操纵高度。无论我做什么，高度总是一样的。