Раскрасить изображение для наложения

Question

Я хочу показать изображение из бутылки, наполненной жидкостями разных цветов. Цвета существуют как код RGB HEX. Итак, showBottle('#ff0000') должен показать бутылку, наполненную красной водой. Моя идея состоит в том, чтобы создать два изображения: бутылка (пустая) и другое с жидкостью белого цвета. Эти два изображения можно затем нанести поверх другого, поэтому я могу раскрасить только «жидкую часть».

Мои вопросы:

• Можно ли «раскрасить» изображение в Flutter? ?
• Каков наилучший способ наложения обоих изображений друг на друга?

РЕДАКТИРОВАТЬ: я пытался использовать виджет Stack и два виджета Image сcolorBlendMode, но прозрачность не работает. См. Изображение ниже:

Stack(children: <Widget>[
  Image.asset(
    'assets/images/background.png',
  ),
  Image.asset(
    'assets/images/overlay.png',
    colorBlendMode: BlendMode.color,
    color: Color.fromRGBO(255, 0, 0, 1.0),
  ),
])

Изменение BlendMode на srcIn приведет к учету прозрачности, но при этом всеинформация из изображения overlay.png.

Answer 1

использовать режим наложения изображения и цвет. вот пример,

Image.asset(
  'assets/image.jpg',
  height: 300,
  fit: BoxFit.fitHeight,
  color: _color, // Colors.red, Colors.yellow any color you want
  colorBlendMode: _blendMode, // BlendMode.color, BlendMode.darken, BlendMode.saturation, BlendMode.softLight
)

check Виджет изображения и его свойства