Wie man 1/3 eines Bildes macht nehmen Sie den ganzen Bildschirm auf

Question

Ich habe ein Bild Ich möchte schneiden und auf mehreren Bildschirmen anzeigen. Ich möchte, dass ein Drittel des Bildes den ganzen Bildschirm einnimmt.

Bisher kann ich 1/3 des Bildes erhalten mit 1/3 des Bildschirms zu nehmen:

Widget buildBGImage(String imageName) { 
    return new Container(
     decoration: new BoxDecoration(border: new Border.all()), 
     constraints: new BoxConstraints.expand(), 
    child: new SizedBox.expand(
     child: new ClipRect(
      clipper: new WidthClipper(currentPage), 
      child: new Image.asset(
       "assets/images/$imageName", 
       fit: ImageFit.fill) 
    ) 
), 
); 

}

class WidthClipper extends CustomClipper<Rect> { 
    int section; 

    WidthClipper(this.section); 

    @override 
    Rect getClip(Size size) { 
    return new Rect.fromLTWH(
     size.width * (section/3), 0.0, size.width/3, size.height); 
    } 

    @override 
    bool shouldReclip(WidthClipper oldClipper) => true; 
} 

aber Ich zeichne eine Bank, wie man Machen Sie das 1/3 nehmen Sie den gesamten Bildschirm.

Answer 1

Ist das nicht mehr eine Frage, wie die Bilddaten in einen Vollbild Image passen? Was möchten Sie auch tun, wenn das Seitenverhältnis von einem Drittel Ihres Originalbilds nicht zum Seitenverhältnis des Vollbilds passt? Diese

zum Beispiel Displays (grob) das mittlere Drittel der ein Landschaftsbild im Vollbild-Portrait-Modus:

new Image.network(
    "https://upload.wikimedia.org/wikipedia/commons/5/5a/Monument_Valley_2.jpg", 
    fit: ImageFit.fitHeight, 
    alignment: FractionalOffset.center, 
) 

Während alignment: FractionalOffset.centerLeft und alignment: FractionalOffset.centerRight Display (grob) die linke und rechte drei.