当前位置:网站首页>Flutter FittedBox组件
Flutter FittedBox组件
2022-06-25 03:44:00 【xiangxiongfly915】
Flutter FittedBox组件
简述
当子组件的宽高比和父组件的宽高比不一样时,可以FittedBox组件操作子组件拉伸或填充父组件的空间。
基本属性
fit:子元素的填充方式。
- fill:填充父组件。
- contain:等比拉伸。
- cover:等比拉伸充满父组件,尽可能小。
- fitWidth:等比拉伸,宽度充满父组件。
- fitHeight:等比拉伸,高度充满父组件。
- none:默认子组件居中,不做处理。
- scaleDown:缩放至contain,否则和none一样。
使用
const Text("原图"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const Image(image: AssetImage("images/bird.jpg")),
),
const Text("BoxFit.fill"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.fill,
child: Image(image: AssetImage("images/bird.jpg")),
),
),
const SizedBox(height: 20),
const Text("BoxFit.contain"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.contain,
child: Image(image: AssetImage("images/bird.jpg")),
),
),
const SizedBox(height: 20),
const Text("BoxFit.cover"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.cover,
child: Image(image: AssetImage("images/bird.jpg")),
),
),
const SizedBox(height: 20),
const Text("BoxFit.fitWidth"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.fitWidth,
child: Image(image: AssetImage("images/bird.jpg")),
),
),
const SizedBox(height: 20),
const Text("BoxFit.fitHeight"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.fitHeight,
child: Image(image: AssetImage("images/bird.jpg")),
),
),
const SizedBox(height: 20),
// const Text("BoxFit.none"),
// Container(
// width: 100,
// height: 100,
// color: Colors.red,
// child: const FittedBox(
// fit: BoxFit.none,
// child: Image(image: AssetImage("images/bird.jpg")),
// ),
// ),
const SizedBox(height: 20),
const Text("BoxFit.scaleDown"),
Container(
width: 100,
height: 100,
color: Colors.red,
child: const FittedBox(
fit: BoxFit.scaleDown,
child: Image(image: AssetImage("images/bird.jpg")),
),
)
边栏推荐
- Development of trading system (III) - risk control system
- Interview with Mo Tianlun | ivorysql wangzhibin - ivorysql, an Oracle compatible open source database based on PostgreSQL
- MySQL modifies and deletes tables in batches according to the table prefix
- AI quantitative transaction (II) -- tushare financial data framework
- BSC parsing input data of transaction
- 《Missing Parts》NFT 作品集第 5 系列上线 The Sandbox 市场平台
- Amazon's other side in China
- Development of trading system (VI) -- HFT high frequency trading
- 可能是拿反了的原因
- 9 necessary soft skills for program ape career development
猜你喜欢
程序猿职业发展9项必备软技能
Perfect shuffle problem
Now, the ear is going into the metauniverse
Lao Ye's blessing
JSP cannot be resolved to a type error reporting solution
Lu Qi invests in quantum computing for the first time
The 5th series of NFT works of missing parts was launched on the sandbox market platform
威马招股书拆解:电动竞争已结束,智能排位赛刚开始
How to quickly deliver high-value software
Mstp+vrrp+ospf implements a three-tier architecture
随机推荐
Development of trading system (x) -- fix agreement
Comprehensive assignment of thesis writing instruction of Dongcai
Work assessment of Biopharmaceutics of Jilin University in March of the 22nd spring -00005
Development of trading system (II) -- market data
Sleep more, you can lose weight. According to the latest research from the University of Chicago, sleeping more than 1 hour a day is equivalent to eating less than one fried chicken leg
Development of trading system (XI) -- Introduction to quickfix
[harmony OS] [arkui] ETS development graphics and animation drawing
教你如何在winpe里安装win11系统
严重的PHP缺陷可导致QNAP NAS 设备遭RCE攻击
《悉达多》:一生之书,可以时常反刍
The art of writing simple code
opencv怎么安装?opencv下载安装教程
ZABBIX installation pit avoidance Guide
Xidian AI ranked higher than Qingbei in terms of AI majors, and Nantah ranked the first in China in 2022 in terms of soft science majors
微信小程序中的列表渲染
Internet Explorer died, and netizens started to build a true tombstone
Jilin University 22 spring March "technical economics" assignment assessment-00073
Musk was sued for $258billion in MLM claims. TSMC announced the 2nm process. The Chinese Academy of Sciences found that the lunar soil contained water in the form of hydroxyl. Today, more big news is
学习码 滚动码 固定码 有什么区别重码数,编码容量滚动码的原理
Disassembly of Weima prospectus: the electric competition has ended and the intelligent qualifying has just begun