- 如果你对Flutter还有疑问或者技术方面的疑惑,欢迎加入Flutter交流群(微信:laomengit)。
- 同时也欢迎关注我的Flutter公众号【老孟程序员】,公众号首发Flutter的相关内容。
- Flutter地址:http://laomengit.com 里面包含160多个组件的详细用法。
Flutter中大部分多组件都有color
属性,可以方便的改变颜色,但如果想改变图片颜色就不是那么容易了,虽然Image组件也有color属性,但设置的color
属性会覆盖整个组件,这并不是我们想要的,而ColorFiltered组件可以帮我们解决这个问题。
假设我们有这么一种图片,图片只有一段文字,其他地方透明:
Container(
color: Colors.grey, child: Image.asset('images/content.png'));
效果如下:
由于字体是白色的,所以将背景设置为灰色,这时来了一个需求根据系统样式改变字体颜色,大部分人第一个想法就是让UI切处所有颜色的图片,虽然效果可以实现,但问题太大了,第一:样式比较多的话必然会有大量的图片,导致App的体积较大。第二:如果允许用户自定义主题颜色