characters_list_screen.dart

import 'package:assignment_1_base_project/db/character.dart';
import 'package:assignment_1_base_project/db/database.dart';
import 'package:assignment_1_base_project/networking/api.dart';
import 'package:assignment_1_base_project/screens/character_detail_screen.dart';

import 'package:flutter/material.dart';

class CharactersListScreen extends StatefulWidget {
  @override
  _CharactersListScreenState createState() => _CharactersListScreenState();
}

class _CharactersListScreenState extends State<CharactersListScreen> {
  List<Character>? characters;

  @override
  void initState() {
    // first the characters are loaded from the database and displayed
    characters = Database().storedCharacters;

    //// Check if characters empty (or set to false if null), then load data from API
    if (characters?.isEmpty ?? false) {
      // then the characters are loaded from the API and displayed as soon as they are there
      API().fetchRemoteGoTCharacters().then((characters) {
        setState(() {
          // the setState method re-renders the UI
          this.characters = characters;
        });
      });
    }

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Game of Thrones Characters'),
      ),
      body: SafeArea(
        child: ListView.separated(
          itemBuilder: (context, index) => _buildCharacterListTile(index),
          separatorBuilder: (_, __) => Divider(),
          itemCount: characters?.length ?? 0,
        ),
      ),
    );
  }

  Widget _buildCharacterListTile(int index) {
    final Character character = characters![index];
    return ListTile(
      title: Text(
        '${index + 1}. ${character.name}',
        style: TextStyle(fontSize: 17),
      ),
      trailing: Icon(Icons.arrow_forward_ios_outlined),
      onTap: () {
        //TODO: open the CharacterDetailScreen with the character.
        Navigator.push(context, MaterialPageRoute(builder: (context) => CharacterDetailScreen(character: character)));
      },
    );
  }
}