I'm trying to develop a restaurant menu app and i need that when i click one of the text buttons bellow it filters the items according to which button i tap. when i built the "meal" object, i created an atribute called "idDiaSem", and i have 5 diferent id's that i need to display 5 diferent lists of itens based on the ID i choose. Here's the concept:
Expanded(
child: ListView.builder(
itemCount: dayOfWeekMeals.length,
itemBuilder: (ctx, index) {
return Card(
elevation: 0,
margin: (index == dayOfWeekMeals.length - 1)
? const EdgeInsets.only(bottom: 0, left: 20, right: 20)
: const EdgeInsets.only(left: 20, right: 20),
child: ClipRRect(
borderRadius: (index == 0)
? const BorderRadius.only(
topLeft: Radius.circular(50),
topRight: Radius.circular(50),
)
: (index == dayOfWeekMeals.length - 1)
? const BorderRadius.only(
bottomLeft: Radius.circular(50),
bottomRight: Radius.circular(50),
)
: BorderRadius.circular(0),
child: MealItem(dayOfWeekMeals[index]),
),
);
},
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
onTap: () {},
child: Text(
'Segunda \n____________',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 11,
color: Theme.of(context).colorScheme.primary,
fontWeight: FontWeight.bold),
),
),
GestureDetector(
onTap: () {},
child: const Text(
'Terça \n____________',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 11),
),
),
GestureDetector(
onTap: () {},
child: const Text(
'Quarta \n____________',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 11),
),
),
GestureDetector(
onTap: () {},
child: const Text(
'Quinta \n____________',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 11),
),
),
GestureDetector(
onTap: () {},
child: const Text(
'Sexta \n____________',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 11),
),
),
],
),
],
),
class Meal {
final String id;
final String descricao;
final List<String> ingredients;
final List<String> idDiaSem;
final String imageUrl;
const Meal({
required this.id,
required this.descricao,
required this.ingredients,
required this.idDiaSem,
required this.imageUrl,
});
}
Still i can`t figure out how to create the filter, can anyone help me please? i need the button to change the filter when it's pressed
