[Flutter 实战] 让Widget按比例(Ratio)设置

作者: 寅丁 | 来源:发表于2019-05-16 10:08 被阅读0次

在此记录项目中所遇到问题及解决方案

在Flutter中使用AspectRatio Widget按比例来设置一个Widget的高度和宽度，参数aspectRatio 是比率设置。

以下代码让Image Widget 根据屏幕的宽度来设置高度，比例 3:1

import 'package:flutter/material.dart';

class test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(15),
      child: AspectRatio(
        aspectRatio: 3,
        child: CachedNetworkImage(
          width: double.infinity,
          fit: BoxFit.fill,
          imageUrl: "http://via.placeholder.com/300x100",
          placeholder: (context, url) => Center(child:new CircularProgressIndicator() ,),
          errorWidget: (context, url, error) => new Icon(Icons.error),
        ),
      ),
    ),;
  }
}

更多说明请跳转至