flutter 装饰类【BoxDecoration】
装饰类 BoxDecorationBoxDecoration 是 Flutter 中用于控制 Container 等组件外观的装饰类，它提供了丰富的属性来设置配景、边框、圆角、阴影等样式。
BoxDecoration 的主要属性
1.color
[*]配景颜色。
[*]类型：Color?
[*]示例：
color: Colors.blue,
2.image
[*]配景图片。
[*]类型：DecorationImage?
[*]示例：
image: DecorationImage(
image: AssetImage('assets/images/bg.png'),
fit: BoxFit.cover,
),
3.border
[*]边框样式。
[*]类型：BoxBorder?（如 Border 或 BorderDirectional）
[*]示例：
border: Border.all(
color: Colors.red,
width: 2.0,
),
4.borderRadius
[*]圆角设置，仅在边框是矩形时有用。
[*]类型：BorderRadius?
[*]示例：
borderRadius: BorderRadius.circular(10),
5.shape
[*]控制组件外形，支持矩形和圆形。
[*]类型：BoxShape
[*]默认值：BoxShape.rectangle
[*]示例：
shape: BoxShape.circle,
6.gradient
[*]配景渐变样式。
[*]类型：Gradient?（如 LinearGradient 或 RadialGradient）
[*]示例：
gradient: LinearGradient(
colors: ,
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
7.boxShadow
[*]阴影效果。
[*]类型：List?
[*]示例：
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.2),
offset: Offset(2, 4),
blurRadius: 6,
),
],
8.backgroundBlendMode
[*]配景混淆模式，用于控制 color 和 image 的混淆效果。
[*]类型：BlendMode?
[*]示例：
backgroundBlendMode: BlendMode.multiply,
9.clipBehavior
[*]定义如何裁剪子组件。
[*]类型：Clip，默认值为 Clip.none
[*]示例：
clipBehavior: Clip.hardEdge,
完备属性示例：
Container(width: 100,height: 100,decoration: BoxDecoration( color: Colors.blue,
// 配景颜色 border: Border.all( // 边框 color: Colors.red, width: 2.0, ), borderRadius: BorderRadius.circular(15), // 圆角 boxShadow: [ // 阴影 BoxShadow( color: Colors.black.withOpacity(0.2), offset: Offset(3, 3), blurRadius: 5, ), ], gradient: LinearGradient( // 渐变 colors: , begin: Alignment.topLeft, end: Alignment.bottomRight, ), image: DecorationImage( // 配景图片 image: AssetImage('assets/images/example.png'), fit: BoxFit.cover, ),),) 属性用途总结：
https://i-blog.csdnimg.cn/direct/51175da1d2604413ad8402258b3e6659.png
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]