[ FlutterLog_flutter 右对齐">
当前位置:   article > 正文

flutter如何让行Row的两个子控件分别左对齐和右对齐?_flutter 右对齐

flutter 右对齐

实现行中两个控件分别左对齐和右对齐,方式有很多,示例代码如下:

方式一:使用spaceBetween对齐方式

  1. new Row(
  2. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  3. children: [
  4. new Text("left"),
  5. new Text("right")
  6. ]
  7. );

方式二:中间使用Expanded自动扩展

  1. Row(
  2. children: <Widget>[
  3. FlutterLogo(),//左对齐
  4. Expanded(child: SizedBox()),//自动扩展挤压
  5. FlutterLogo(),//右对齐
  6. ],
  7. );

方式三:使用Spacer自动填充

  1. Row(
  2. children: <Widget>[
  3. FlutterLogo(),
  4. Spacer(),
  5. FlutterLogo(),
  6. ],
  7. );

方式四:使用Flexible

  1. Row(
  2. children: <Widget>[
  3. FlutterLogo(),
  4. Flexible(fit: FlexFit.tight, child: SizedBox()),
  5. FlutterLogo(),
  6. ],
  7. );

效果如下

image.png

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/289780
推荐阅读
相关标签
  

闽ICP备14008679号