Comment puis-je ajouter de l'ombre au widget dans Flutter ?

Question

Comment puis-je ajouter une ombre au widget comme sur l'image ci-dessous?

Ceci est mon code de widget actuel.

Answer 1

class ShadowContainer extends StatelessWidget {
  ShadowContainer({
    Key key,
    this.margin = const EdgeInsets.fromLTRB(0, 10, 0, 8),
    this.padding = const EdgeInsets.symmetric(horizontal: 8),
    this.circular = 4,
    this.shadowColor = const Color.fromARGB(
        128, 158, 158, 158), //Colors.grey.withOpacity(0.5),
    this.backgroundColor = Colors.white,
    this.spreadRadius = 1,
    this.blurRadius = 3,
    this.offset = const Offset(0, 1),
    @required this.child,
  }) : super(key: key);

  final Widget child;
  final EdgeInsetsGeometry margin;
  final EdgeInsetsGeometry padding;
  final double circular;
  final Color shadowColor;
  final double spreadRadius;
  final double blurRadius;
  final Offset offset;
  final Color backgroundColor;

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: margin,
      padding: padding,
      decoration: BoxDecoration(
        color: backgroundColor,
        borderRadius: BorderRadius.circular(circular),
        boxShadow: [
          BoxShadow(
            color: shadowColor,
            spreadRadius: spreadRadius,
            blurRadius: blurRadius,
            offset: offset,
          ),
        ],
      ),
      child: child,
    );
  }
}

Answer 2

Peut-être que c'est suffisant si vous enveloppez un Card autour du Widget et jouez un peu avec la propriété elevation.

J'utilise ce truc pour rendre mon ListTile plus joli dans les Lists.

Pour votre code, cela pourrait ressembler à ceci :

return Card(
   elevation: 3, // JOUEZ AVEC CETTE VALEUR 
   child: Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
         // ... PLUS DE VOTRE CODE 
      ],
   ),
);

Answer 3

Enveloppez votre widget dans un conteneur et attribuez-lui une liste d'ombres de boîtes.