class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.black,
title: const Text(
"Flutter: Primeiros Passos",
style: TextStyle(color: Colors.yellowAccent),
),
),
body: Container(
color: Colors.yellow,
child: ListView(
children: const [
Padding(
padding: EdgeInsets.all(8.0),
child: Cardtest(Colors.pink, Colors.orange, Colors.cyan, 100,
Icons.mobile_friendly),
),
Cardtest(Colors.deepPurple, Colors.green, Colors.lime, 100,
Icons.access_time),
Cardtest(Colors.brown, Colors.teal, Colors.red, 100,
Icons.accessibility_new_rounded),
Cardtest(
Colors.purple,
Color.fromARGB(255, 183, 255, 248),
Color.fromARGB(255, 74, 12, 148),
100,
Icons.sports_soccer_sharp)
],
),
),
),
);
}
}
class Cardtest extends StatelessWidget {
final Color cor1;
final Color cor2;
final Color cor3;
final double largura;
final IconData icone;
const Cardtest(this.cor1, this.cor2, this.cor3, this.largura, this.icone,
{super.key});
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: SizedBox(
height: 140,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
height: 140,
width: largura,
decoration: BoxDecoration(
border: Border.all(color: Colors.black, width: 3),
borderRadius: BorderRadius.circular(20),
color: cor1,
),
),
Container(
height: 140,
width: largura,
decoration: BoxDecoration(
border: Border.all(color: Colors.black, width: 3),
borderRadius: BorderRadius.circular(20),
color: cor2,
),
child: Icon(icone),
),
Container(
height: 140,
width: largura,
decoration: BoxDecoration(
border: Border.all(color: Colors.black, width: 3),
borderRadius: BorderRadius.circular(20),
color: cor3,
),
),
],
),
),
);
}
}
Resultado: