Doubt Flutter: Listview

Question

Good morning!

Could someone assist me in a doubt?

What am I doing:

I did a search for the user to search for an Infringement or Attachments etc in the app, and soon after the action on the keyboard I redirect it to another page (Filtroinicioview) passing the data as parameter.

onFieldSubmitted: (string) {
  Navigator.of(context).push(
    MaterialPageRoute(
      builder: (context) => FiltroinicioView(filterNomeInfracao, filterNomeAnexo),
    ),
  );
},

After redirecting the user to the View page of the infraction and searched attachments, I show the List of Infractions, and attachments,

    body: Column(
      children: <Widget>[
        Expanded(
            child: ListView.builder(
          padding: EdgeInsets.all(10.0),
          itemCount: filterNomeInfracao.length +
              filterNomeAnexo.length 
          itemBuilder: (BuildContext context, int index) {
            print(filterNomeInfracao);
            print(filterNomeAnexo);

          },

Return of Print:

[Infracao{id: null, descricao:  , codigo: INFRAÇÕES, art_ctb: null, pontuacao_id: null, observacao: null, foto: null, procedimento_id: null, categoria_id: null, created: null, modified: null, deleted: null}, Infracao{id: 34, descricao: CONFIAR/ ENTREGAR  veículo a pessoa em estado FÍSICO/ PSÍQUICO SEM CONDIÇÕES  de dirigir com segurança, codigo: 517-7_0, art_ctb: 166, pontuacao_id: 5, observacao: Conforme Resolução CONTRAN 561/2015.

 [Anexo{id: 40, nome: GESTOS DE AGENTES, conteudo: movimentos convencionais de braço, adotados exclusivamente pelos agentes de autoridades de trânsito nas vias, para orientar, indicar o direi

My doubt is how I can know now inside the itemBuilder: (Buildcontext context, int index) { which list is from Infringements and which list is attachments because I need to do an IF now or be

if(for a lista ANEXOS){
faz alguma coisa
}


if( for a lista INFRACOES){
faz alguma coisa
}

AS QUOTED IN THE COMMENTARY THE FORM MADE:

   body: Column(
          children: <Widget>[
            Expanded(
              child: ListView.builder(
                padding: EdgeInsets.all(10.0),
                itemCount: filterNomeInfracao.length,
                itemBuilder: (BuildContext context, int index) {
                  if (index < filterNomeInfracao.length) {
                    return Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Padding(
                          padding: EdgeInsets.fromLTRB(0.0, 25.0, 20.0, 1.0),
                          child: ListTile(
                            title: Text(
                              'INFRAÇÕES.',
                              style: TextStyle(
                                fontSize: 28.0,
                              ),
                            ),
                          ),
                        ),
                      ],
                    );
                  }
                  return ListaInfracao(filterNomeInfracao[index]);
                },
              ),
            ),
            Expanded(
              child: ListView.builder(
                padding: EdgeInsets.all(10.0),
                itemCount: filterNomeInfracao.length,
                itemBuilder: (BuildContext context, int index) {
                  if (index < filterNomeAnexo.length) {
                    return Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Padding(
                          padding: EdgeInsets.fromLTRB(0.0, 25.0, 20.0, 1.0),
                          child: ListTile(
                            title: Text(
                              'ANEXOS.',
                              style: TextStyle(
                                fontSize: 28.0,
                              ),
                            ),
                          ),
                        ),
                      ],
                    );
                  }
                  return ListaAnexos(filterNomeAnexo[index]);
                },
              ),
            ),
          ],
        ));

HOW YOU ARE BRINGING THE DATA (YOU ARE NOT RETURNING THE LIST AND THE TEXT IS DUPLICATED)

Answer 1

You are responsible for choosing what to display in each case.

Its function:

(BuildContext context, int index) {}

Receives only one index as parameter, it will vary from 0 until the value you put in itemCount (exclusively). In your case goes up to

(filterNomeInfracao.length + filterNomeAnexo.length)-1

So you should check the index value before displaying the corresponding Widget:

if(index < filterNomeAnexo.length){
Return Text('Lista Anexos');
}
return Text('Lista Infrações');

This will make the list of attachments come before the list of Breaches. To do otherwise you can check the size of the other list before.

Another option, perhaps more readable would be to make two ListView.builder(). One for the list of Annexes, and one for infringements:

body: Column(
      children: <Widget>[
        Expanded(
            child: ListView.builder(
          padding: EdgeInsets.all(10.0),
          itemCount: filterNomeInfracao.length
          itemBuilder: (BuildContext context, int index) {
            return Text(filterNomeInfracao[index]);

          })),
        Expanded(
            child: ListView.builder(
          padding: EdgeInsets.all(10.0),
          itemCount: filterNomeAnexo.length 
          itemBuilder: (BuildContext context, int index) {
            return Text(filterNomeAnexo[index]);
          })),],

Both modes will work.

Answer 2

You have the possibility to join the two lists into one and work validating the data type at the time you use it.

Let’s assume you owned these two classes

class Infracao {
  Infracao({this.id, this.descricao});
  int id;
  String descricao;
}

class Multa {
  Multa({this.id, this.gravidade});
  int id;
  String gravidade;
}

Then you get the details of the violations and fines, then we can join both lists and work as follows:

import 'package:flutter/material.dart';

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  
  List<Infracao> infracoes = [
    Infracao(id: 0, descricao: "Teste 0"),
    Infracao(id: 1, descricao: "Teste 1"),
    Infracao(id: 2, descricao: "Teste 2"),
  ];
  
  List<Multa> multas = [
    Multa(id: 0, gravidade: "Alta"),
    Multa(id: 1, gravidade: "Média"),
    Multa(id: 2, gravidade: "Baixa"),
  ];  
  
  List<dynamic> dados = [];
  
  @override
  Widget build(BuildContext context) {
    
    dados.clear();
    dados.addAll(infracoes);
    dados.addAll(multas);
    
    return ListView.builder(
      itemCount: dados.length,
      itemBuilder: (BuildContext context, int index){
        if (dados[index] is Infracao)
          return Text("Infração: "+ (dados[index] as Infracao).descricao);
        else
          return Text("Multa: "+ (dados[index] as Multa).gravidade);
      },
    );
  }
}

Note: If you are working with StatefullWidget, join the lists on initState()

Doing this way, you will only have a list and within it you treat what kind of data will be drawn using validation

if (dados[index] is Infracao)
  return Text("Infração: "+ (dados[index] as Infracao).descricao);
else
  return Text("Multa: "+ (dados[index] as Multa).gravidade);