0
votes

Flutter Comment changer de couleur en fonction du statut de l'API JSON

Je veux changer de couleur de boîte dynamique en fonction de l'état dans une API JSON. Par exemple, approuvé = couleurs.green, rejeté = couleurs.red, soumis = couleurs.blue.

C'est l'image de mon application actuelle Je souligne le statut p>

Comment peut-il y parvenir? p>

C'est comme ça que je reçois l'API: P>

 Widget _buildEventList() {
    return ListView(
      children: _selectedEvents
          .map((event) => Container(
                decoration: BoxDecoration(
                  color: Colors.blue, // i want to change the color
                  border: Border.all(width: 0.8),
                  borderRadius: BorderRadius.circular(12.0),
                ),
                margin: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
                child: ListTile(
                  title: Text(event.toString()),
                  onTap: () => print('$event tapped!'),
                ),
              ))
          .toList(),
    );
  }

flutter dart json flutter-layout

0 commentaires

4 Réponses :

4
votes

Vous pouvez créer une méthode pour renvoyer la couleur en fonction de la condition (en supposant événement.tostring () = rejeté code>, approuvé code> ou soumis code>) :

Color _getColorByEvent(String event) {
  if (event == "Approved") return Colors.green;
  if (event == "Rejected") return Colors.red;
  return Colors.blue;
}

...

BoxDecoration(
                color: _getColorByEvent(event.toString()), // i want to change the color
                border: Border.all(width: 0.8),
                borderRadius: BorderRadius.circular(12.0),
              ),

0 commentaires

0
votes

Méthode d'appel de couleur par exemple

 return ListView(
children: _selectedEvents
    .map((event) => Container(
          decoration: BoxDecoration(
            color: Colors.blue, // i want to change the color
            border: Border.all(width: 0.8),
            borderRadius: BorderRadius.circular(12.0),
          ),
          margin: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
          child: ListTile(
            title: Text(event.toString()),
            onTap: () => print('$event tapped!'),
          ),
        ))
    .toList(),
  );

}

Color _getColor(Map event){ swith(event) { return value } }

0 commentaires

0
votes

Créer une paire de clé de clé de carte, comme ceci. xxx

puis passe la touche pour mapper que vous obtiendrez une valeur correspondante à la clé correspondante.

0 commentaires

0
votes

C'est comme ça que j'ai fait ...

Color getColorForStatus(OrderStatus event) {
      switch (event) {
        case OrderStatus.PLACED:
          return Colors.black;
          break;
        case OrderStatus.ORDER_CONFIRMED:
          return Colors.lightBlue;
          break;
        case OrderStatus.OUT_FOR_DELIVERY:
          return new Color(0xFFE5AC0E);
          break;
        case OrderStatus.DELIVERED:
          return Colors.green;
          break;
        case OrderStatus.PAYMENT_DECLINED:
          return new Color(0xFFFFA401);
          break;
        case OrderStatus.CANCELED:
          return Colors.red;
          break;
        default:
          return Colors.black;
          break;
      }
    }

0 commentaires