107 lines
3.4 KiB
QML
107 lines
3.4 KiB
QML
import QtQuick 2.15
|
|
|
|
|
|
// Lista orizzontale di utenti con avatar, in stile costruttivista.
|
|
// Usa il modello `userModel` esposto da SDDM (ruoli: name, realName, icon, isCurrent).
|
|
Row {
|
|
|
|
FontLoader {
|
|
id: themeFont
|
|
source: "assets/fonts/RussoOne-Regular.ttf"
|
|
}
|
|
|
|
id: userList
|
|
property int currentIndex: userModel.lastIndex >= 0 ? userModel.lastIndex : 0
|
|
signal userSelected(string name)
|
|
spacing: Math.max(8, parent.width * 0.02)
|
|
|
|
Repeater {
|
|
id: repeater
|
|
model: userModel
|
|
|
|
delegate: Rectangle {
|
|
id: card
|
|
required property int index
|
|
required property string name
|
|
required property string icon
|
|
|
|
width: 80
|
|
height: 100
|
|
color: userList.currentIndex === index ? "#33d83a28" : "#cc101012"
|
|
border.color: userList.currentIndex === index ? "#d83a28" : "#66f0dfba"
|
|
border.width: userList.currentIndex === index ? 2 : 1
|
|
|
|
// cornice circolare con avatar
|
|
Rectangle {
|
|
id: avatarFrame
|
|
width: 54
|
|
height: 54
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
anchors.top: parent.top
|
|
anchors.topMargin: 7
|
|
radius: width / 2
|
|
color: "#181719"
|
|
border.color: "#f0dfba"
|
|
border.width: 2
|
|
clip: true
|
|
|
|
Image {
|
|
id: avatarImage
|
|
anchors.fill: parent
|
|
anchors.margins: 2
|
|
source: card.icon
|
|
fillMode: Image.PreserveAspectCrop
|
|
sourceSize: Qt.size(108, 108)
|
|
asynchronous: true
|
|
}
|
|
|
|
// fallback geometrico se l'avatar non è disponibile
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: card.name.length > 0 ? card.name.charAt(0).toUpperCase() : "?"
|
|
color: "#f0dfba"
|
|
font.family: themeFont.name
|
|
font.pixelSize: 22
|
|
font.bold: true
|
|
visible: avatarImage.status !== Image.Ready
|
|
}
|
|
}
|
|
|
|
// nome utente
|
|
Text {
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
anchors.bottom: parent.bottom
|
|
anchors.bottomMargin: 6
|
|
width: card.width - 6
|
|
horizontalAlignment: Text.AlignHCenter
|
|
elide: Text.ElideRight
|
|
text: card.name.toUpperCase()
|
|
color: userList.currentIndex === index ? "#f6f1e5" : "#f0dfba"
|
|
font.family: themeFont.name
|
|
font.pixelSize: 11
|
|
font.bold: true
|
|
font.letterSpacing: 1
|
|
}
|
|
|
|
MouseArea {
|
|
anchors.fill: parent
|
|
hoverEnabled: true
|
|
onClicked: userList.select(index)
|
|
}
|
|
}
|
|
}
|
|
|
|
// Seleziona l'utente all'indice i (click o tastiera).
|
|
function select(i) {
|
|
if (i < 0 || i >= userModel.count) return
|
|
currentIndex = i
|
|
var item = repeater.itemAt(i)
|
|
if (item) {
|
|
userSelected(item.name)
|
|
}
|
|
}
|
|
|
|
Keys.onLeftPressed: select(currentIndex - 1)
|
|
Keys.onRightPressed: select(currentIndex + 1)
|
|
}
|