Flutter “我如何加载？”；“图像”；在blogger API的我的Flitter应用程序中_Flutter_Dart

Flutter “我如何加载？”；“图像”；在blogger API的我的Flitter应用程序中

flutter dart

Flutter “我如何加载？”；“图像”；在blogger API的我的Flitter应用程序中,flutter,dart,Flutter,Dart,我试图从google blogger API加载图像，我成功加载了“标题”，但当我尝试加载“图像”时，调试控制台中出现错误- 'package:flatter/src/painting/_network\u image\u io.dart'：失败的断言：第22行位置14:'url！=null”：不正确。 blogger API中的代码： "author": { "id": "123", "displayName": "Rajdeep Thakare", "url": "https:/

我试图从google blogger API加载图像，我成功加载了“标题”，但当我尝试加载“图像”时，调试控制台中出现错误-

'package:flatter/src/painting/_network\u image\u io.dart'：失败的断言：第22行位置14:'url！=null”：不正确。

blogger API中的代码：

"author": {
  "id": "123",
  "displayName": "Rajdeep Thakare",
  "url": "https://www.blogger.com/profile/123",
  "image": {
    "url": "//lh3.googleusercontent.com/abcdefg"
  }
},

我的项目中的一段代码：

主体：中心(
子项：_正在加载
？循环压缩机指示器（）
：ListView.builder(
itemCount:this.items！=null？this.items.length:0，
itemBuilder：（上下文，i）{
最终项目=此项。项目[i]；
返回列(
儿童：[
Image.network（项目[“Image”]），
文本（项目[“标题]），
分隔符（），
],
);
//返回文本（“行：$i”）；
}
),
),

API中是否存在问题或blogger不允许我或我的图像插入技术错误

=================================================================================

是否可以从blogger API检索帖子图像-

“自链接”：https://www.googleapis.com/blogger/v3/blogs/633372055355686443/posts/8104714868335749943",
“标题”：“第二篇文章”，
“内容”：“\u003cdiv dir=\“ltr\”style=\”文本对齐：左\“trbidi=”on\“\u003e\n\u003cdiv class=”separator\”style=”清除：两者都有；文本对齐：居中\“\u003e\n\u003ca href=\”https://1.bp.blogspot.com/-CbTldBdA_u8/Xn3R8evahLI/AAAAAAAAHJ0/b9gOD6EfI5QL9tXL-w05Qn2Z4eH_qVduQCLcBGAsYHQ/s1600/micheile-henderson-Xgn6rIpBEWo-unsplash.jpg\imageanchor=\'1\'样式=\'左边距：1em；右边距：1米\“\u003e\u003cimg边框=\'0\'数据原始高度=\'1600\'数据原始宽度=\'1067\'高度=\'320\'src=\”https://1.bp.blogspot.com/-CbTldBdA_u8/Xn3R8evahLI/AAAAAAAAHJ0/b9gOD6EfI5QL9tXL-w05Qn2Z4eH_qVduQCLcBGAsYHQ/s320/micheile-henderson-Xgn6rIpBEWo-unsplash.jpg\“宽度=\”213\“/\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cbr/\u003e\n这是我的第二篇文章\u003c/div\u003e\n”，
“author”：{

您无法通过

项[“image”]

直接访问图像URL，因为在您的JSON字符串中，URL嵌套在

作者->图像->URL

中。如果仔细查看错误，它会告诉我们

'URL！=null'：不是真的

，这仅仅意味着您的URL（又称

项[“image”]

变量）==null）

要访问URL，必须遍历JSON字符串中的键。下面是一个示例代码：

import 'dart:convert';

var jsonString = 
""" 
{
  "author": {
    "id": "123",
    "displayName": "Rajdeep Thakare",
    "url": "https://www.blogger.com/profile/123",
    "image": {
      "url": "//lh3.googleusercontent.com/abcdefg"
    }
  }
}
""";

void main() {
  var obj = json.decode(jsonString);
  print(obj['author']['image']['url']);  // prints out '//lh3.googleusercontent.com/abcdefg'
}

只要看看下面的例子，因为url是错误的，所以它不会工作，但如果你把正确的url，它肯定会工作。只需检查以下示例：以下是您提供的示例json，我刚刚更改了图像对象url，因为无法访问您的url：

{
    "author": {
        "id": "123",
        "displayName": "Rajdeep Thakare",
        "url": "https://www.blogger.com/profile/123",
        "image": {
            "url": "https://i.picsum.photos/id/178/536/354.jpg"
        }
    }
}

稍后，我为其创建了一个模型类，如下所述：

// To parse this JSON data, do
//
//     final author = authorFromJson(jsonString);

import 'dart:convert';

Author authorFromJson(String str) => Author.fromJson(json.decode(str));

String authorToJson(Author data) => json.encode(data.toJson());

class Author {
    AuthorClass author;

    Author({
        this.author,
    });

    factory Author.fromJson(Map<String, dynamic> json) => Author(
        author: AuthorClass.fromJson(json["author"]),
    );

    Map<String, dynamic> toJson() => {
        "author": author.toJson(),
    };
}

class AuthorClass {
    String id;
    String displayName;
    String url;
    Image image;

    AuthorClass({
        this.id,
        this.displayName,
        this.url,
        this.image,
    });

    factory AuthorClass.fromJson(Map<String, dynamic> json) => AuthorClass(
        id: json["id"],
        displayName: json["displayName"],
        url: json["url"],
        image: Image.fromJson(json["image"]),
    );

    Map<String, dynamic> toJson() => {
        "id": id,
        "displayName": displayName,
        "url": url,
        "image": image.toJson(),
    };
}

class Image {
    String url;

    Image({
        this.url,
    });

    factory Image.fromJson(Map<String, dynamic> json) => Image(
        url: json["url"],
    );

    Map<String, dynamic> toJson() => {
        "url": url,
    };
}

//要解析此JSON数据，请执行以下操作
//
//最终作者=authorFromJson（jsonString）；
导入“dart:convert”；
Author authorFromJson（String str）=>Author.fromJson（json.decode（str））；
字符串authorToJson（Author data）=>json.encode（data.toJson（））；
类作者{
作者类作者；
作者({
这位作者，
});
factory Author.fromJson（映射json）=>Author(
作者：AuthorClass.fromJson（json[“author”]），
);
映射到JSON（）=>{
“author”：author.toJson（），
};
}
类AuthorClass{
字符串id；
字符串显示名；
字符串url；
图像；
作者类({
这个身份证，
这个.displayName，
这个.url，
这个,这个形象,，
});
工厂AuthorClass.fromJson（映射json）=>AuthorClass(
id:json[“id”]，
displayName:json[“displayName”]，
url:json[“url”]，
image:image.fromJson（json[“image”]），
);
映射到JSON（）=>{
“id”：id，
“displayName”：displayName，
“url”：url，
“image”：image.toJson（），
};
}
阶级形象{
字符串url；
形象({
这个.url，
});
factory Image.fromJson（映射json）=>Image(
url:json[“url”]，
);
映射到JSON（）=>{
“url”：url，
};
}

最后是ui和数据获取的主文件：

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:http/http.dart';

import 'dummy.dart';

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

class MyApp extends StatefulWidget {
  MyApp({Key key}) : super(key: key);

  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _isLoading = false;
  List<Author> authorList = List();

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

  youMethodCall() async {
    setState(() {
      _isLoading = true;
    });
    String jsonString = await loadFromAssets();
    // I have taken the local json file you can 
    // make a api call here and when you get the 
    // response just pass to the below method as show below

    // final author = authorFromJson(response.body);
    // else every thing is the same.

    final author = authorFromJson(jsonString);

    authorList.add(author);
    setState(() {
      _isLoading = false;
    });
  }

  Future<String> loadFromAssets() async {
    return await rootBundle.loadString('json/parse.json');
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: _isLoading
              ? CircularProgressIndicator()
              : ListView.builder(
                  itemCount: authorList.length,
                  itemBuilder: (context, i) {
                    final item = authorList[i].author;
                    return Column(
                      children: <Widget>[
                        CachedNetworkImage(
                          imageUrl: item.image.url,
                          placeholder: (context, url) =>
                              CircularProgressIndicator(),
                          errorWidget: (context, url, error) =>
                              Icon(Icons.error),
                        ),
                        Text(item
                            .displayName), // As you title field was not displayed
                        Divider(),
                      ],
                    );
                    //return Text("Row: $i");
                  }),
        ),
      ),
    );
  }
}

import'package:cached_network_image/cached_network_image.dart'；
进口“包装：颤振/材料.省道”；
导入“包：flifter/services.dart”；
导入“包：http/http.dart”；
导入“dummy.dart”；
void main（）=>runApp（MyApp（））；
类MyApp扩展了StatefulWidget{
MyApp（{Key}）：超级（Key:Key）；
_MyAppState createState（）=>\u MyAppState（）；
}
类MyAppState扩展了状态{
bool_isLoading=false；
List authorList=List（）；
@凌驾
void initState（）{
//TODO:实现initState
super.initState（）；
youMethodCall（）；
}
youMethodCall（）异步{
设置状态（）{
_isLoading=true；
});
字符串jsonString=await loadFromAssets（）；
//我已经获取了本地json文件，您可以
//在这里和当您获得
//响应只需传递到下面的方法，如下所示
//最终作者=authorFromJson（response.body）；
//否则一切都是一样的。
最终作者=authorFromJson（jsonString）；
添加（作者）；
设置状态（）{
_isLoading=false；
});
}
Future loadFromAssets（）异步{
返回wait-rootBundle.loadString（'json/parse.json'）；
}
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
正文：中(
子项：_正在加载
？循环压缩机指示器（）
：ListView.builder(
itemCount:authorList.length，
itemBuilder：（上下文，i）{
最后一项=作者列表[i]。作者；
返回列(
儿童：[
CachedNetworkImage(
imageUrl:item.image.url，
占位符：（上下文）