1. 程式人生 > >Flutter基礎—定位對齊之大小比例

Flutter基礎—定位對齊之大小比例

SizedBox控制元件能強制子控制元件具有特定寬度、高度或兩者都有

import 'package:flutter/material.dart';
class LayoutDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('強制大小'),
      ),
      body: new SizedBox(
        width: 250.0
, height: 250.0, child: new Container( decoration: new BoxDecoration( backgroundColor: Colors.lightBlueAccent[100], ), ), ), ); } } void main() { runApp( new MaterialApp( title: 'Flutter教程', home: new LayoutDemo(), ), ); }

AspectRatio控制元件能強制子小部件的寬度和高度具有給定的寬高比,以寬度與高度的比例表示。

import 'package:flutter/material.dart';
class LayoutDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('強制比例'),
      ),
      body: new AspectRatio(
        aspectRatio: 3.0
/ 2.0, child: new Container( decoration: new BoxDecoration( backgroundColor: Colors.lightBlueAccent[100], ), ), ), ); } } void main() { runApp( new MaterialApp( title: 'Flutter教程', home: new LayoutDemo(), ), ); }