flutter 如何正确调整文本?

iswrvxsc  于 2023-05-19  发布在  Flutter
关注(0)|答案(1)|浏览(83)

我在一个flutter Text小部件中使用textAlign: TextAlign.justify,它只在文本比屏幕宽的情况下工作。如果文本短于可用宽度,则将文本居中。
我想要的是正常的段落对齐(即。与字处理器相同),由此长的行被对齐而短的行被左对齐。
下面是我的代码:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: TestClass(),
      ),
    );
  }
}

class TestClass extends StatefulWidget {
  @override
  _TestClassState createState() => _TestClassState();
}

class _TestClassState extends State<TestClass> {
  double loginWidth = 40.0;

  @override
  Widget build(BuildContext context) {
    return Container(
        decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10),
            border: Border.all(),
        ),
        padding: EdgeInsets.all(10),
        child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
                const Text(
                    'If you have a long line of text then the text text is wider than the screen and it justifies correctly, just as you would expect. So far so good.',
                    textAlign: TextAlign.justify,
                ),
                const SizedBox(height: 20),
                const Text(
                    'This is wrong',
                    textAlign: TextAlign.justify,
                ),
            ],
        )
    );
  }
}

它看起来是这样的:

有什么建议,我可以使用什么对齐方式来处理短文本和长文本?

dm7nw8vv

dm7nw8vv1#

当文本长度大于容器宽度时,Justify属性将起作用,如果要两个文本都从开始使用crossAxisAlignment: CrossAxisAlignment.start

child: Column(
  mainAxisSize: MainAxisSize.min,
  crossAxisAlignment: CrossAxisAlignment.start,
)

相关问题