flutter - 如何将文字摆放整齐？-6ren

flutter - 如何将文字摆放整齐？

转载作者：行者123 更新时间：2023-12-03 03:30:31

我是新来的 flutter 。我想在按钮上方设置文本/标签。我在flutter中找不到任何简单的文本或标签小部件。
文本应该很大(图片)并且在屏幕右侧，我想保持按钮的位置。如何用Flutter实现这一目标？
谢谢您的帮助。

 @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Padding(
          padding: const EdgeInsets.only(top: 375.0),
          child: Column(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("1"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("2"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("3"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("+"),
                    ),
                  ),
                ],
              ),
              SizedBox(
                height: 20,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("4"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("5"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("6"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("-"),
                    ),
                  ),
                ],
              ),
              SizedBox(
                height: 20,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("7"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("8"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("9"),
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("*"),
                    ),
                  ),
                ],
              ),
              SizedBox(
                height: 20,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  SizedBox(
                    height: 80,
                    width: 290,
                    child: FloatingActionButton.extended(
                      elevation: 0.2,
                      onPressed: () {},
                      label: Text("="),
                      isExtended: true,
                    ),
                  ),
                  SizedBox(
                    height: 100,
                    width: 90,
                    child: FloatingActionButton(
                      elevation: 0.2,
                      onPressed: () {},
                      child: Text("/"),
                    ),
                  )
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

最佳答案

使用扩展:

Expanded(
          child: Align(
            alignment: Alignment.centerRight,
            child: Text(
              "My Text",
              textAlign: TextAlign.right,
              style: TextStyle(fontSize: 68),
            ),
          ),
        ),

完整代码:

      @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Column(
          children: <Widget>[
            SizedBox(height: 24,),
            Expanded(
              child: Align(
                alignment: Alignment.centerRight,
                child: Text(
                  "My Text",
                  textAlign: TextAlign.right,
                  style: TextStyle(fontSize: 68),
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("1"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("2"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("3"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("+"),
                  ),
                ),
              ],
            ),
            SizedBox(
              height: 20,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("4"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("5"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("6"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("-"),
                  ),
                ),
              ],
            ),
            SizedBox(
              height: 20,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("7"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("8"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("9"),
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("*"),
                  ),
                ),
              ],
            ),
            SizedBox(
              height: 20,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                SizedBox(
                  height: 80,
                  width: 290,
                  child: FloatingActionButton.extended(
                    elevation: 0.2,
                    onPressed: () {},
                    label: Text("="),
                    isExtended: true,
                  ),
                ),
                SizedBox(
                  height: 100,
                  width: 90,
                  child: FloatingActionButton(
                    elevation: 0.2,
                    onPressed: () {},
                    child: Text("/"),
                  ),
                )
              ],
            ),
          ],
        ),
      ),
    );
  }

关于flutter - 如何将文字摆放整齐？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/64101295/

文章推荐： maven - 从Gradle改造Mule项目

文章推荐： c - 所有 POSIX/SUS 信号都是 #define 是给定的还是假设的？

文章推荐： c - 如何创建一个新线程以使 pcap_loop() 和 gtk_main() 兼容？

文章推荐： json - '_InternalLinkedHashMap'类型不是 'String'类型的子类型

typescript - 确定类型是 'string' 文字、 'number' 文字还是 'string | number' 文字
由于 typescript 现在支持条件类型，我决定进行一些元编程，为 VSCODE intellisense 添加更多 flavor 。但是，虽然使用 A extends B 可以轻松分离其他类型，
PHP:文字\n而不是新行
我有一个 php var，它在回显时将 JS 函数写入页面的源代码。该函数循环遍历 CSV，因此其中包含以下行: $str="var lines = data.split('\n');"; 目前，当回
JavaScript 文字，键的指针值
我有以下代码: name= "a"; value="b" $.post("ajax.php", {name:value}).... 然而 ajax.php 将收到 name=b 而不是 a=b。我如
javascript - 如何获取符号名称(文字)？
以下情况: var myVehicle = { brand: 'Tesla' }; var isMoving = Symbol(); var currentStatus = Symbol(); myV
JavaScript "\8"文字
我正在为 Python 翻译器编写 JavaScript，“\8”和“\9”给我带来了很多问题。根据文档，像“\8”或“\9”这样的东西是非法的，因为它们不是有效的八进制转义符。 Esprima pa
Android背景隐藏 subview 文字
我有一个简单的 LinearLayout。当我将 android:background 添加到 LinearLayout 时，TextView 不再可见。我不明白什么？
html - 如何在图像悬停时创建深色淡入淡出+文字？
在尝试获得某种效果时遇到困难: 我有一张图片。我想将鼠标悬停在它上面。它应该变黑并弹出一些文本。例子^ 执行此操作最简单/最简单的设置是什么？最好只有 HTML 和 CSS 注意:该元素需要在 CS
C 文字，这些存储在哪里
考虑以下代码: #include void f(const char * str) { str = "java"; } void main (int argc, char * argv[])
MySQL unicode 文字
我想在 MySQL 中插入一条具有非 ASCII Unicode 字符的记录，但我在一个不允许我轻松键入非 ASCII 字符的终端上。如何在 MySQL 的 SQL 语法中转义 Unicode 文字？
[Perl]文字/代码批量替换工具
Perl脚本batchReplace.pl可以用来批量替换文件中的文字/代码。可在指定目录中查找指定类型的文件，并递归检查子目录；在输出文件时复制输入文件的目录结构。 [附件]Win32应用程序b
dart - 在flutter中分享图片+文字+网址的便捷方式
我知道从 flutter 应用程序共享的官方包。 https://pub.dartlang.org/packages/share 共享文本和 url 很容易，但我想共享来自服务器的图像意味着它是 UR
qt - 如何定义 qreal 文字
在 Qt 文档中，它说 qreal是一个 Typedef for double unless Qt is configured with the -qreal float option. 这基本上意味
类型中的 Idris Nat 文字
我想让 idris 证明 testMult : mult 3 3 = 9有人居住。不幸的是，这是键入为 mult (fromInteger 3) (fromInteger 3) = fromInte
objective-c - 我自己的@{} 文字
如您所知，Apple 为 NSNumber、NSDictionary、NSArray 等类提供了 @literals，因此我们可以通过这种方式创建对象，例如 NSArray *array = @[ob
F# - 公共(public)文字
有没有办法在类型上定义公共(public)文字(C# 中的公共(public) const)？显然 let 类型中的绑定(bind)必须是私有(private)的，并且 Literal 属性不能应用于
ANTLR4 语法不识别 bool 文字
为什么下面的语法不能识别 bool 值？我已经将其与 Java 和 GraphQL 的语法进行了比较，但不明白为什么它不起作用。给定以下语法，解析如下: foo = null // foo = v
S 表达式的列表，(文字)数据的向量？
当我需要一个文字来测试一个带有序列的函数时，我注意到我自己的习惯比列表更频繁地使用向量。 IE。 : (map inc [1 2 3]) 但不是: (map inc (list 1 2 3)) 虽然它
sqlite - 文字(原始)值作为sqlite中的外键
是否可以在sqlite中制作类似的东西？ FOREIGN KEY(TypeCode, 'ARawValue', IdServeur) REFERENCES OTHERTABLE(TypeCode, T
assembly - 文字 VS 立即操作数
在我这学期的系统软件类(class)中，我们正在学习汇编程序和其他系统软件。在阅读整个类(class)时，我遇到了LITERALS主题。对文字和立即操作数进行了比较，发现它们之间的唯一区别是文字不被
opencv - Gstreamer RTP传输视频+文字
我正在使用命令行语法编写一个 gstreamer 管道来发送视频流，并想用它发送数据。我认为可行的一种解决方案是将数据作为字幕文件发送。我可以使用以下管道通过 rtp 多路复用视频和字幕文件: gs

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

flutter - 如何将文字摆放整齐？