Skip to content

Commit 1c119fe

Browse files
emericgemericg
committed
Add missing ComboBoxMedia QML component
1 parent 21fafe3 commit 1c119fe

File tree

2 files changed

+187
-0
lines changed

2 files changed

+187
-0
lines changed

‎qml/MediaInfos_row.qml‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,11 +113,38 @@ Item {
113113

114114
////////////////////////////////////////////////////////////////////////////
115115

116+
ComboBoxMedia {
117+
id: mediaCombobox
118+
119+
anchors.top: parent.top
120+
anchors.left: parent.left
121+
anchors.right: parent.right
122+
anchors.margins: Theme.componentMargin
123+
124+
visible: mediaManager.mediaAvailable
125+
126+
model: mediaManager.mediaList
127+
displayText: mediaManager.mediaList[currentIndex].fullpath
128+
}
129+
130+
////////////////////////////////////////////////////////////////////////////
131+
116132
ScrollView {
117133
id: scrollView
118134
anchors.fill: parent
135+
anchors.topMargin: 64
136+
119137
contentHeight: -1
120138

139+
ScrollBar.horizontal: ScrollBarThemed {
140+
parent: scrollView
141+
policy: ScrollBar.AlwaysOn
142+
x: scrollView.leftPadding
143+
y: scrollView.height - height
144+
width: scrollView.availableWidth
145+
active: scrollView.ScrollBar.vertical.active
146+
}
147+
121148
Row {
122149
id: row
123150
anchors.top: parent.top

‎qml/components/ComboBoxMedia.qml‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
import QtQuick
2+
import QtQuick.Controls.impl
3+
import QtQuick.Templates as T
4+
5+
import ComponentLibrary
6+
7+
T.ComboBox {
8+
id: control
9+
10+
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
11+
implicitContentWidth + leftPadding + rightPadding)
12+
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
13+
implicitContentHeight + topPadding + bottomPadding,
14+
implicitIndicatorHeight + topPadding + bottomPadding)
15+
16+
leftPadding: 16
17+
rightPadding: 16
18+
19+
font.pixelSize: Theme.componentFontSize
20+
21+
////////////////
22+
23+
background: Rectangle {
24+
implicitWidth: 200
25+
implicitHeight: Theme.componentHeight
26+
27+
radius: Theme.componentRadius
28+
opacity: control.enabled ? 1 : 0.66
29+
color: control.down ? Theme.colorComponentDown : Theme.colorComponent
30+
border.width: 2
31+
border.color: Theme.colorComponentBorder
32+
}
33+
34+
////////////////
35+
36+
contentItem: Text {
37+
IconSvg {
38+
width: 24
39+
height: 24
40+
anchors.verticalCenter: parent.verticalCenter
41+
color: Theme.colorIcon
42+
source: {
43+
if (mediaManager.mediaAvailable) {
44+
if (mediaManager.mediaList[currentIndex].fileType == 1)
45+
return "qrc:/IconLibrary/material-symbols/media/album.svg"
46+
if (mediaManager.mediaList[currentIndex].fileType == 2)
47+
return "qrc:/IconLibrary/material-symbols/media/movie.svg"
48+
if (mediaManager.mediaList[currentIndex].fileType == 3)
49+
return "qrc:/IconLibrary/material-symbols/media/panorama.svg"
50+
}
51+
return "qrc:/IconLibrary/material-symbols/media/movie.svg"
52+
}
53+
}
54+
leftPadding: 24 + control.leftPadding
55+
56+
text: control.displayText
57+
textFormat: Text.PlainText
58+
59+
font: control.font
60+
elide: Text.ElideRight
61+
verticalAlignment: Text.AlignVCenter
62+
63+
opacity: control.enabled ? 1 : 0.66
64+
color: Theme.colorComponentContent
65+
}
66+
67+
////////////////
68+
69+
indicator: Canvas {
70+
x: control.width - width - control.rightPadding
71+
y: control.topPadding + ((control.availableHeight - height) / 2)
72+
width: 12
73+
height: 8
74+
opacity: control.enabled ? 1 : 0.66
75+
rotation: control.popup.visible ? 180 : 0
76+
77+
Connections {
78+
target: Theme
79+
function onCurrentThemeChanged() { indicator.requestPaint() }
80+
}
81+
82+
onPaint: {
83+
var ctx = getContext("2d")
84+
ctx.reset()
85+
ctx.moveTo(0, 0)
86+
ctx.lineTo(width, 0)
87+
ctx.lineTo(width / 2, height)
88+
ctx.closePath()
89+
ctx.fillStyle = Theme.colorIcon
90+
ctx.fill()
91+
}
92+
}
93+
94+
////////////////
95+
96+
delegate: T.ItemDelegate {
97+
width: control.width - 2
98+
height: control.height
99+
highlighted: (control.highlightedIndex === index)
100+
101+
background: Rectangle {
102+
implicitWidth: 200
103+
implicitHeight: Theme.componentHeight
104+
105+
radius: Theme.componentRadius
106+
color: highlighted ? "#F6F6F6" : "white"
107+
}
108+
109+
contentItem: Text {
110+
IconSvg {
111+
x: control.leftPadding
112+
anchors.verticalCenter: parent.verticalCenter
113+
width: 24
114+
height: 24
115+
116+
color: Theme.colorIcon
117+
source: {
118+
if (modelData.fileType == 1)
119+
return "qrc:/IconLibrary/material-symbols/media/album.svg"
120+
if (modelData.fileType == 3)
121+
return "qrc:/IconLibrary/material-symbols/media/panorama.svg"
122+
return "qrc:/IconLibrary/material-symbols/media/movie.svg"
123+
}
124+
}
125+
126+
leftPadding: control.leftPadding + 24 + 8
127+
rightPadding: control.rightPadding
128+
text: modelData.fullpath
129+
color: highlighted ? "black" : Theme.colorSubText
130+
font.pixelSize: Theme.componentFontSize
131+
elide: Text.ElideRight
132+
verticalAlignment: Text.AlignVCenter
133+
}
134+
}
135+
136+
////////////////
137+
138+
popup: T.Popup {
139+
y: control.height - 1
140+
width: control.width
141+
implicitHeight: (contentItem.implicitHeight) ? contentItem.implicitHeight + 2 : 0
142+
padding: 1
143+
144+
contentItem: ListView {
145+
implicitHeight: contentHeight
146+
clip: true
147+
currentIndex: control.highlightedIndex
148+
model: control.popup.visible ? control.delegateModel : null
149+
}
150+
151+
background: Rectangle {
152+
radius: Theme.componentRadius
153+
color: "white"
154+
border.color: Theme.colorComponentBorder
155+
border.width: control.visualFocus ? 0 : 1
156+
}
157+
}
158+
159+
////////////////
160+
}

0 commit comments

Comments
 (0)