web-dev-qa-db-fra.com

ajouter un boxshadow personnalisé à la carte Flutter

J'ai implémenté des cartes dans une application Flutter. J'ai besoin d'un BoxShadow personnalisé pour chaque carte. Comment cela peut-il être fait?

Ce que j'ai essayé jusqu'à présent, c'est d'ajouter la propriété BoxShadow au constructeur Card(), qui ne fonctionne pas ...

6
Nirav Madariya

Le Card Widget n'a pas de propriété de décoration, vous devez donc créer une carte à l'intérieur d'un Container puis appliquer BoxShadow au Container,

Échantillon :

class mycard extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      child: new Card(
        child: new Center(
          child: new Icon(
            Icons.refresh,
            size: 150.0,
          ),
        ),
      ),
      decoration: new BoxDecoration(boxShadow: [
        new BoxShadow(
          color: Colors.black,
          blurRadius: 20.0,
        ),
      ]),
    );
  }
}

enter image description here

14
Raouf Rahiche

Voir le widget Carte

      @override
      Widget build(BuildContext context) {
        return Scaffold(
            backgroundColor: Color(0xFFdde0e3),
            body: SingleChildScrollView(
              child: Container(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    Card(
                      elevation:5,
                      margin: EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 16.0),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(0.0),
                      ),
                      child: Container(
                        height: 200,
                      ),
                    )
                  ],
                ),
              ),
            ));
      }

enter image description here

1
Christer