Flutter : News App Workshop #part1

import 'package:flutter/material.dart';

class NewsPages extends StatefulWidget {
  const NewsPages({Key? key}) : super(key: key);

  @override
  _NewsPagesState createState() => _NewsPagesState();
}

class _NewsPagesState extends State<NewsPages> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('News'),
      ),
    );
  }
}

main.dart

import 'package:flutter/material.dart';
import 'package:flutter_news/pages/NewsPages.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: NewsPages(),
    );
  }
}

https://newsapi.org/

Posman

pubspec.yaml

 http: ^0.13.3
 intl: ^0.17.0

NewsPage.dart

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

class _NewsPagesState extends State<NewsPages> { 
  List<dynamic> articles = [];
  int totalResults = 0;
  bool isLoading = true;

_getData()

_getData()async {
    try {
      var url = Uri.parse(
          'https://newsapi.org/v2/everything?q=apple&from=2021-06-22&to=2021-06-22&sortBy=popularity&apiKey=xxx');
      var response = await http.get(url);

      final Map<String, dynamic> news = convert.jsonDecode(response.body);
      setState(() {
        articles = news['articles'];
        totalResults = news['totalResults'];
        isLoading = false;
      });

    } catch(e) {
      setState(() {
        isLoading = false;
      });
    }
  }
@override
  void initState() {
    // TODO: implement initState
    super.initState();
    _getData();
  }
 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: totalResults > 0 ? Text('News ($totalResults)') : Text('News')
      ),
    );
  }
     body: 
        ListView.separated(itemBuilder: (BuildContext context, int index){
           return ListTile (
              title: Text(articles[index]['title']),
           );
        },
          separatorBuilder: (BuildContext context, int index) => const Divider(),
          itemCount: articles.length
      ),

NewsPage.dart

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

class NewsPages extends StatefulWidget {
  const NewsPages({Key? key}) : super(key: key);

  @override
  _NewsPagesState createState() => _NewsPagesState();
}

class _NewsPagesState extends State<NewsPages> {
  List<dynamic> articles = [];
  int totalResults = 0;
  bool isLoading = true;

  _getData()async {
    try {
      var url = Uri.parse(
          'https://newsapi.org/v2/everything?q=apple&from=2021-06-22&to=2021-06-22&sortBy=popularity&apiKey=xxx');
      var response = await http.get(url);

      final Map<String, dynamic> news = convert.jsonDecode(response.body);
      setState(() {
        articles = news['articles'];
        totalResults = news['totalResults'];
        isLoading = false;
      });

    } catch(e) {
      setState(() {
        isLoading = false;
      });
    }
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _getData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: totalResults > 0 ? Text('News ($totalResults)') : Text('News')
      ),
      body:
        ListView.separated(itemBuilder: (BuildContext context, int index){
           return ListTile (
              title: Text(articles[index]['title']),
           );
        },
          separatorBuilder: (BuildContext context, int index) => const Divider(),
          itemCount: articles.length
      ),
    );
  }
}
(Visited 155 times, 1 visits today)
Spread the love
Published
Categorized as Flutter