英文:
QML: Elements bouncing in customized ComboBox on mouse cursor
问题
我的任务是创建带有图像的ComboBox。我尝试根据Qt的文档自定义ComboBox。它可以正常工作,但当你用鼠标指向元素时,它会水平弹跳。我希望它保持静态。这是我的实现:
ComboBox {
Component.onCompleted: {
// 这里执行一些与索引相关的操作
}
id: languageComboBox
contentItem: Image {
id: countryFlag
anchors.left: parent.left
anchors.leftMargin: 5
horizontalAlignment: Image.AlignLeft
smooth: false
antialiasing: false
sourceSize: Qt.size(40, 20)
fillMode: Image.Pad
}
delegate: ItemDelegate {
contentItem: Image {
id: currentFlag
anchors.left: parent.left
anchors.leftMargin: 5
horizontalAlignment: Image.AlignLeft
sourceSize: Qt.size(40, 20)
smooth: false
antialiasing: false
opacity: 1.0
fillMode: Image.Pad
source: imgSource
}
highlighted: languageComboBox.highlightedIndex === index
}
popup: Popup {
y: languageComboBox.height - 1
width: languageComboBox.width
implicitHeight: contentItem.implicitHeight
padding: 1
contentItem: ListView {
implicitHeight: contentHeight
clip: true
model: languageComboBox.popup.visible ? languageComboBox.delegateModel : null
currentIndex: languageComboBox.highlightedIndex
boundsBehavior: Flickable.StopAtBounds
}
}
model: ListModel {
// 这里有用于更改图像源和其他内容的元素数据
}
onActivated: {
// 当激活时执行一些操作
}
}
从我理解的情况来看,问题可能出在Popup
或ListView
上。我完全不知道如何解决它。我尝试了boundsBehavior: Flickable.StopAtBounds
,但没有效果。
这可能看起来有点生疏。这是我找到的第一个实现查看图像的解决方案。
编辑
我已经测试了Qt提供的示例 - 其中的元素(文本)也会在鼠标悬停时弹跳!
英文:
My task is to make ComboBox with images. I have tried to implement ComboBox customization from Qt documentation. It's works well, but when you point an element with mouse cursor it bouncing horizontally. I want it static look. Here is my implementation:
ComboBox {
Component.onCompleted: {
//Some actions with index here
}
id: languageComboBox
contentItem: Image {
id: countryFlag
anchors.left: parent.left
anchors.leftMargin: 5
horizontalAlignment: Image.AlignLeft
smooth: false
antialiasing: false
sourceSize: Qt.size(40, 20)
fillMode: Image.Pad
}
delegate: ItemDelegate {
contentItem: Image {
id: currentFlag
anchors.left: parent.left
anchors.leftMargin: 5
horizontalAlignment: Image.AlignLeft
sourceSize: Qt.size(40, 20)
smooth: false
antialiasing: false
opacity: 1.0
fillMode: Image.Pad
source: imgSource
}
highlighted: languageComboBox.highlightedIndex === index
}
popup: Popup {
y: languageComboBox.height - 1
width: languageComboBox.width
implicitHeight: contentItem.implicitHeight
padding: 1
contentItem: ListView {
implicitHeight: contentHeight
clip: true
model: languageComboBox.popup.visible ? languageComboBox.delegateModel : null
currentIndex: languageComboBox.highlightedIndex
boundsBehavior: Flickable.StopAtBounds
}
}
model: ListModel {
// There is data in elements I use to change image source and other
}
onActivated : {
// Some actions on activated
}
}
As I understand, there is troubles with Popup
or ListView
. And absolutely have no idea how to fix it. I'm tried boundsBehavior: Flickable.StopAtBounds
but it have no effect on this.
It's may seem rusty. This is first solution I found to implement possibility to see images in
EDIT
I have tested example provided from Qt - it's elements (text) is bouncing on mouse too!
答案1
得分: 0
只需在Popup
中的您的ListView
上添加锚点。使用anchors.fill: parent
。
因此,您的弹出窗口将如下所示:
popup: Popup {
y: languageComboBox.height - 1
implicitWidth: languageComboBox.width
implicitHeight: contentItem.implicitHeight
padding: 1
contentItem: ListView {
implicitHeight: contentHeight
clip: true
anchors.fill: parent
model: languageComboBox.popup.visible ? languageComboBox.delegateModel : null
currentIndex: languageComboBox.highlightedIndex
boundsBehavior: Flickable.StopAtBounds
}
}
英文:
Just add anchors to your ListView
in Popup
. Use anchors.fill: parent
.
So your popup would look like this:
popup: Popup {
y: languageComboBox.height - 1
implicitWidth: languageComboBox.width
implicitHeight: contentItem.implicitHeight
padding: 1
contentItem: ListView {
implicitHeight: contentHeight
clip: true
anchors.fill: parent
model: languageComboBox.popup.visible ? languageComboBox.delegateModel : null
currentIndex: languageComboBox.highlightedIndex
boundsBehavior: Flickable.StopAtBounds
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论