如何在不影響寬高比的情況下將縱向和橫向圖像顯示在網格上的正方形上？

Question

我正在使用GridView創建一個畫廊我從我的機器上的某個文件夾顯示的圖像。 圖像具有不同的寬*高比。很少有肖像圖像，其中圖像的高度比寬度大3倍。有些圖像是寬度約爲高度3倍的地方。一些圖像被平方。

問題與我的畫廊是我的每個Image組件的每個Image組成部分，你可以看到下面。這使得橫向圖像&得到錯誤拉伸，因爲網格中的每個塊都是正方形。從而導致圖像的高寬比偏斜。

問題： 我怎麼能保證我同時顯示人像&景觀圖片到我的正方形無歪斜寬高比？我正在看一些廣場上的一些黑色/灰色背景，在肖像或風景圖像上留下空白？但可能還有其他的技巧。

代碼：

import QtQuick 2.5 
import Qt.labs.folderlistmodel 2.1 
import QtQuick.Controls 1.1 
import QtQml.Models 2.1 

GridView { 
    cellHeight: height/2 
    cellWidth: width/2 
    clip: true 

    FolderListModel { 
    id: dir_model 
    folder: "/path/to/images/folder" 
    nameFilters: ["*.png"] 
    } 

    Component { 
    id: file_delegate 

    Image { 
     width: (parent.width)/2 
     height: (parent.width)/2 
     source: fileURL 
    } 
    } 

    model: dir_model 
    delegate: file_delegate 
} 

Answer 1

只需設置ImagefillMode屬性Image.PreserveAspectFit 正如醫生說：

圖像均勻縮放以適應不裁剪