ESCA111/neochat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify room list tab bar.

Browse Source
This commit is contained in:
Black Hat
2019-07-14 21:39:58 +08:00
parent 0792f587d0
commit eb6f15335e
1 changed files with 26 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
imports/Spectral/Panel/RoomListPanel.qml
View File

@@ -361,187 +361,59 @@ Item {
contentItem: RowLayout { contentItem: RowLayout {
id: tabBar id: tabBar
spacing: 8 MaterialIcon {
Layout.fillWidth: true
Control { icon: "\ue7f5"
readonly property bool highlighted: filter === 0 color: filter == 0 ? MPalette.accent : MPalette.lighter
Layout.fillWidth: highlighted MouseArea {
Layout.fillHeight: true
id: newTabControl
horizontalPadding: 8
background: Rectangle {
visible: newTabControl.highlighted
color: Material.accent
border.color: Material.accent
border.width: 2
radius: height / 2
}
contentItem: RowLayout {
spacing: 0
MaterialIcon {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
icon: "\ue7f5"
color: newTabControl.highlighted ? "white" : MPalette.lighter
Rectangle {
anchors.right: parent.right
anchors.top: parent.top
visible: roomListModel.notificationCount > 0
width: 12
height: 12
radius: 6
color: "white"
Rectangle {
anchors.centerIn: parent
width: 8
height: 8
radius: 4
color: "red"
}
}
}
Label {
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
visible: newTabControl.highlighted
text: "New"
color: "white"
horizontalAlignment: Text.AlignHCenter
}
}
RippleEffect {
anchors.fill: parent anchors.fill: parent
circular: true
onClicked: filter = 0 onClicked: filter = 0
} }
} }
Control { MaterialIcon {
readonly property bool highlighted: filter === 1 Layout.fillWidth: true
Layout.fillWidth: highlighted icon: "\ue7ff"
Layout.fillHeight: true color: filter == 1 ? MPalette.accent : MPalette.lighter
id: peopleTabControl MouseArea {
horizontalPadding: 8
background: Rectangle {
visible: peopleTabControl.highlighted
color: Material.accent
border.color: Material.accent
border.width: 2
radius: height / 2
}
contentItem: RowLayout {
spacing: 0
MaterialIcon {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
icon: "\ue7ff"
color: peopleTabControl.highlighted ? "white" : MPalette.lighter
}
Label {
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
visible: peopleTabControl.highlighted
text: "People"
color: "white"
horizontalAlignment: Text.AlignHCenter
}
}
RippleEffect {
anchors.fill: parent anchors.fill: parent
circular: true
onClicked: filter = 1 onClicked: filter = 1
} }
} }
Control { MaterialIcon {
readonly property bool highlighted: filter === 2 Layout.fillWidth: true
Layout.fillWidth: highlighted icon: "\ue7fc"
Layout.fillHeight: true color: filter == 2 ? MPalette.accent : MPalette.lighter
id: groupTabControl MouseArea {
horizontalPadding: 8
background: Rectangle {
visible: groupTabControl.highlighted
color: Material.accent
border.color: Material.accent
border.width: 2
radius: height / 2
}
contentItem: RowLayout {
spacing: 0
MaterialIcon {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
icon: "\ue7fc"
color: groupTabControl.highlighted ? "white" : MPalette.lighter
}
Label {
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
visible: groupTabControl.highlighted
text: "Group"
color: "white"
horizontalAlignment: Text.AlignHCenter
}
}
RippleEffect {
anchors.fill: parent anchors.fill: parent
circular: true
onClicked: filter = 2 onClicked: filter = 2
} }
} }
} }
background: Rectangle { background: AutoRectangle {
color: MSettings.darkTheme ? "#303030" : "#fafafa" color: MPalette.background
radius: 24 radius: 24
topLeftRadius: 8
topRightRadius: 8
topLeftVisible: true
topRightVisible: true
bottomLeftVisible: false
bottomRightVisible: false
layer.enabled: true layer.enabled: true
layer.effect: ElevationEffect { layer.effect: ElevationEffect {
elevation: 1 elevation: 1