title: Is it possible using IconButton in a list to navigate to other screen
body: <p>I want to add a clickable icon in the trailing in a ListTile which will navigate me to other screen but I keeps getting an error which undefined context. I am pretty sure that on my SettingsScreen() , I have included context to pass on. Here is my code for the reference. Hope someone can explained to me further.</p>
  <pre><code>class ProfileScreen extends StatelessWidget {
    List&lt;dynamic&gt; list = [
      {
        'id': 0,
        'title': 'Profile',
        'trailing': IconButton(icon: Icon(Icons.arrow_forward_ios_outlined), onPressed: () {}),
      },
      {
        'id': 1,
        'title': 'Change PIN',
        'trailing': IconButton(icon: Icon(Icons.arrow_forward_ios_outlined), onPressed: () {
          
        }),
      },
      {
        'id': 2,
        'title': 'Settings',
        'trailing': IconButton(icon: Icon(Icons.arrow_forward_ios_outlined), onPressed: () {
          Navigator.push(context, MaterialPageRoute (builder: (context) =&gt; SettingsScreen()));
        }),
      },
      {
        'id': 3,
        'title': 'Contact Us',
        'trailing': IconButton(icon: Icon(Icons.arrow_forward_ios_outlined), onPressed: () {}),
      },
      {
        'id': 4,
        'title': 'About NBS ',
        'trailing': IconButton(icon: Icon(Icons.arrow_forward_ios_outlined), onPressed: () {}),
      },
    ];
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar( 
          backgroundColor: Colors.orange,
          leading: IconButton(onPressed: () { 
            Navigator.pop(context);
          }, icon: const Icon(Icons.arrow_back_ios_new_outlined),
        ), ), 
        body: ListView.builder(
          itemCount: list.length,
          itemBuilder: (BuildContext context, int index) {
            return Card(
              shadowColor: Colors.grey.shade300,
              child: ListTile(
                title: Text(
                  list[index]['title'],
                ),
      
  
        trailing: list[index]['trailing'],
          ),
        );
      },
    ),
  );
    }
  }
  
  class SettingsScreen extends StatelessWidget {
    const SettingsScreen({ Key? key }) : super(key: key);
  
    @override
    Widget build(BuildContext context, { String title = ''}) {  
      return MaterialApp(
        debugShowCheckedModeBanner: false, 
        title: 'Settings',
        home: Scaffold(  
          appBar: 
          AppBar( 
      backgroundColor: Colors.orange, 
      title: const Text('Settings',  
      style: TextStyle( color: Colors.black, fontWeight: FontWeight.bold)), 
      centerTitle: true,
      leading: GestureDetector( 
        child: IconButton(
          icon: const Icon(Icons.arrow_back_ios_new_outlined,
          size: 20, 
          color: Colors.white,),
          onPressed: () { 
            Navigator.pop(context);
          },),
      )), 
          body: Column( 
            children: const [ 
             DetailsSettings(),
            ],
          ),
        ),
        
      );
    }
  }
  </code></pre>