How to display items from a list of maps into a listview

Edit: Updated the answer to utilize the serializer OP provided and utilize stateful widget.

Please note in the following code the data is constant but you have adapt it to handle the async http request, as i would like to show the answer in a dartpad here.

import 'package:flutter/material.dart';
import 'dart:convert';

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

void main() {
  runApp(MainWidget());
}

class MainWidget extends StatelessWidget {
  @override
  Widget build(context) {
    return MaterialApp(home: Scaffold(body: Questions()));
  }
}

class Questions extends StatefulWidget {
  @override
  _QuestionsPageState createState() => _QuestionsPageState();
}

class _QuestionsPageState extends State<Questions> {
  QuestionModel data;
  var users;

  String url =
      'https://90d53c1e-1ca3-4d5e-982e-0ff81a3ba7f5.mock.pstmn.io/profile/questions';

  requestQuestionsAPI() {
//   final response = await http.get(Uri.encodeFull(url), headers: {"Accept": "application/json"});

    setState(() {
      //data = json.decode(response.body);

      // Isntead of http fecth a constant data
      data = questionModelFromJson('''{
  "body": {
    "System Topics": [
      {"Topic ID": "2", "Title": "Tres", "Description": "Dos"},
      {"Topic ID": "3", "Title": "Pls Work", "Description": "nfewtrwe"},
      {"Topic ID": "4", "Title": "Juice", "Description": "Bar"}
    ],
    "Video Requests": [
      {
        "Topic ID": "1",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What's you first christmas like?",
        "Description": "Please tell me about your Christmas?"
      },
      {
        "Topic ID": "4",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": ""
      },
      {
        "Topic ID": "5",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": ""
      },
      {
        "Topic ID": "6",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": ""
      },
      {
        "Topic ID": "7",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": ""
      },
      {
        "Topic ID": "8",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": ""
      },
      {
        "Topic ID": "9",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": "From james"
      },
      {
        "Topic ID": "10",
        "From Name": "New User",
        "From Email": "[email protected]",
        "Title": "What is your name?",
        "Description": "From james"
      }
    ]
  }
}''');
    });
  }

  _questions() {
    requestQuestionsAPI();
  }

  void initState() {
    super.initState();
    _questions();
  }

  dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MyNewWidget(questionModel: data);
  }
}

class MyNewWidget extends StatefulWidget {
  final QuestionModel questionModel;
  MyNewWidget({this.questionModel});
  @override
  _MyNewWidgetState createState() => _MyNewWidgetState();
}

class _MyNewWidgetState extends State<MyNewWidget> {
  @override
  Widget build(BuildContext context) {
    print(widget.questionModel);
    return MyList(
      bodyElement: widget.questionModel.body,
    );
  }
}

class MyList extends StatelessWidget {
  final Body bodyElement;
  MyList({this.bodyElement});
  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Text(
        'Sytem Topics',
        style: TextStyle(
            fontWeight: FontWeight.bold,
            fontSize: 25,
            fontStyle: FontStyle.italic),
      ),
      Divider(),
      Expanded(
        child: ListView.builder(
            shrinkWrap: true,
            itemCount: bodyElement.systemTopics.length,
            itemBuilder: (context, index) {
              return MyListElement(
                id: bodyElement.systemTopics[index].topicId,
                description: bodyElement.systemTopics[index].description,
              );
            }),
      ),
      Text(
        'Video Requests',
        style: TextStyle(
            fontWeight: FontWeight.bold,
            fontSize: 25,
            fontStyle: FontStyle.italic),
      ),
      Divider(),
      Expanded(
        child: ListView.builder(
            shrinkWrap: true,
            itemCount: bodyElement.videoRequests.length,
            itemBuilder: (context, index) {
              return MyListElement(
                id: bodyElement.videoRequests[index].topicId,
                description: bodyElement.videoRequests[index].description,
              );
            }),
      )
    ]);
  }
}

class MyListElement extends StatelessWidget {
  final String id;
  final String description;

  MyListElement({this.id, this.description});

  @override
  Widget build(BuildContext context) {
    print('id is $id');
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20.0),
      ),
      height: 74.0,
      margin: const EdgeInsets.only(bottom: 10.0),
      child: Row(
        children: <Widget>[
          Container(
            alignment: Alignment.center,
            child: Text(id),
            height: 74.0,
            width: 73.0,
            decoration: BoxDecoration(
              color: Colors.orange,
              borderRadius: BorderRadius.only(
                  topLeft: const Radius.circular(20.0),
                  bottomLeft: const Radius.circular(20.0)),
            ),
          ),
          Container(
            height: 74.0,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.only(
                  topRight: const Radius.circular(20.0),
                  bottomRight: const Radius.circular(20.0)),
            ),
            width: 265.0,
            child: Center(
                child: Text(
              description,
              style: TextStyle(fontSize: 24.0, color: Colors.red),
            )),
          )
        ],
      ),
    );
  }
}

/// Serializers

QuestionModel questionModelFromJson(String str) =>
    QuestionModel.fromJson(json.decode(str));

String questionModelToJson(QuestionModel data) => json.encode(data.toJson());

class QuestionModel {
  Body body;

  QuestionModel({
    this.body,
  });

  factory QuestionModel.fromJson(Map<String, dynamic> json) => QuestionModel(
        body: Body.fromJson(json["body"]),
      );

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

class Body {
  List<SystemTopic> systemTopics;
  List<VideoRequest> videoRequests;

  Body({
    this.systemTopics,
    this.videoRequests,
  });

  factory Body.fromJson(Map<String, dynamic> json) => Body(
        systemTopics: List<SystemTopic>.from(
            json["System Topics"].map((x) => SystemTopic.fromJson(x))),
        videoRequests: List<VideoRequest>.from(
            json["Video Requests"].map((x) => VideoRequest.fromJson(x))),
      );

  Map<String, dynamic> toJson() => {
        "System Topics":
            List<dynamic>.from(systemTopics.map((x) => x.toJson())),
        "Video Requests":
            List<dynamic>.from(videoRequests.map((x) => x.toJson())),
      };
}

class SystemTopic {
  String topicId;
  String title;
  String description;

  SystemTopic({
    this.topicId,
    this.title,
    this.description,
  });

  factory SystemTopic.fromJson(Map<String, dynamic> json) => SystemTopic(
        topicId: json["Topic ID"],
        title: json["Title"],
        description: json["Description"],
      );

  Map<String, dynamic> toJson() => {
        "Topic ID": topicId,
        "Title": title,
        "Description": description,
      };
}

class VideoRequest {
  String topicId;
  String fromName;
  String fromEmail;
  String title;
  String description;

  VideoRequest({
    this.topicId,
    this.fromName,
    this.fromEmail,
    this.title,
    this.description,
  });

  factory VideoRequest.fromJson(Map<String, dynamic> json) => VideoRequest(
        topicId: json["Topic ID"],
        fromName: json["From Name"],
        fromEmail: json["From Email"],
        title: json["Title"],
        description: json["Description"],
      );

  Map<String, dynamic> toJson() => {
        "Topic ID": topicId,
        "From Name": fromName,
        "From Email": fromEmail,
        "Title": title,
        "Description": description,
      };
}

The corresponding output is as shown below.