首页 > 解决方案 > 填充:EdgeInserts | 不移动小部件?

问题描述

我试图将文本定位到更靠近左边缘,而不是中心。

在使用颤振进行研究后,似乎正确的方法是使用const EdgeInserts

但是,当使用 const edge inserts 时,我页面上的文本只会改变很小的位置,这几乎不会引起注意。我对下面的代码做错了吗?

Column(
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.only(left: 10, bottom: 50),
                child: Text(
                  'Some Text',
                  style: TextStyle(
                    fontSize: 24,
                    fontFamily: 'Avenir',
                    fontWeight: FontWeight.w900,

这是正在发生的事情的示例,与我想要的相比

在此处输入图像描述

编辑答案:

class Onboarding1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Column(
        children: [
          Image.asset(
            "assets/Onboarding1_Photo.png",
            height: MediaQuery.of(context).size.height * 0.7,
            width: MediaQuery.of(context).size.width,
            fit: BoxFit.cover,
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: const EdgeInsets.only(left: 10, bottom: 50),
                child: Text(
                  'Some Text',
                  style: TextStyle(
                    fontSize: 24,
                    fontFamily: 'Avenir',
                    fontWeight: FontWeight.w900,

标签: flutter

解决方案


要拉伸视图,您可以添加Column

crossAxisAlignment: CrossAxisAlignment.stretch,

具有不同填充和对齐方式的两个文本的完整示例:

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            Container(
              color: Colors.blue,
              height: 300,
            ),
            Padding(
              padding: const EdgeInsets.only(
                left: 10,
                top: 30,
              ),
              child: Text(
                'Some Text',
                textAlign: TextAlign.left,
                style: TextStyle(
                  fontSize: 24,
                  fontFamily: 'Avenir',
                  fontWeight: FontWeight.w900,
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(
                right: 50,
                top: 30,
              ),
              child: Text(
                'Some Text',
                textAlign: TextAlign.right,
                style: TextStyle(
                  fontSize: 24,
                  fontFamily: 'Avenir',
                  fontWeight: FontWeight.w900,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

结果: 在此处输入图像描述


推荐阅读