9 enero, 2019
Para obtener un degradado de dos colores usamos boxdecoration que tiene muchos parámetros para configurar un diseño apropiado.
Suscríbete a nuestro canal en Youtube
SuscríbirseUsar un degradado en una aplicación móvil depende del diseño que se ha establecido y la combinación de colores, Flutter tiene la particularidad de manejar diseño desde el código, es por ello que resulta simple crear un degradado con estilos.
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Container(
decoration: new BoxDecoration(
gradient: LinearGradient(
colors: [Colors.yellow,Colors.orange,Colors.red],
stops: [0.5,0.5,0.8],
begin: FractionalOffset.topCenter,
end: FractionalOffset.bottomCenter
)
),
child: Center(
child:RaisedButton(
child: Text("botón"),
onPressed: (){}
),
)
)
);
}
}
Como vemos debemos declarar un caja de decoración BoxDecoration, la cual contiene el atributo gradiente, este atributo nos permite configurar el degradado
Los atributos permiten valores array es por ello que en colors: podemos agregar mas de dos colores, e igualmente en stops: nos permite obtener algunos efectos visuales cambiando los valores decimales.
Espero sea de ayuda, hasta un próximo video.
Leido 15743 veces
© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023