bugfix> dart > 投稿
class _SearchState extends State<Search> {

  @override
  Widget build(BuildContext context) {
    widget.id;
    return new Scaffold(
      appBar: new AppBar(
        actions: <Widget>[
          new IconButton(
              icon: new Icon(Icons.exit_to_app),
              onPressed: _getTicketDetails
          )
        ],
        centerTitle: true,
        title: new Text
          ("TicketsDetails", style: const TextStyle(
          fontFamily: 'Poppins'
          ,),),),
    );
  }      

_getTicketDetails() async {
        print(widget.id);
        var userDetails = {};

        final response = await http.get(
            "https:...", headers: {
          HttpHeaders.AUTHORIZATION:
          "...
        });
        List returnTicketDetails = json.decode(response.body);
        print(returnTicketDetails);
        for (var i = 0; i < (returnTicketDetails?.length ?? 0); i++) {
          final ticketresponse = await http.get(
              "..${returnTicketDetails[i]["user_id"]
                  .toString()}", headers: {
            HttpHeaders.AUTHORIZATION:
            "...
          });
          userDetails[returnTicketDetails[i]["user_id"]] =
              json.decode(ticketresponse.body);
        }
        print(userDetails);

            }

こんにちは!コンソールでは、印刷によって得られる出力(userDetails)は次のとおりです: {513549601: {first_name: Test, last_name: Account, profile_image: tempURL 。ただし、 Listview を作成したい動的に: userDetails[user_id][first_name] userDetails[user_id][last_name] など...しかし、私の懸念は、どこで Listview を実装すると仮定しています ?すでに最上部でウィジェットビルドを使用しているので。

回答 1 件
  • これを試して!

    APIのユーザー詳細リストからデータを取得したと仮定しましょう。次に、あなただけが必要ですListView.builder() およびカスタムUserWidget/ListTile。

    結果 :

    コード :

      import 'package:flutter/foundation.dart';
    import 'package:flutter/material.dart';
    void main() {
      runApp(new MaterialApp(home: new Home()));
    }
    class Home extends StatelessWidget {
      List userdetails = [
        {
          "first_name": "FLUTTER",
          "last_name": "AWESOME",
          "image_url": "https://pbs.twimg.com/profile_images/760249570085314560/yCrkrbl3_400x400.jpg"
        },
        {
          "first_name": "ABC",
          "last_name": "XYZ",
          "image_url": "https://www.rd.com/wp-content/uploads/2017/09/01-shutterstock_476340928-Irina-Bg-1024x683.jpg"
        },
        {
          "first_name": "FLUTTER",
          "last_name": "AWESOME",
          "image_url": "https://pbs.twimg.com/profile_images/760249570085314560/yCrkrbl3_400x400.jpg"
        },
        {
          "first_name": "ABC",
          "last_name": "XYZ",
          "image_url": "https://www.rd.com/wp-content/uploads/2017/09/01-shutterstock_476340928-Irina-Bg-1024x683.jpg"
        },
        {
          "first_name": "FLUTTER",
          "last_name": "AWESOME",
          "image_url": "https://pbs.twimg.com/profile_images/760249570085314560/yCrkrbl3_400x400.jpg"
        },
        {
          "first_name": "ABC",
          "last_name": "XYZ",
          "image_url": "https://www.rd.com/wp-content/uploads/2017/09/01-shutterstock_476340928-Irina-Bg-1024x683.jpg"
        },
        {
          "first_name": "FLUTTER",
          "last_name": "AWESOME",
          "image_url": "https://pbs.twimg.com/profile_images/760249570085314560/yCrkrbl3_400x400.jpg"
        },
        {
          "first_name": "ABC",
          "last_name": "XYZ",
          "image_url": "https://www.rd.com/wp-content/uploads/2017/09/01-shutterstock_476340928-Irina-Bg-1024x683.jpg"
        },
      ];
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          backgroundColor: Colors.grey,
          appBar: new AppBar(
            title: new Text("Dynamic List"),
            backgroundColor: Colors.redAccent,
          ),
          body: new ListView.builder(
            itemBuilder: (BuildContext context, int index) {
              return new UserWidget(
                firstName: userdetails[index]['first_name'],
                lastName: userdetails[index]['last_name'],
                imageURL: userdetails[index]['image_url'],
              );
            },
            itemCount: userdetails.length,
          ),
        );
      }
    }
    class UserWidget extends StatelessWidget {
      final String firstName;
      final String lastName;
      final String imageURL;
      const UserWidget({Key key, this.firstName, this.lastName, this.imageURL}) : super(key: key);
      @override
      Widget build(BuildContext context) {
        return new Container(
          decoration: new BoxDecoration(border: new Border.all(width: 1.0, color: Colors.grey), color: Colors.white70),
          margin: new EdgeInsets.symmetric(vertical: 1.0),
          child: new ListTile(
            leading: new FadeInImage(
              placeholder: new AssetImage('assets/me.jpg'),
              image: new NetworkImage(imageURL),
            ),
            title: new Text("First Name : " + firstName),
            subtitle: new Text("Last Name : " + lastName),
          ),
        );
      }
    }
    
    

    また、チェックアウトFadeInImage ネットワークイメージのプレースホルダー[イメージがロードされるまでローカルアセットを表示]を提供します。

あなたの答え