Acabei de finalizar a aula e realizei o desafio. Esse foi o código que usei pra chegar no resultado apresentado no figma.
class AccountPoints extends StatelessWidget {
const AccountPoints({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const Padding(
padding: EdgeInsets.all(16.0),
child: _AccountPointsContent(),
);
}
}
class _AccountPointsContent extends StatelessWidget {
const _AccountPointsContent({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(bottom: 16.0),
child: Text(
'Pontos da conta',
style: Theme.of(context).textTheme.titleMedium,
),
),
BoxCard(
boxContent: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Padding(
padding: EdgeInsets.only(bottom: 8.0,),
child: Text('Pontos totais:',),
),
Text(
'3000',
style: Theme.of(context).textTheme.bodyLarge,
),
const Padding(
padding: EdgeInsets.only(top: 8.0, bottom: 8.0),
child: ContentDivision(),
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Text(
'Objetivos:',
style: Theme.of(context).textTheme.titleMedium,
),
),
Row(
children: [
Padding(
padding: const EdgeInsets.only(top: 8.0, right: 4.0, bottom: 8.0,),
child: ColorDot(
colorDot: ThemeColors.accountPoints['freeDelivery'],
),
),
const Text(
'Entrega grátis: 15000pts',
),
],
),
Row(
children: [
Padding(
padding: const EdgeInsets.only(top: 8.0, right: 4.0, bottom: 8.0,),
child: ColorDot(
colorDot: ThemeColors.accountPoints['oneMStreaming'],
),
),
const Text(
'1 mês de streaming: 300000pts',
),
],
),
],
),
),
],
);
}
}
E na classe Home, substituí o Column por um ListView para que não desse erro de overflow.
class Home extends StatelessWidget {
const Home({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
children: const <Widget> [
Header(),
RecentActivity(),
AccountActions(),
AccountPoints(),
],
),
);
}
}
O resultado foi esse. ![]( )