0

Eu tentei seguir o tutorial deste link http://www.macoratti.net/19/07/flut_gridv1.htm pois tem uma listagem de itens em gridview mais próximo do que quero utilizar.

E então eu tentei adicionar uma opção de tornar esses itens clicáveis e fiz algumas pequenas modificações mas está dando erro na opção VoidCallback.

O erro retornado são estes:

  1. Invalid constant value - line 38
  2. The values in a const list literal must be constants - line 38
  3. Const variables must be initialized with a constant value - line 38

A parte do código que está dando erro é esse:

class ItemExemplo {
  const ItemExemplo({this.titulo, this.icon, this.onPressBtn});
  final String titulo;
  final IconData icon;
  final VoidCallback onPressBtn;
}

const List<ItemExemplo> itenslist = const <ItemExemplo>[
  const ItemExemplo(titulo: 'Carro', icon: Icons.directions_car),
  const ItemExemplo(titulo: 'Bike', icon: Icons.directions_bike),
  const ItemExemplo(titulo: 'Barco', icon: Icons.directions_boat),

  // o onPressBtn da linha abaixo é onde esta dando o erro, mas preciso dele pra função onTap do Widget que será exibido no grid.

  const ItemExemplo(titulo: 'Ônibux', icon: Icons.directions_bus, onPressBtn: () => print("Teste")),
];

Eu até entendo que o erro ta nas constantes, mas será que estou no caminho correto ou deveria refazer de outra maneira totalmente diferente? tem outro modo mais correto de fazer isso e que funcione?

Como ainda não existe um snippet para flutter aqui no SO eu coloquei o código completo no DartPad no link abaixo:

https://dartpad.dev/96d51e9f55496f4125ab6697d1a639e4

2 Respostas 2

3

Escolhi a resposta acima do Matheus como correta por ser justo a resposta que responde a minha pergunta. Mas eu encontrei outra solução para o meu problema e resolvi da forma abaixo, então as duas respostas estão corretas para quem precisar futuramente.

Na minha solução eu eliminei as linhas de listagens e modifiquei o construtor do widget ItensCard da seguinte forma, adicionando além do callback também coloquei mais uma opção para cores dos icones:

class ItensCard extends StatelessWidget {
  ItensCard({this.title, this.icon, this.colorItem, this.onPressBtn});

  final String title;
  final IconData icon;
  final MaterialColor colorItem;
  final VoidCallback onPressBtn;

  @override
  Widget build(BuildContext context) {
    final TextStyle textStyle = Theme.of(context).textTheme.bodyText2;
    return Card(
        color: Colors.white,
        child: InkWell(
          onTap: onPressBtn,
          splashColor: Colors.amber,
          child: Center(
            child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Icon(icon, size: 80.0, color: colorItem),
                  Text(title, style: textStyle),
                ]),
          ),
        ));
  }
}

E agora em vez de eu usar a listagem no gridview como fazia antes dessa forma:

 children: List.generate(itenslist.length, (index) {
      return Center(
        child: ItensCard(item: itenslist[index]),
      );
    }),

Agora eu adiciono a propria lista direto no gridview dessa forma:

children: <Widget>[
    ItensCard(title: 'Carro', icon: Icons.directions_car, colorItem: Colors.blue, onPressBtn: () => print("Teste Carro")),
    ItensCard(title: 'Bike', icon: Icons.directions_bike, colorItem: Colors.red, onPressBtn: () => print("Teste Bike")),
    ItensCard(title: 'Barco', icon: Icons.directions_boat, colorItem: Colors.pink, onPressBtn: () => print("Teste Barco")),
    ItensCard(title: 'Ônibus', icon: Icons.directions_bus, ncolorItem: Colors.green, onPressBtn: () => print("Teste Ônibus")),
  ]);

Isso pra mim no meu caso me poupou mais linhas de códigos reduzindo bastante o tamanho, e também me facilitou o trabalho. Não sei se é útil pra todo mundo mas esta sendo muito util pra mim.

Segue o link da solução para visualização no DartPad:

https://dartpad.dev/96d51e9f55496f4125ab6697d1a639e4

0

Como você pode notar, o problema é relacionado as constantes.

Você pode resolver deixando seu callback também constante, da seguinte forma:

void onClick() {
  print("Teste");
}

const List<ItemExemplo> itenslist = [
  ItemExemplo(titulo: 'Carro', icon: Icons.directions_car),
  ItemExemplo(titulo: 'Bike', icon: Icons.directions_bike),
  ItemExemplo(titulo: 'Barco', icon: Icons.directions_boat),
  ItemExemplo(
      titulo: 'Ônibux',
      icon: Icons.directions_bus,
      onPressBtn: onClick)
];

Outro ponto que pode ser melhorado é na classe ItensCard:

class ItensCard extends StatelessWidget {
  const ItensCard({Key key, this.item}) : super(key: key);
  final ItemExemplo item;
  @override
  Widget build(BuildContext context) {
    final TextStyle textStyle = Theme.of(context).textTheme.bodyText2;
    return Card(
        color: Colors.white,
        child: InkWell(
          onTap: () => item.onPressBtn(),
          splashColor: Colors.amber,
          child: Center(
            child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Icon(item.icon, size: 80.0, color: textStyle.color),
                  Text(item.titulo, style: textStyle),
                ]),
          ),
        ));
  }
}

Altere o parâmetro onTap() da seguinte forma:

onTap: item.onPressBtn,

Apenas os itens que possuírem a propriedade onPressBtn preenchida terão o efeito de click, assim não irá gerar erros caso a propriedade esteja nula.

4
  • Obrigado por responder, mas isso ainda não ta dando certo, ele resolve na questão quando o callback executa apenas um simples print, mas se eu tento usar outro metodo como um Navigator.of(context).push ele da outro erro de A value of type 'Future<Null>' can't be returned from function 'onClick'. Desculpe minha ignorância sobre esse assunto, ainda estou aprendendo sobre flutter. Commented 25/08/2020 às 18:05
  • Como você disse, resolveu o seu problema, que é o que você tinha dúvidas e estava especificado no teu exemplo. Agora você está enfrentando um outro problema diferente amigo. Commented 25/08/2020 às 18:09
  • Altere a sua pergunta e adicione um exemplo desse problema que você citou referente ao Navigator. Uma dica (Não me leve a mal), quando for fazer perguntas, não oculte informações, ainda não sabemos lidar direito com bolas de cristal xD Commented 25/08/2020 às 18:10
  • 1
    Desculpe amigo, como disse ainda estou aprendendo sobre flutter, pensei que fazer um callback de VoidCallback que fosse usado como onPressBtn num gridview serveria para todos os tipos de callbacks assim como num ontap ou um onpress de qualquer Widget, não sabia q um estilo anularia o outro. Mas fiquei hj o dia todo tentando resolver isso e acho q encontrei uma solução, vou postar jaja. Mesmo assim muito obrigado e me desculpa meus erros. Commented 25/08/2020 às 18:24

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .