how to get dynamically the id from list - flutter

Question

I have a cardView list DUMMY_CATEGORIES on my homepage called from a category model with an id. I want to pass the id in my homepage and then open a new page performing a onPressed method.

How can I do that?

This is my Homepage

class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
 return new Scaffold(
  appBar: AppBar(
    backgroundColor: Colors.deepOrange,
    title: Text('Pocket Chef'),
    centerTitle: true,
  ),
  body: GridView(
    padding: const EdgeInsets.all(20),
    children: DUMMY_CATEGORIES.map((categoryItem) => CategoryItems(
      categoryItem.name,categoryItem.icon)).toList(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2,
          mainAxisSpacing: 20,crossAxisSpacing: 20
      ),
    ),
);

And this is my DUMMY_CATEGORIES

const DUMMY_CATEGORIES = const [
Category(
  name: "Category 1", id: "1", icon: Icons.food_bank),
Category(
  name: "Category 2", id: "2", icon: Icons.food_bank ),

Babul · Accepted Answer · 2022-06-05T08:37:35.613

1

You may use Gridview.builder insist of GridView. Gridview.builder has some special fetaure than Gridview. Builder takes dynamic content. You can put action on gridview item easily. My solution is given below...

  return GridView.builder(
        shrinkWrap: true,
        physics: NeverScrollableScrollPhysics(),
        gridDelegate:
            SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
        itemCount: DUMMY_CATEGORIES
            .map((categoryItem) =>
                CategoryItems(categoryItem.name, categoryItem.icon))
            .toList()
            .length,
        itemBuilder: (_, index) {
          return InkWell(
            onTap: () {
              Navigator.of(context).push(
                  MaterialPageRoute(builder: (context) => NewScreen(CategoryItems(categoryItem.name, categoryItem.icon))
                      .toList()[index].id.toString())));
            },
            child: Container(
              height: 100,
              child: Text(
                'click on here',
              ),
            ),
          );
        });

Recieve the id from second page like this.. import 'package:flutter/material.dart';

class NewScreen extends StatefulWidget {
  String something;

  NewScreen(this.something);

  @override
  State<StatefulWidget> createState() {
    return NewScreenState(this.something);
  }
}

class NewScreenState extends State<NewScreen> {
  String something;

  NewScreenState(this.something);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        //now you have passing variable
        title: Text(something),
      ),
      body: Container(
        child: Text(widget.something.toString()),
      ),);
  }
}

edited Jun 05 '22 at 08:37

answered Jun 05 '22 at 07:11

Babul

1,076
7
9

hey, thanks a lot. I think it is what i was looking for, but i have a questions. - i don't have to pass anything on new screen, so can we delete the string "CategoryItems(categoryItem.name, categoryItem.icon)).toList()", ? also because i get error : The return type String isn't a widget. – Giovanni Jun 05 '22 at 08:07
1

yes u can delete from MaterialPageRoute call like this Navigator.of(context).push( MaterialPageRoute(builder: (context) => NewScreen( ))); and remove constructor and parameter from new screen as well. remove below variable and constructor. String something; NewScreen(this.something); – Babul Jun 05 '22 at 08:34
Nice! it works. But then all the card(category) will open the same page. In Java android, we have a if statement, so i can open a different page for each card. For example, if id = 1 open page 1, if id = 2 open page 2... etc.. how can i do the same in flutter? – Giovanni Jun 06 '22 at 05:39
1

u can set if else or switch condition in ontap method. suppose as like as onTap: () { if(index ==0){ Navigator.of(context).push( MaterialPageRoute(builder: (context) => NewScreenZero())); }else if(index ==1){ Navigator.of(context).push( MaterialPageRoute(builder: (context) => NewScreenOne())); } else if(index ==2){ Navigator.of(context).push( MaterialPageRoute(builder: (context) => NewScreenTwo())); } ...........etc }, – Babul Jun 06 '22 at 06:02
Thanks a lot. But gridview builder does not show the category model items. After the if statement, i have to implement a child to create the view. If i create child: Column (widjet[icon, text]), i don't know how to pass the category model. im not able to call them, i got an error. i added the Dummy categories to the ```itemCount``` property, but im still not able to receive the icons and titles from ```category model```. why it is that? – Giovanni Jun 06 '22 at 10:08

how to get dynamically the id from list - flutter

1 Answers1