在 Flutter 中将容器放置在屏幕中间？

Question

我正在使用颤振。我制作了一个可重用的容器小部件，并在列小部件中使用了它。我想将容器居中放置在屏幕中间。 Container 当前显示在屏幕顶部。代码附在下面。如果有人帮忙，我很高兴。 ..

Widget mainOptionsWidget(
  BuildContext context,
  String title,
  IconData icon,
  String cardId,
) {
  return Container(
    constraints: BoxConstraints(
      minWidth: MediaQuery.of(context).size.width * 1,
      minHeight: MediaQuery.of(context).size.height * 0.20,
      maxHeight: MediaQuery.of(context).size.height * 1,
    ),
    decoration: const BoxDecoration(
      borderRadius: BorderRadius.only(
        bottomRight: Radius.circular(60),
        topLeft: Radius.circular(60),
      ),
    ),
    // margin: const EdgeInsets.only(left: 20, right: 20),
    child: SingleChildScrollView(
      child: Column(
        children: [
          Icon(
            icon,
            color: Colors.white,
            size: 60,
          ),
          const SizedBox(
            height: 20,
          ),
          Text(
            title,
            style: const TextStyle(
              fontSize: 24,
              color: Colors.white,
              fontWeight: FontWeight.bold,
            ),
          ),
        ],
      ),
    ),
  );
}

并使用

return Scaffold(
  body: SingleChildScrollView(
    child: Column(
      children: [
        mainOptionsWidget(
          context,
          "I WANT",
          Icons.cached_outlined,
          "1",
        )
      ],
    ),
  ),
);

Answer 1

在 body 上使用 Center 小部件。

body: Center(
  child: SingleChildScrollView(
    child: Column(
      children: [
        mainOptionsWidget(
          context,
          "I WANT",
          Icons.cached_outlined,
          "1",
        )
      ],
    ),
  ),
),

在 Flutter 中将容器放置在屏幕中间？

Position a Container in the middle of screen in Flutter?

flutter

flutter-layout

flutter-web