我有以下代码片段,我想使图像褪色 ,以免干扰容器中的其他物品。有没有一个 过滤器可以做到这一点?
child: new Card( child: new Container( decoration: new BoxDecoration( color: const Color(0xff7c94b6), image: new DecorationImage( image: new ExactAssetImage('lib/images/pic1.jpg'), ) ) ) )
你可以给你DecorationImage一个ColorFilter使背景图像灰度(用saturation彩色滤光片)或半透明(使用 dstATop彩色滤光片)。
DecorationImage
ColorFilter
saturation
屏幕截图
此示例的代码如下。
import 'package:flutter/material.dart'; void main() { runApp(new MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( home: new HomePage(), ); } } class HomePage extends StatelessWidget { @override Widget build(BuildContext context) => new Scaffold( appBar: new AppBar( title: new Text('Grey Example'), ), body: new Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ new Card( child: new Container( child: new Text( 'Hello world', style: Theme.of(context).textTheme.display4 ), decoration: new BoxDecoration( color: const Color(0xff7c94b6), image: new DecorationImage( fit: BoxFit.cover, colorFilter: new ColorFilter.mode(Colors.black.withOpacity(0.2), BlendMode.dstATop), image: new NetworkImage( 'http://www.allwhitebackground.com/images/2/2582-190x190.jpg', ), ), ), ), ), ], ), ); }
该Opacity插件是另一种选择。
Opacity
您也可以将效果预先应用到资产。