Home > Blockchain >  Indexing GridView in flutter
Indexing GridView in flutter

Time:03-15

i'm new to flutter and i'm using GridViews for the first time. Is there a way I can use indexes on this GridView so each element can take to a separate page? as the code shows, all of the items take to the same page since I added the InkWell. (items are defined above the following code)

here is my code:

Widget build(BuildContext context) {
    List<Items> myList = [item1, item2, item3, item4, item5, item6];
    return Flexible(
      child: GridView.count(
          childAspectRatio: 1.0,
          padding: EdgeInsets.only(left: 16, right: 16),
          crossAxisCount: 2,
          crossAxisSpacing: 18,
          mainAxisSpacing: 18,
          children: myList.map((data) {
            return InkWell(
              onTap: () {
                setState(() {
                  Navigator.of(context).push(MaterialPageRoute(
                      builder: (context) => PlaceHolderWidgetDoctor()));
                });
              },
              child: Container(
                decoration: BoxDecoration(
                    color: Colors.blueAccent,
                    borderRadius: BorderRadius.circular(10)),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Image.asset(
                      data.img,
                      width: 42,
                    ),
                    SizedBox(
                      height: 14,
                    ),
                    Text(
                      data.title,
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 16,
                          fontWeight: FontWeight.w600),
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    Text(
                      data.subtitle,
                      style: TextStyle(
                          color: Colors.white38,
                          fontSize: 10,
                          fontWeight: FontWeight.w600),
                    ),
                    SizedBox(
                      height: 14,
                    ),
                    Text(
                      data.event,
                      style: TextStyle(
                          color: Colors.white70,
                          fontSize: 11,
                          fontWeight: FontWeight.w600),
                    ),
                  ],
                ),
              ),
            );
          }).toList()),
    );
  }

thanks in advance!

CodePudding user response:

Passing data between screens in Flutter

As seen in the link, it does not send the list element when entering the new page.

Inside the PlaceHolderWidgetDoctor page must have an expected items value

Navigator.of(context).push(MaterialPageRoute(
                      builder: (context) => PlaceHolderWidgetDoctor(item: data)));

You can create the page by capturing the data variable in the PlaceHolderWidgetDoctor page

CodePudding user response:

Update: I fixed it by adding a separate path into the parent class of the grid item, solved the issue!

  • Related