How to Implement API Calls in Flutter?

Question

I want to create a weather widget app by flutter but i am finding it difficult to do so as there is limited content on flutter. So if anyone knows how to Call , share your knowledge.

@iamdanchiv Sir , i googled it , i made an API key , i am finding it difficult to implement the code . — Yatin Phullera
– Yatin Phullera, Commented Jun 21, 2017 at 4:09

Peter Gluck · Accepted Answer · 2017-12-30 02:49:23Z

If you're building a weather widget you'll almost certainly want a location plugin, which doesn't exist yet but is coming soon.

Here is some code that shows current temperature in San Francisco.

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

void main() {
  runApp(new MaterialApp(
    home: new MyHomePage(),
  ));
}

class Weather extends StatelessWidget {
  final Map<String, dynamic> data;
  Weather(this.data);
  Widget build(BuildContext context) {
    double temp = data['main']['temp'];
    return new Text(
      '${temp.toStringAsFixed(1)} °C',
      style: Theme.of(context).textTheme.display4,
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePageState createState() => new MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {
  Future<http.Response> _response;

  void initState() {
    super.initState();
    _refresh();
  }

  void _refresh() {
    setState(() {
      _response = http.get(
        'http://api.openweathermap.org/data/2.5/forecast'
          '?q=San+Francisco&units=metric&APPID=14cc828bff4e71286219858975c3e89a'
      );
    });
  }

  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Weather Example"),
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.refresh),
        onPressed: _refresh,
      ),
      body: new Center(
        child: new FutureBuilder(
          future: _response,
          builder: (BuildContext context, AsyncSnapshot<http.Response> response) {
            if (!response.hasData)
              return new Text('Loading...');
            else if (response.data.statusCode != 200) {
              return new Text('Could not connect to weather service.');
            } else {
              Map<String, dynamic> json = JSON.decode(response.data.body);
              if (json['cod'] == 200)
                return new Weather(json);
              else
                return new Text('Weather service error: $json.');
            }
          }
        )
      ),
    );
  }
}

GvSharma · Accepted Answer · 2018-03-13 06:00:13Z

2

It could help someone, click here for official doc

1. Making Http Requests; import 'dart:io';
var httpClient = new HttpClient();

Create the client.
Construct the Uri.
Invoke the operation, and await the request object. Optionally,
configure the headers and body of the request.
Close the request, and await the response.

Decode the response

get() async {
   var httpClient = new HttpClient();
   var uri = new Uri.http(
  'example.com', '/path1/path2', {'param1': '42', 'param2': 'foo'});
   var request = await httpClient.getUrl(uri);
   var response = await request.close();
   var responseBody = await response.transform(UTF8.decoder).join();
   Map data = JSON.decode(responseBody);
}

answered Mar 13, 2018 at 6:00

GvSharma

2,6701 gold badge26 silver badges31 bronze badges

Collectives™ on Stack Overflow

How to Implement API Calls in Flutter?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related