Segue imagem do projeto: https://photos.app.goo.gl/YWSMCWcb65VtXtDT7
E projeto no repositório GitHub: https://github.com/ItsonStos/to_do_list
- Primeiro criei uma classe que alterasse a cor do container dependendo do nivel e da dificuldade da tarefa
import 'package:flutter/material.dart';
class ColorContainner extends StatelessWidget {
final int level;
final int difficulty;
const ColorContainner(this.level, this.difficulty, {super.key});
Color typeColor (int level, int difficulty){
if ((level/difficulty) < 10){
return Colors.blue;
} else if ((level/difficulty) <20){
return Colors.green;
} else if ((level/difficulty) <30){
return Colors.amber;
} else if ((level/difficulty) <40){
return Colors.brown;
} else if ((level/difficulty) <=50){
return Colors.red;
} else {
return Colors.black;
}
}
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10.5),
color: typeColor(level, difficulty),
),
height: 140,
);
}
}
- Importei para o meu arquivo Task a classe ContainnerColor como primeiro filho da minha arvore de widget da minha Stack.
import 'package:flutter/material.dart';
import 'package:to_do_list/components/container.dart';
import 'package:to_do_list/components/difficulty.dart';
class Task extends StatefulWidget {
final String name;
final String photo;
final int difficulty;
const Task(this.name, this.photo, this.difficulty, {super.key});
@override
State<Task> createState() => _TaskState();
}
class _TaskState extends State<Task> {
int nivel = 0;
void levelUp() {
setState(() {
nivel++;
});
}
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Stack(
children: [
ColorContainner(nivel, widget.difficulty),
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
height: 100,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(2),
color: Colors.white,
),
.
.
.
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Text(
(nivel/widget.difficulty) <= 50 ?
'Nivel: $nivel' :
'Nivel Mestre',
style: const TextStyle(
color: Colors.white,
fontSize: 16,