颤抖，从网站获取特定图像 [英] Flutter, fetching specfic image from website

问题描述

我正在学习颤动，并且想要获取各种图像，这些图像是卡通的缩略图.我使用了 HTTP 库并获取了响应数据.

但是，我如何提取该图像?

网站:

  Future< http.Response>_getData()异步{返回等待http.get('https://comic.naver.com/webtoon/weekdayList.nhn?week=');}@override窗口小部件build(BuildContext context){返回脚手架(appBar:AppBar(backgroundColor:Colors.red，)，身体:中心(子代:RaisedButton(子级:Text("Fetching")，onPressed:(){_getData().then((response){//dom.Document document = parser.parse(response.body);打印(response.body);}).catchError((e)=> print(e));}，)，)，);} 

---

我想做的是下面的事情.

1. 以HTML代码获取网页
2. 查找每个卡通的图片网址
3. 获取该图片

解决方案

在这里有一个基本示例，按右上角按钮后，将在 ListView 中获取图像:

  import'dart:async';导入'package:flutter/material.dart';导入'package:http/http.dart'为http;导入'package:html/parser.dart'作为解析器;将``package:html/dom.dart''导入为dom;...创建您的StatefulWidget类ParsingWidgetState扩展了State< ParsingWidget>{List< String>list = List();void _getData()异步{最终回应=等待http.get('https://comic.naver.com/webtoon/weekdayList.nhn?week=');dom.Document document = parser.parse(response.body);最后的元素= document.getElementsByClassName('thumb');setState((){列表=元素.map((element)=>element.getElementsByTagName("img")[0] .attributes ['src']).toList();});}@override窗口小部件build(BuildContext context){返回脚手架(appBar:AppBar(backgroundColor:Colors.red，动作:< Widget> [IconButton(图标:Icon(Icons.refresh)，onPressed:(){_getData();}，)，]，)，正文:ListView.builder(itemCount:list.length，itemBuilder :(上下文，索引){返回Image.network(列表[索引]，高度:200.0，);}，))；}} 

尝试使用FutureBuilder代替 setState ，这只是一个有效示例.

更多信息:

• https://docs.flutter.io/flutter/widgets/FutureBuilder-class.html
• https://flutter-academy.com/async-in-flutter-futurebuilder/

I'm learning flutter and want to fetch various images which are the thumbnail of the cartoon. I used HTTP library and fetched response data.

But, how can I extract that image?

Website: https://comic.naver.com/webtoon/weekdayList.nhn?week=

Future<http.Response> _getData() async {
    return await http.get('https://comic.naver.com/webtoon/weekdayList.nhn?week=');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.red,
      ),
      body: Center(
        child: RaisedButton(
          child: Text("Fetching"),
          onPressed: (){
            _getData().then((response){
              //dom.Document document = parser.parse(response.body);
              print(response.body);
            }).catchError((e) => print(e));
          },
        ),
      ),
    );
  }

---

What I want to do is below.

1. Fetching web page as HTML code
2. Find image url of each cartoon
3. Fetch that image

解决方案

Here you have a basic example, after you press the top-right button, you will get the images in a ListView:

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


   ...create your StatefulWidget



     class ParsingWidgetState extends State<ParsingWidget> {
      List<String> list = List();

      void _getData() async {
        final response =
            await http.get('https://comic.naver.com/webtoon/weekdayList.nhn?week=');
        dom.Document document = parser.parse(response.body);
        final elements = document.getElementsByClassName('thumb');

        setState(() {
          list = elements
              .map((element) =>
                  element.getElementsByTagName("img")[0].attributes['src'])
              .toList();
        });
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              backgroundColor: Colors.red,
              actions: <Widget>[
                IconButton(
                  icon: Icon(Icons.refresh),
                  onPressed: () {
                    _getData();
                  },
                ),
              ],
            ),
            body: ListView.builder(
              itemCount: list.length,
              itemBuilder: (context, index) {
                return Image.network(
                  list[index],
                  height: 200.0,
                );
              },
            ));
      }
    }

Try using FutureBuilder instead setState, this is just a working sample.

More info:

• https://docs.flutter.io/flutter/widgets/FutureBuilder-class.html
• https://flutter-academy.com/async-in-flutter-futurebuilder/

这篇关于颤抖，从网站获取特定图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！