Создать градиент на кнопке в Flutter

В этой статье мы расскажем вам, как сделать градиентный рисунок на кнопках в Flutter.

В Android мы обычно используем SVG или PNG для градиента или любого другого пользовательского фона и других представлений. Но в Flutter SVG не поддерживаются должным образом. Итак, решение этой проблемы заключается в том, что мы должны создать градиент по-своему. Я делюсь здесь своим опытом, как создать градиент на кнопке.

В Flutter их поддерживает виджет, который помогает легко создавать градиент на кнопке. Вот код:

Container( height: 50.0, child: RaisedButton(   onPressed: () {},   shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(80.0)),   padding: EdgeInsets.all(0.0),   child: Ink(     decoration: BoxDecoration(         gradient: LinearGradient(colors: [Color(0xff374ABE), Color(0xff64B6FF)],           begin: Alignment.centerLeft,           end: Alignment.centerRight,         ),         borderRadius: BorderRadius.circular(30.0)     ),     child: Container(       constraints: BoxConstraints(maxWidth: 300.0, minHeight: 50.0),       alignment: Alignment.center,       child: Text(         "Login",         textAlign: TextAlign.center,         style: TextStyle(             color: Colors.white         ),       ),     ),   ), ),),

Итак, есть виджет Ink, который помогает создавать градиентные или другие виды украшений на кнопках или любом виджете.

Это все :)