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 ),

Answer 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()),
      ),);
  }
}