title: passing a listView to another screen
body: <p>I need help passing a list view to another screen.</p>
  
  <p>I'm new to flutter and dart, but familiar with programming in general. I figured out how to create a list from an api call. However, my current code, when I press a button, it displays on the screen that I'm currently on. I would  like to pass it to another screen to show in a list (there will be text fields on the home page that will alter the url to fetch data from). What I guess I'm trying to do logically is when a user presses a button, it calls fetch data, builds my list and displays it on a different screen.</p>
  
  <pre><code>import 'package:flutter/material.dart';
  import 'package:http/http.dart';
  import 'dart:convert';
  
  void main(){
    runApp(
        MaterialApp(
        home: MyApp(),
    ),
    );
  }
  class MyApp extends StatefulWidget {
    @override
    State&lt;StatefulWidget&gt; createState() {
      return HomeScreen();
    }
  }
  
  //List is here, had to make global so I could access in 2 widgets
  List&lt;TrailModel&gt; trails=[];
  class HomeScreen extends State&lt;MyApp&gt; {
  
    Future&lt;List&lt;TrailModel&gt;&gt; fetchData() async {
      var response = await get('https://www.hikingproject.com/data/get-trails?lat=40.0274&amp;lon=-105.2519&amp;maxDistance=10&amp;key=200419778-6a46042e219d019001dd83b13d58aa59');
      final trailModels = List&lt;TrailModel&gt;();
      final trailModel = TrailModel.fromJson(json.decode(response.body));
      trails.add(trailModel);
      /*setState(() {
        trails.add(trailModel);
      });*/
      return trailModels;
    }
  
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text("HikeLocator"),
            ),
            body:
            new RaisedButton(
                child: Text("click me"),
  
                onPressed: () async {
                  final trails = await fetchData();
                  Navigator.push(
                    context,
                    new MaterialPageRoute(builder: (context) =&gt; new ListScreen(trails)),
  
                  );
                }
            ),
  
      )
      );
      }
  }
  //Display ListView in here
  class ListScreen extends StatelessWidget {
    final List&lt;TrailModel&gt; trails;
    ListScreen(this.trails);
  
    //ListScreen(this.trails);
    @override
    Widget build (BuildContext ctxt) {
      return new Scaffold(
          appBar: new AppBar(
            title: new Text("This is where the list lies"),
          ),
          body: TrailList(trails),
      );
    }
  }
  
  //create ListView here which I want displayed on 2nd page
  class TrailList extends StatelessWidget {
    final List&lt;TrailModel&gt; trails;
  
    TrailList(this.trails);
  
    Widget build(context) {
      return ListView.builder(
          itemCount: trails.length,
          itemBuilder: (context, int index) {
        String myText =  trails[index].trails.toString();
  
        var splitString = myText.split("\, type");
        var splitString2 = splitString[0];
        var splitString3 = splitString2.split("name: ");
        String name = splitString3[1];
  
        splitString = myText.split("\, name");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("id: ");
        String id = splitString3[1];
  
        splitString = myText.split("\, conditionStatus");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("latitude: ");
        String latitude = splitString3[1];
        splitString = myText.split("\, latitude");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("longitude: ");
        String longitude = splitString3[1];
        splitString = myText.split("\, url");
        splitString2 = splitString[0];
        splitString3 = splitString2.split(" location: ");
        String location = splitString3[1];
  
  
        return Text("name: $name,\n location: $location, \nlatitude: $latitude, \nlongitude: $longitude\n");
  
          },
      );
    }
  }
  class TrailModel{
    Object trails;
    TrailModel(this.trails);
    TrailModel.fromJson(Map&lt;String, dynamic&gt; parsedJson) {
      trails = parsedJson['trails'];
  
    }
  }
  </code></pre>
  
  <p>Ever since I changed some of my widgets to Stateful, my button click to go to the next page is no longer working. My attempt to pass the data was to pass in the trails variable which is a list to the next page from Home Screen, create constructor in List Screen and then create ListView there. However, without being able to go to the next page. I have no idea if it's working.  . I initially wasn't going to post all of my code, but I think it helps to see the interaction between classes with the full picture. Thanks for any help</p>