时间戳

首页 > 解决方案 > 为什么即使它是孩子也不应该扩展卡片

flutter - 为什么即使它是孩子也不应该扩展卡片

问题描述

刚接触颤振和飞镖，我很难理解基本布局......

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final List<Widget> widgets = const [Text(""),Text(""),Text(""),Text(""),];
  
  
  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.all(10),
      color: Colors.redAccent,
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: widgets,
      ),);
  }
}

这是 DartPad(Flutter) 中的一个工作示例。为什么红色的东西会完全展开以适应屏幕？我希望它有 Columns MainAxisSize.min。

我想要一个布局，它采用整行（有边距），但只有其子项的请求高度。

附带说明：当我尝试以“卡片风格”制作东西而不是自己制作所有东西时，有人建议我使用卡片小部件。问题是，卡片可能会增加像我不需要的文本这样的开销。我为什么要因为这个原因选择那个？

谢谢

编辑：找到解决方案

@override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Expanded(
          child: Card(
            margin: const EdgeInsets.all(10),
            color: backgroundColor,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: widgets,
            ),
          ),
        ),
      ],
    );
  }

标签： flutterdartflutter-layout

解决方案

像这样工作：

@override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Expanded(
          child: Card(
            margin: const EdgeInsets.all(10),
            color: backgroundColor,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: widgets,
            ),
          ),
        ),
      ],
    );
  }

推荐阅读