web-dev-qa-db-fra.com

Image Scale Centre crop sur Flutter?

J'essaie de faire quelque chose de similaire à la propriété centerCrop d'Android ImageView. Définissez la hauteur de la vue image, rognez-la et alignez-la au centre, de la même manière que centerCrop fonctionne sur Android.

 Widget bindItem(BuildContext context, int index) {
return new Card(
    child: new Column(
        children: <Widget>[
          new Image.network(
            _parties[index]["cover"], fit: BoxFit.fitWidth,
            height: 120.0,
          ),
          new Text(_parties[index]['name'])
        ]
    )
);

}

@override
      Widget build(BuildContext context) {
        return new Scaffold(
            appBar: new AppBar(
              title: new Text("Parties"),
            ),
            body: new ListView.builder(
              itemCount: _parties == null ? 0 : _parties.length,
              itemBuilder: bindItem,
            )
        );
      }

Résultat:  enter image description here

4
Boldijar Paul

Android ScaleType et BoxFit doivent correspondre à ceci:

  1. CENTRE = aucun
  2. CENTER_CROP = Couverture
  3. CENTER_INSIDE = scaleDown
  4. FIT_CENTER = contenir (alignment.center)
  5. FIT_END = contenir (alignment.bottomright)
  6. FIT_START = contenir (alignement.topleft)
  7. FIT_XY = Remplir

Vous devez donc utiliser Cover pour obtenir le résultat CENTER_CROP.

MODIFIER: 

Le problème devrait être crossAxisAlignment du widget Column. La définition de cette propriété sur crossAxisAlignment: CrossAxisAlignment.stretch devrait résoudre votre problème.

7
Antonino Cacace
new Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
        new Expanded(child: new Image.network(
            cover.img,fit: BoxFit.fitWidth,
        ),

        ),
        Text(cover.name),
      ]
    )

ça marche pour moi

1
Ala Amarneh
new Center(
                  child: Container(
                    child: new Stack(
                      children: <Widget>[
                        new Image.asset(
                          'assets/images/firebase1.png',
                          width: 100.0,
                          height: 100.0,
                        ),
                      ],
                    ),
                  ),
                ),
0
BloodLoss