Me gustaría generar una lista desplazable horizontal usando un color diferente para cada elemento de la lista. Sin el 'bucle' proporcionado por ListView.builder, puedo definir una muestra de color usando Colors.red, para obtener el color rojo, por ejemplo.

El indicador de 'propiedad' del objeto Colors no funciona usando el método que probé a continuación, usando los nombres de muestra en el tipo de String.

¿Cuál es el tipo correcto para usar?

import 'package:flutter/material.dart';

class SubscriptionFilter extends StatelessWidget {

  final List<String> colors = <String>['red', 'blue', 'green', 'yellow', 'orange'];

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 20.0),
      height: 75.0,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: colors.length,
        itemBuilder: (BuildContext context, int index) {
          return Container(
            width: 100.0,
            color: Colors[index],
          );
        }
    ),
    );
  }
}
0
Matthijs 18 dic. 2019 a las 17:50

2 respuestas

La mejor respuesta

Pasar colores como 'rojo' o 'azul' no funcionará, debe modificar el código como se muestra a continuación.

class SubscriptionFilter extends StatelessWidget  {

  final List<Color> colors = <Color>[Colors.red, Colors.blue,Colors.amber];

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 20.0),
      height: 75.0,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: colors.length,
        itemBuilder: (BuildContext context, int index) {
          return Container(
            width: 100.0,
            color: colors[index],
          );
        }
    ),
    );
  }
}
2
Ravinder Kumar 18 dic. 2019 a las 15:01
  1. Cambiar lista a lista
  2. Use colores [índice] y no Colores [índice] y funcionará para usted.

El siguiente es el código de trabajo para su referencia:

import 'package:flutter/material.dart';

class SubscriptionFilter extends StatelessWidget {

  final List<Color> colors = <Color>[Colors.red, Colors.blue, Colors.green, Colors.yellow, Colors.orange];

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 20.0),
      height: 75.0,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: colors.length,
        itemBuilder: (BuildContext context, int index) {
          return Container(
            width: 100.0,
            color: colors[index],
          );
        }
    ),
    );
  }
}
0
Kalpesh Kundanani 18 dic. 2019 a las 19:09