Flutter Route And Fetching Api Data

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() => runApp(MainApp());

class MainApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        // primarySwatch: Colors.red,
        primaryColor: Colors.black,
      ),
      home: Scaffold(
        body: HomeScreen(),
      ),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  var hostDetail;
  final String apiUrl =
      "http://dev2.yigserver.com/apps/fortune/public/api/host";

  void fetchHost(id) async {
    // var id = widget.todo;
    var result = await http.get("$apiUrl/$id");
    if (result.statusCode == 200) {
      var bodyRes = json.decode(result.body);
      hostDetail = bodyRes['data']['data'];
    } else {
      print('Request failed with status: ${result.statusCode}.');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Center(
          child: RaisedButton.icon(
            color: Colors.red,
            icon: Icon(
              Icons.home,
              color: Colors.white,
            ),
            label: Text(
              'Go',
              style: TextStyle(
                color: Colors.white,
              ),
            ),
            onPressed: () async {
              var result = await http.get("$apiUrl/3");
              if (result.statusCode == 200) {
                var bodyRes = json.decode(result.body);
                hostDetail = bodyRes['data']['data'];
                Route route = MaterialPageRoute(
                    builder: (_) => WelcomeScreen(hostDetail));
                Navigator.push(context, route);
              }
            },
          ),
        ),
      ),
    );
  }
}

class WelcomeScreen extends StatefulWidget {
  final data;
  WelcomeScreen(this.data);
  @override
  _WelcomeScreenState createState() => _WelcomeScreenState();
}

class _WelcomeScreenState extends State<WelcomeScreen> {
  var hostDetial;
  @override
  void initState() {
    super.initState();
    this.hostDetial = widget.data;
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Detail Title'),
        ),
        body: Container(
          child: Center(
            child: Text('Hello Welcome Page....${this.hostDetial}'),
          ),
        ),
      ),
    );
  }
}

Output:

Screen 1

 Screen 2

Share on Google Plus

About Ram Pukar

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.