Flutter 设置具体尺寸

Flutter 设置具体尺寸(SizedBox)SizedBox组件是一个特定大小的盒子,这个组件强制它的child有特定的宽度和高度。如果宽度或高度为null,则此组件将调整自身大小以匹配该维度中child的大小。

SizedBox组件的主要属性如下所示:
Flutter 设置具体尺寸

接下来我们写个例子,添加一个SizedBox容器,在其中放一个Card,那么Card就被限定在宽200、高300的范围内。完整的示例代码如下:

import 'package:flutter/material.dart';

class LayoutDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('SizedBox设置具体尺寸示例'),
        ),
        body: SizedBox(
          //固定宽为200.0 高为300.0
          width: 200.0,
          height: 300.0,
          child: const Card(
              child: Text('SizedBox',
                style: TextStyle(
                  fontSize: 36.0,
                ),
              ),
          ),
        ),
      );
    }
  }
  void main() {
    runApp(
      MaterialApp(
        title: 'SizedBox设置具体尺寸示例',
        home: LayoutDemo(),
      ),
    );
  }

上述示例代码的视图展现大致如图所示:
Flutter 设置具体尺寸

酷客教程相关文章:

赞(0)

评论 抢沙发

评论前必须登录!