CODEWITHSUNDEEP
dartflutter
Sachihiro
Sachihiro

Reputation: 1783

How can i make a list and click on item to navigate to a new route

I know this code only displays title and i want to make a onTap method to navigate to a new route, but this is how fare i made it, any help, hint, tip, even shaming me for how stupid i am would be very much appreciated. Edit: I did posted the whole code because something is going wrong even after help that i got here. maybe is a syntax problem or maybe i am just too stupid

Widget build(BuildContext context) {
return new Scaffold(
  body: new ListView.builder(
    itemCount: data == null ? 0 : 10,
    itemBuilder: (BuildContext context, int index){
      return new Card(
        child: new ListTile(
            onTap: _onTapped,
            title : new Text(data[index]["title"]),
        ),
      );
    },
  ),
);

} }

Upvotes: 3

Views: 10007

Answers (2)

PearlByte
PearlByte

Reputation: 69

An easier approach I found is to just wrap the item inside the ListTile with a FlatButton (or some interactive widget). In your code, for example:

Widget build(BuildContext context) {
    return new Scaffold(
      body: new ListView.builder(
        itemCount: data == null ? 0 : 10,
        itemBuilder: (BuildContext context, int index){
          return new Card(
            child: new ListTile(
              title: FlatButton(
                child: new Text(data[index]["title"]),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => YourPage()),
                  );
                },
              ),
            ),
          );
        },
      ),
    );

Upvotes: 1

Rémi Rousselet
Rémi Rousselet

Reputation: 277057

Just wrap your title in a GestureDecector to handle clicks. Then call Navigator's pushNamed to redirect to a new route.

new GestureDetector(
  onTap: () {
    Navigator.pushNamed(context, "myRoute");
  },
  child: new Text("my Title"),
);

Upvotes: 11

Related Questions