如何在Flutter中制作适合所有屏幕的列

雷米·梅纳德(RémyMenard)

UI

我开始颤抖,但是我不知道如何将2个列小部件除以使其适合所有屏幕,如图所示。

在Butzlab

你去

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(child: Container(color: Colors.blue)),
        Expanded(child: Container(color: Colors.lightBlueAccent))
      ],
    );
  }
}

怎么做的:

  1. 我正在通过runApp方法运行应用程序
  2. 我创建一列,并在其中放置带有颜色的容器
  3. 但是容器没有任何尺寸,因此看不到
  4. 使用扩展的小部件,我让小部件知道尽可能大。
  5. 因为我有两个展开的小部件,所以它们的大小相同。

模拟器设备的Voila
截图

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何制作适合所有屏幕和宽度的UI

如何在Godot中制作适合屏幕的图像

如何在所有iPhone屏幕中将图像视图适合屏幕

如何在flutter应用程序中制作和显示所有rgb颜色?

如何在 Flutter 屏幕中央對齊列表視圖中的所有小部件?

如何安排UI元素使其适合iOS中的所有屏幕尺寸

如何在flutter html中使html图像自动适合屏幕

如何使该网站适合所有屏幕尺寸?

如何让 AutoLayout 适合 iPhone 的所有尺寸屏幕

如何使涂漆的画布适合所有屏幕尺寸?

“如何修复'SKIN'适合所有尺寸的屏幕”

如何使相对布局适合所有屏幕尺寸?

如何在Flutter中制作具有浮雕效果的按钮

如何在 Row 中的图标下方制作文本并使 Row 从屏幕底部开始(Flutter)

如何在整个显示中适合gridview中的所有元素?

如何在Android中设置适合屏幕50%的图像

如何为所有屏幕尺寸制作灵活的UI?

如何制作Scrollview所有内容的屏幕截图?

如何快速为所有屏幕尺寸制作圆形按钮?

如何调整离子列表中所有离子项目的大小以适合 Ionic 3 中的整个屏幕?

使Android活动适合所有屏幕尺寸

布局不适合所有屏幕

如何在Flutter中制作AlertDialog?

如何在flutter中制作圆形的TextField?

如何在flutter中制作全屏alertDialog

如何在 Flutter 中制作装饰边框

如何在 Flutter 中制作这样的形状?

如何在Firestore Flutter中获取昨天的所有记录?

如何在flutter中完成所有以前的异步功能?