CODEWITHSUNDEEP
androidhtmliosdartflutter
Jake
Jake

Reputation: 2056

Flutter - How to parse data from a website to a list view

I'm looking for help with my test app to provide a news feed that parses it's data from a website, namely VMoneyNews (I have their permission to use their data).

I aim for this to parse the article title, main article text and article image of each article in the Bitcoin News category for implementation into the listView, in this case a horizontal listViewRow.

Please don't include the header text in bold at the top of each article, or the link to similar articles.

Could someone please provide this code for me? I assume this will be using the HTML dependency but I just don't know where to start implementing this feature.

Thank you.

Upvotes: 6

Views: 10535

Answers (3)

Tushar Ojha
Tushar Ojha

Reputation: 31

Web Scraping in dart is easy now! Just check web_scraper package on pub.

Using this package you can scrape the website's HTML tags data into simple lists & maps.

You can find a similar example in its repository.

Upvotes: 3

khairy Mohamed
khairy Mohamed

Reputation: 176

I think a clean solution is to do those stuff on the backend if possible , if you use nodejs as your backend , you may think of casperJs or phantomJs , to parse the html DOM and extract data and return a clean json data to the mobile app .

Upvotes: 2

Raouf Rahiche
Raouf Rahiche

Reputation: 31386

i created a full application that shows how to parse HTML and extract data from it you can find it here but the idea is simple :

1.import this 3 libraries for html parsing 

import 'package:http/http.dart' as http;
import 'package:html/parser.dart' as parser;
import 'package:html/dom.dart' as dom;

2.get the data from the page you want 

Future<List<String>> getData() async { 
  http.Response response = await http.get('website');
}

3.extract the data from the website

dom.Document document = parser.parse(response.body);

4. depend on your need let's say you want to get all element with the article tag 

document.getElementsByTagName('article')

and then you can iterate throw all article using for-each and do the same to get the data inside the article . also consider making a model class for the article so you can mangle that easily later on

Upvotes: 16

Related Questions