調整QML圖像顯示大小

我有一個嵌套RowLayout的QML窗口。在內排我有兩個圖像。這些圖像的源文件（有意）是相當大的。當我試圖設置這些圖像上的height屬性以使它們變小時，它們仍然很大。調整QML圖像顯示大小

所需的外觀：

實際外觀：

我已經能夠讓他們小的唯一方法是設置sourceSize.height:100而不是height:100;然而，這不是我想要的。我希望他們能夠在不重新加載的情況下進行縮放。

我該如何修復我的QML，以便圖像具有包含RowLayout的高度？

import QtQuick 2.7 
import QtQuick.Controls 2.0 
import QtQuick.Layouts 1.3 

ApplicationWindow { 
    width:600; height:300 
    visible:true 

    Rectangle { 
    color:'red' 
    anchors { top:header.bottom; bottom:footer.top; left:parent.left; right:parent.right } 
    } 

    header:RowLayout { 
    id:header 
    spacing:0 
    height:100; width:parent.width 

    RowLayout { 
     id:playcontrol 
     Layout.minimumWidth:200; Layout.maximumWidth:200; Layout.preferredWidth:200 
     height:parent.height 
     Image { 
     // I really want these to take on the height of their row 
     source:'qrc:/img/play.png' 
     width:100; height:100 
     fillMode:Image.PreserveAspectFit; clip:true 
     } 
     Image { 
     source:'qrc:/img/skip.png' 
     width:100; height:100 
     fillMode:Image.PreserveAspectFit; clip:true 
     } 
    } 

    Rectangle { 
     color:'#80CC00CC' 
     Layout.minimumWidth:200 
     Layout.preferredWidth:parent.width*0.7 
     Layout.fillWidth:true; Layout.fillHeight:true 
     height:parent.height 
    } 
    } 

    footer:Rectangle { height:100; color:'blue' } 
}

來源

2016-08-17 Phrogz

當使用佈局，從未指定width或項目的height;改爲使用Layout附加屬性。佈局本身將設置width和height，有效地覆蓋您設置的任何內容。

所以，爲你的形象，與

Layout.preferredWidth: 100 
Layout.preferredHeight: 100

這是記錄here更換

width:100; height:100

。具體而言，width和height僅用作「最終回退」，並且它們不會像您期望的那樣運行。

有在你的代碼的其他地方發生這種情況：

playcontrol套height: parent.height（填充母的寬度和高度爲default behaviour for layouts，所以這不應該是必要反正）。
Rectangleplaycontrol佈局內也設置height: parent.height。

來源

2016-08-17 09:07:49 Mitch

調整QML圖像顯示大小

回答

相關問題