How do I mix multiple gradients in Flutter?

Question

The designer has combined two or more gradients in the Figma Design they created. In some designs, they have combined a radial gradient with a linear gradient; while some other designs, they have combined a linear gradient with another linear gradient.

This is something that can easily be done with CSS, but, in Flutter, I haven't been able to implement it. I have read almost all documentation of Flutter but no solution seems to be in sight. Is there anyway I can combine two gradients without having the designer change the design?

Solution

Had to wrap container in a container to achieve this effect:

Container(
  decoration: BoxDecoration(
    gradient: gradientOne,
  ),
  child: Container(
    decoration: BoxDecoration(
      gradient: gradientTwo,
    ),
    child: content,
  ),
)

Works with semi-transparent gradients.

Comments

[KapilDev Neupane]

This still uses a single Gradient. The question asks how combine multiple Gradients.

[KapilDev Neupane]

This still uses a single Gradient. The question asks how combine multiple Gradients.