Flutter 基礎佈局Widgets之Align

Align的做用是爲了設置子child的對齊方式,通常做爲其餘控件的一個參數。app

構造函數

const Align({
    Key key,
    this.alignment = Alignment.center,
    this.widthFactor,
    this.heightFactor,
    Widget child
  })

相關屬性以下:less

  • alignment 設置對齊方向
  • widthFactor 若是非空,則將其寬度設置爲子元素的寬度乘以該因子,能夠大於或小於1.0,但必須是正數。
  • heightFactor 若是非空,則將其高度設置爲子元素的高度乘以該因子,能夠大於或小於1.0,但必須是正數。

代碼demo

import 'package:flutter/material.dart';

void main() => runApp(
  MaterialApp(
    title: '圖標按鈕組件示例',
    home: LayoutDemo(),
  ),
);

class LayoutDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('圖標按鈕組件示例'),
      ),
      body: Align(
        alignment: Alignment.centerLeft,
        widthFactor: 2.0,
        heightFactor: 2.0,
        //添加圖標按鈕
        child: IconButton(
          //圖標元素
          icon: Icon(Icons.volume_up,size: 48.0,),
          //按鈕提示
          tooltip: '按下操做',
          //按下事件響應
          onPressed:(){
            print('按下操做');
          },
        ),
      ),
    );
  }
}

 

相關文章
相關標籤/搜索