AspectRation、Card卡片组件

AspectRatio 的作用是调整子元素 child 的宽高比
widget 的高度是由宽 度和比率决定的
如果在满足所有限制条件过后无法找到一个可行的尺寸，AspectRatio 最终将会去优先 适应布局限制条件，而忽略所设置的比率。

AspectRatio

属性

import 'package:flutter/material.dart';

main() {
  runApp(MyApp());
}

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return AspectRatio(
      //宽高比
      aspectRatio: 3.0 / 1.0,
      child: Container(
        color: Colors.red,
      ),
    );
  }
}

//MaterialApp组件作为根组件使用
// Scaffold  有下面几个主要属性
// appBar-界面顶部导航栏 body-界面显示的主要内容Widget drawer-抽屉菜单控件

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('导航栏'),
        ),
        body: HomeContent(),
      ),
    );
  }
}

• Card组件

属性

import 'package:flutter/material.dart';

main() {
  runApp(MyApp());
}

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return ListView(
      children: <Widget>[
        Card(
          margin: EdgeInsets.all(10),
          child: Column(
            children: <Widget>[
              ListTile(
                title: Text('张三'),
                subtitle: Text('高级工程师'),
              ),
              ListTile(
                title: Text('电话：12345678'),
              ),
              ListTile(title: Text('详细地址')),
            ],
          ),
        ),
      ],
    );
  }
}

//MaterialApp组件作为根组件使用
// Scaffold  有下面几个主要属性
// appBar-界面顶部导航栏 body-界面显示的主要内容Widget drawer-抽屉菜单控件

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement buildå
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('导航栏'),
        ),
        body: HomeContent(),
      ),
    );
  }
}