Flutter Column布局(垂直布局)

2020-05-24  本文已影响0人  前端新阳

垂直布局

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Link World!',
        home: Scaffold(
            appBar: new AppBar(title: new Text('垂直方向布局')),
            body: Center(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,   // 对齐方式: 居中对齐   默认为center(居中对齐)
                mainAxisAlignment: MainAxisAlignment.center,    // 主轴对齐方式  默认为start
                children: <Widget>[
                  Text('I am Link!'),
                  Expanded(
                    child: Text('今天天气不错!今天天气不错!今天天气不错!今天天气不错!'),
                  ),
                  Text('I Love Coding!')
                ],
              )
            )
        )
    );
  }
}

【效果】如下:


image.png
上一篇 下一篇

猜你喜欢

热点阅读