如果列表为空，如何显示图像？ [英] How can I display Image if my list is empty?

问题描述

我想在中心显示图像或文本，例如未找到记录，所有详细信息都从API获取。在本机Android中， setEmptyView（）会遇到这种情况，但不知道如何在颤抖中做到这一点。不间断进度对话框正在运行，但不显示文本。我在JSON响应中添加了代码

I want to display an Image or Text in Center like No Record Found all details are fetched from API. In Native Android setEmptyView() for this condition but no idea how can I do this in flutter. Non-stop progress Dialog is running but the text is not displayed. I added code with my JSON response

List<NewAddressModel> newAddress = List();
bool isLoading = false;

Scaffold(
body :isLoading
          ? Center(
        child: CircularProgressIndicator(),
      )
          : Container(
          color: Color.fromRGBO(234, 236, 238, 1),
          child: getListView()
      ),
)

Widget getListView(){
    return newAddress.isNotEmpty ?
    ListView.builder(itemCount: newAddress.length,
        itemBuilder: (BuildContext context, int index) {
          return addressViewCard(index);
        }

    )
        : Center(child: Text("No Found"));
  }

Future<List>hitGetAddressApi() async {
    setState(() {
      isLoading = true;
    });
    final response = await http.post(api);

    var userDetails = json.decode(response.body);
    if (response.statusCode == 200) {
      newAddress = (json.decode(response.body) as List)
          .map((data) => new NewAddressModel.fromJson(data))
          .toList();
      setState(() {
        isLoading = false;
        newAddressModel = new NewAddressModel.fromJson(userDetails[0]);
      });
    }


    return userDetails;
  }

This is JSON Response which I am getting from my API.
[
    {
        "id": "35",
        "name": "Toyed",
        "mobile": "8855226611",
        "address": "House No 100",
        "state": "Delhi",
        "city": "New Delhi",
        "pin": "000000",
        "userid": "2",
    }
]

推荐答案

尝试一下，

import 'dart:convert';

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

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() => runApp(MaterialApp(home: MyWidget()));

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  Future<List<NewAddressModel>> newAddress;

  @override
  void initState() {
    newAddress = hitGetAddressApi();
    super.initState();
  }

  Future<List<NewAddressModel>> hitGetAddressApi() async {
    final response = await http.post("api");
    if (response.statusCode == 200) {
      final responseBody = json.decode(response.body);
      if (responseBody is List)
        return responseBody
            .map((data) => new NewAddressModel.fromJson(data))
            .toList();
      else {
        print(responseBody);
        return null;
      }
    } else {
      print(response.statusCode);
      throw Exception("Problem in fetching address List");
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder<List<NewAddressModel>>(
        future: newAddress,
        builder: (context, snapShot) {
          if (snapShot.connectionState == ConnectionState.waiting)
            return Center(
              child: CircularProgressIndicator(),
            );
          else if (snapShot.hasError) {
            return Center(
              child: Text("ERROR: ${snapShot.error}"),
            );
          } else {
            if (snapShot.hasData && snapShot.data.isNotEmpty)
              return getListView(snapShot.data);
            else //`snapShot.hasData` can be false if the `snapshot.data` is null
              return Center(
                child: Text("No Data Found"),
              );
          }
        },
      ),
    );
  }

  Widget getListView(List<NewAddressModel> addressList) {
    return ListView.builder(
      itemCount: addressList.length,
      itemBuilder: (BuildContext context, int index) {
        final address = addressList[index];
        //Change `addressViewCard` to accept an `NewAddressModel` object
        return addressViewCard(address);
      },
    );
  }

  Widget addressViewCard(NewAddressModel address) {
    //implement based on address instead of index
    return ListTile(title: Text("${address.address}"));
  }
}

class NewAddressModel {
  String id;
  String name;
  String mobile;
  String address;
  String state;
  String city;
  String pin;
  String userid;

  NewAddressModel({
    this.id,
    this.name,
    this.mobile,
    this.address,
    this.state,
    this.city,
    this.pin,
    this.userid,
  });

  factory NewAddressModel.fromJson(Map<String, dynamic> json) =>
      NewAddressModel(
        id: json["id"],
        name: json["name"],
        mobile: json["mobile"],
        address: json["address"],
        state: json["state"],
        city: json["city"],
        pin: json["pin"],
        userid: json["userid"],
      );

  Map<String, dynamic> toJson() => {
        "id": id,
        "name": name,
        "mobile": mobile,
        "address": address,
        "state": state,
        "city": city,
        "pin": pin,
        "userid": userid,
      };
}

这篇关于如果列表为空，如何显示图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！