Prepare player and settings, create branding

This commit is contained in:
Dark Steveneq
2025-10-12 03:10:14 +02:00
parent 7b6e749bca
commit e54a3182a3
15 changed files with 270 additions and 68 deletions

View File

@@ -17,6 +17,8 @@ qt_add_qml_module(appqyouradio
VERSION 1.0
QML_FILES
Main.qml
ViewPlayer.qml
ViewSettings.qml
)
# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.

View File

@@ -1,5 +1,8 @@
import QtQuick 6.8
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
import QtQuick.Layouts 6.8
import QYRComponents 1.0
ApplicationWindow {
@@ -7,52 +10,45 @@ ApplicationWindow {
height: 800
title: qsTr("Hello World")
header: Rectangle {
color: Colors.surface1
width: children.width
height: children.height
ColumnLayout {
anchors.fill: parent
anchors.margins: 10
RowLayout {
anchors.fill: parent
Label {
Layout.fillWidth: true
heading: "h2"
text: "QYouRadio"
font.bold: true
}
Button {
Layout.alignment: Qt.AlignVCenter
TabBar {
id: tabbar
Layout.fillWidth: true
spacing: 10
TabButton {
text: qsTr("Autoradio")
}
Button {
Layout.alignment: Qt.AlignVCenter
text: qsTr("Live Radio")
TabButton {
text: qsTr("Live Mix")
}
Button {
Layout.alignment: Qt.AlignVCenter
TabButton {
text: qsTr("Deep Bass")
}
TabButton {
text: qsTr("Settings")
}
}
}
ColumnLayout {
anchors.fill: parent
StackLayout {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: 10
Button {
text: qsTr("Settings")
}
CheckBox {}
Slider {
from: 0.0
value: 0.5
stepSize: 0.1
to: 1.1
currentIndex: tabbar.currentIndex
ViewPlayer {
title: qsTr("Autoradio")
}
ViewPlayer {
title: qsTr("Live Radio")
}
ViewPlayer {
title: qsTr("Deep Bass")
}
ViewSettings {
}
}
}
}

View File

@@ -1,8 +1,8 @@
import QtQuick 6.8
import QtQuick.Controls 6.8 as QC
import QtQuick.Controls.Basic as QC
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
QC.ApplicationWindow {
ApplicationWindow {
visible: true
background: Rectangle {

View File

@@ -1,21 +1,24 @@
import QtQuick 6.8
import QtQuick.Controls 6.8 as QC
import QtQuick.Controls.Basic as QC
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
QC.Button {
// highlighted: true
background: Rectangle {
color: hovered ? Colors.primaryAlt : Colors.primary
radius: 5
}
// width: player.playing ? 60 : 56
Button {
implicitHeight: 36
contentItem: Text {
text: parent.text
font.family: Colors.fontFamily
font.pointSize: Colors.fontSize.base
opacity: enabled ? 1.0 : 0.3
color: Colors.text;
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
Component.onCompleted: {
contentItem.color = Colors.text;
font.family = Colors.fontFamily;
font.pointSize = Colors.fontSize.base;
background: Rectangle {
color: parent.hovered ? Colors.primaryAlt : Colors.primary
opacity: enabled ? 1 : 0.3
radius: 5
}
}

View File

@@ -22,6 +22,7 @@ qt_add_qml_module(QYRComponents
QML_FILES CheckBox.qml
QML_FILES Slider.qml
QML_FILES Label.qml
QML_FILES TabButton.qml
# SOURCES qyrcomponents.cpp qyrcomponents.h
)

View File

@@ -1,15 +1,15 @@
import QtQuick 6.8
import QtQuick.Controls 6.8 as QC
import QtQuick.Controls.Basic as QC
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
QC.CheckBox {
CheckBox {
implicitWidth: 14
implicitHeight: 14
contentItem: Rectangle {
anchors.fill: parent
radius: 2
color: parent.checked ? (parent.hovered ? Colors.primaryAlt : Colors.primary) : "#fff"
border.color: parent.checked ? (parent.hovered ? Colors.primaryAlt : Colors.primary) : "#fff"
border.color: parent.checked ? (parent.hovered ? Colors.primaryAlt : Colors.primary) : "#000"
border.width: 1
}
}

View File

@@ -10,6 +10,8 @@ Item {
text: "#1f1f1f",
primary: "#007bff",
primaryAlt: "#0056b3",
secondary: "#009eff",
secondaryAlt: "#0076b3",
surface1: "#323232",
surface0: "#282828",
background: "#f4f4f4"
@@ -19,6 +21,8 @@ Item {
text: "#f4f4f4",
primary: "#007bff",
primaryAlt: "#0056b3",
secondary: "#009eff",
secondaryAlt: "#0076b3",
surface1: "#323232",
surface0: "#282828",
background: "#1f1f1f"
@@ -43,6 +47,8 @@ Item {
readonly property string text: currentTheme.text
readonly property string primary: currentTheme.primary
readonly property string primaryAlt: currentTheme.primaryAlt
readonly property string secondary: currentTheme.secondary
readonly property string secondaryAlt: currentTheme.secondaryAlt
readonly property string surface1: currentTheme.surface1
readonly property string surface0: currentTheme.surface0
readonly property string background: currentTheme.background

View File

@@ -1,8 +1,8 @@
import QtQuick 6.8
import QtQuick.Controls 6.8 as QC
import QtQuick.Controls.Basic as QC
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
QC.Label {
Label {
property string heading: "base"
font.family: Colors.fontFamily

View File

@@ -1,8 +1,8 @@
import QtQuick 6.8
import QtQuick.Controls 6.8 as QC
import QtQuick.Controls.Basic as QC
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
QC.Slider {
Slider {
snapMode: Slider.SnapAlways
implicitWidth: 130

View File

@@ -0,0 +1,26 @@
import QtQuick 6.8
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
TabButton {
leftPadding: 5
rightPadding: 5
implicitHeight: 36
contentItem: Text {
text: parent.text
font.family: Colors.fontFamily
font.pointSize: Colors.fontSize.base
opacity: enabled ? 1.0 : 0.3
color: Colors.text;
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
background: Rectangle {
color: checked ? (parent.hovered ? Colors.secondaryAlt : Colors.secondary) : (parent.hovered ? Colors.primaryAlt : Colors.primary)
opacity: enabled ? 1 : 0.3
radius: 5
}
}

View File

@@ -1,4 +0,0 @@
module QYRComponents
Button 1.0 Button.qml
singleton Colors 1.0 Colors.qml

81
ViewPlayer.qml Normal file
View File

@@ -0,0 +1,81 @@
import QtQuick 6.8
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
import QtQuick.Layouts 6.8
import QYRComponents 1.0
ColumnLayout {
Layout.alignment: Qt.AlignVCenter
Layout.fillWidth: true
property string title: ""
property string streamURL: ""
property string metaURL: ""
Label {
Layout.fillWidth: true
Layout.bottomMargin: 20
text: title
heading: "h2"
horizontalAlignment: Text.AlignHCenter
}
Label {
Layout.fillWidth: true
text: "Title: "
heading: "h3"
horizontalAlignment: Text.AlignHCenter
}
Label {
Layout.fillWidth: true
text: "Artist: "
heading: "h3"
horizontalAlignment: Text.AlignHCenter
}
Label {
Layout.fillWidth: true
text: "Genre: "
heading: "h3"
horizontalAlignment: Text.AlignHCenter
}
Label {
Layout.fillWidth: true
text: "Bitrate: " + " kbps"
heading: "h3"
horizontalAlignment: Text.AlignHCenter
}
Label {
Layout.fillWidth: true
text: "Listeners: "
heading: "h3"
horizontalAlignment: Text.AlignHCenter
}
RowLayout {
Layout.fillWidth: false
Layout.topMargin: 20
Layout.alignment: Qt.AlignHCenter
width: 220
Button {
Layout.rightMargin: 5
text: "Play"
}
Slider {
Layout.fillWidth: true
Layout.leftMargin: 5
from: 0.1
to: 1.1
stepSize: 0.1
}
}
Item {
Layout.fillHeight: true
}
}

48
ViewSettings.qml Normal file
View File

@@ -0,0 +1,48 @@
import QtQuick 6.8
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
import QtQuick.Layouts 6.8
import QYRComponents 1.0
RowLayout {
// Layout.leftMargin: parent.width * 2
// Layout.rightMargin: parent.width * 2
TabBar {
id: settingsCategory
Layout.fillHeight: true
spacing: 10
contentItem: ListView {
model: settingsCategory.contentModel
currentIndex: settingsCategory.currentIndex
spacing: settingsCategory.spacing
orientation: ListView.Vertical
boundsBehavior: Flickable.StopAtBounds
flickableDirection: Flickable.AutoFlickIfNeeded
snapMode: ListView.SnapToItem
highlightMoveDuration: 0
highlightRangeMode: ListView.ApplyRange
preferredHighlightBegin: 40
preferredHighlightEnd: width - 40
}
TabButton {
text: qsTr("Appearance")
width: 284
}
TabButton {
text: qsTr("About")
width: 284
}
}
StackLayout {
Layout.fillWidth: true
Layout.fillHeight: true
}
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB