Skip to content

Commit a942a90

Browse files
adesh777adesh777
committed
list Added on settings page and home
1 parent bd24e77 commit a942a90

File tree

6 files changed

+291
-1
lines changed

6 files changed

+291
-1
lines changed

‎GameScreens/HomeScreen.qml

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,88 @@
11
import QtQuick 2.15
22
import QtQuick.Layouts 1.3
3+
import QtQuick.Controls 2.15
34
import "./"
45
import "../ScreensComponents"
6+
import "../Settings"
57
ScreenPage{
68
anchors.fill: parent
79
property int buttonWidth:root.width *0.20
810
property int buttonHeight:root.height *0.25
11+
SplitView {
12+
id: splitView
13+
anchors.fill: parent
14+
orientation: Qt.Horizontal
15+
16+
handle: Item {
17+
implicitWidth: 3
18+
height: parent.height
19+
MouseArea {
20+
id:mouseRegion
21+
anchors.fill: parent
22+
hoverEnabled: true
23+
onHoveredChanged: {
24+
if(containsMouse){
25+
colorLayer.color = "blue"
26+
}else{
27+
colorLayer.color = mainRect.color
28+
}
29+
}
30+
Rectangle {
31+
id:colorLayer
32+
anchors.fill: parent
33+
color: mainRect.color
34+
}
35+
}
36+
}
37+
38+
Rectangle {
39+
id: mainRect
40+
color: "#dde4de"
41+
SplitView.preferredWidth: 250
42+
SplitView.maximumWidth: 300
43+
SplitView.minimumWidth: 250
44+
ListView{
45+
id:listItemView
46+
anchors.fill: parent
47+
anchors.margins: 10
48+
focus: true
49+
highlightFollowsCurrentItem :true
50+
highlight: Rectangle
51+
{
52+
width: parent.height * 0.7
53+
height: parent.height * 0.7
54+
Layout.alignment: Qt.AlignVCenter
55+
Layout.leftMargin: 10
56+
radius: 8
57+
color:"blue"
58+
opacity: 0.7
59+
focus: true
60+
}
61+
62+
model: SideListModel{}
63+
delegate: SideListDelegate{
64+
width: listItemView.width
65+
iconRectIcon: iconName
66+
iconRectColor: iconColor
67+
onClicked:{
68+
ListView.view.currentIndex = index
69+
}
70+
}
71+
}
72+
}
73+
74+
Rectangle {
75+
id: collapsibleRect
76+
SplitView.fillWidth: true
77+
color: "#fafbfb"
78+
clip: true
79+
Text {
80+
anchors.centerIn: parent
81+
font.pixelSize: 24
82+
text: "NOT COLLAPSED"
83+
Behavior on rotation { NumberAnimation { duration: 100 } }
84+
}
85+
}
86+
}
987

1088
}

‎Settings/Settings.qml

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import QtQuick 2.15
2+
import QtQuick.Controls 2.15
3+
import QtQuick.Layouts 1.3
4+
5+
ApplicationWindow {
6+
id:root
7+
visible: true
8+
width: 800
9+
height: 600
10+
minimumWidth: 800
11+
maximumWidth: 1280
12+
minimumHeight: 600
13+
maximumHeight: 750
14+
title: "Settings"
15+
16+
SplitView {
17+
id: splitView
18+
anchors.fill: parent
19+
orientation: Qt.Horizontal
20+
21+
handle: Item {
22+
implicitWidth: 3
23+
height: parent.height
24+
MouseArea {
25+
id:mouseRegion
26+
anchors.fill: parent
27+
hoverEnabled: true
28+
onHoveredChanged: {
29+
if(containsMouse){
30+
colorLayer.color = "blue"
31+
}else{
32+
colorLayer.color = mainRect.color
33+
}
34+
}
35+
Rectangle {
36+
id:colorLayer
37+
anchors.fill: parent
38+
color: mainRect.color
39+
}
40+
}
41+
}
42+
43+
Rectangle {
44+
id: mainRect
45+
color: "#dde4de"
46+
SplitView.preferredWidth: 250
47+
SplitView.maximumWidth: 300
48+
SplitView.minimumWidth: 250
49+
50+
ListView{
51+
id:listItemView
52+
anchors.fill: parent
53+
anchors.margins: 10
54+
focus: true
55+
highlightFollowsCurrentItem :true
56+
highlight: Rectangle
57+
{
58+
width: parent.height * 0.7
59+
height: parent.height * 0.7
60+
Layout.alignment: Qt.AlignVCenter
61+
Layout.leftMargin: 10
62+
radius: 8
63+
color:"blue"
64+
opacity: 0.7
65+
focus: true
66+
}
67+
68+
model: SideListModel{}
69+
delegate: SideListDelegate{
70+
width: listItemView.width
71+
iconRectIcon: iconName
72+
iconRectColor: iconColor
73+
onClicked:{
74+
ListView.view.currentIndex = index
75+
}
76+
}
77+
}
78+
}
79+
80+
Rectangle {
81+
id: collapsibleRect
82+
SplitView.fillWidth: true
83+
color: "#fafbfb"
84+
clip: true
85+
Text {
86+
anchors.centerIn: parent
87+
font.pixelSize: 24
88+
text: "NOT COLLAPSED"
89+
Behavior on rotation { NumberAnimation { duration: 100 } }
90+
}
91+
}
92+
}
93+
}

‎Settings/SideListDelegate.qml

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import QtQuick 2.15
2+
import QtQuick.Controls 2.5
3+
import QtQuick.Layouts 1.3
4+
5+
ItemDelegate {
6+
id:root
7+
property string iconRectColor: "#5fc4dc"
8+
property string iconRectIcon: "💻"
9+
highlighted: ListView.isCurrentItem
10+
height: 50
11+
hoverEnabled: true
12+
focus: true
13+
14+
background: Rectangle{
15+
color: root.hovered ? root.highlighted ? "transparent" : "#bdc9c0" : "transparent"
16+
anchors.fill: parent
17+
radius: 8
18+
}
19+
20+
RowLayout {
21+
Layout.alignment: Qt.AlignVCenter
22+
width: parent.width
23+
height: parent.height
24+
anchors.fill: parent
25+
spacing: 10
26+
Layout.leftMargin: 10
27+
Layout.rightMargin: 10
28+
29+
Rectangle{
30+
width: parent.height * 0.7
31+
height: parent.height * 0.7
32+
color: iconRectColor
33+
Layout.alignment: Qt.AlignVCenter
34+
Layout.leftMargin: 10
35+
radius: 8
36+
37+
Label{
38+
text: iconRectIcon
39+
font.pointSize: 12
40+
anchors.centerIn: parent
41+
}
42+
}
43+
44+
Label {
45+
opacity: 0.87
46+
font.pointSize: 12
47+
text: name
48+
Layout.fillWidth: true
49+
font.weight: Font.Medium
50+
verticalAlignment: Image.AlignVCenter
51+
Layout.alignment: Qt.AlignVCenter
52+
color: root.highlighted || root.hovered ? "white" : Qt.darkGray
53+
}
54+
}
55+
}

‎Settings/SideListModel.qml

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import QtQuick 2.15
2+
import QtQuick.Controls 2.5
3+
//
4+
// get All the unicode icon : https://emojiterra.com/satellite/
5+
//
6+
ListModel {
7+
ListElement {
8+
iconName:"⚙️"
9+
iconColor:"#66cbff"
10+
name: "Settings"
11+
}
12+
ListElement {
13+
iconName:"🛠️"
14+
iconColor:"#fab6d7"
15+
name: "Appearance"
16+
}
17+
ListElement {
18+
iconName:"🔐"
19+
iconColor:"#ffd480"
20+
name: "Security"
21+
}
22+
ListElement {
23+
iconName:"🗝️"
24+
iconColor:"#6ae4a9"
25+
name: "Privacy"
26+
}
27+
ListElement {
28+
iconName:"🌐"
29+
iconColor:"#b9bdc2"
30+
name: "Browser"
31+
}
32+
ListElement {
33+
iconName:"🛰️"
34+
iconColor:"#91f4f9"
35+
name: "Advanced"
36+
}
37+
ListElement {
38+
iconName:"💻"
39+
iconColor:"#abfccb"
40+
name: "Developer"
41+
}
42+
ListElement {
43+
iconName:"🧑‍💻"
44+
iconColor:"#66cbff"
45+
name: "About"
46+
}
47+
48+
}

‎main.qml

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,12 @@ import QtQuick.Window 2.15
33
import QtQuick.Controls 2.5
44
import QtQuick.Layouts 1.3
55
import QtQuick.Controls.Material 2.3
6+
import QtQml 2.15
67
import "./ScreensComponents"
78
import "./GameScreens"
89
import "./ScreensComponents/LeftSideDrawer"
910
import "./ScreensComponents/RightSideDrawer"
11+
import "./Settings"
1012
ApplicationWindow {
1113
id:root
1214
width: 1280
@@ -129,10 +131,21 @@ ApplicationWindow {
129131
onHomeClicked: {
130132
mainStack.pop(null)
131133
}
132-
onHelpCliked: {}
134+
onHelpCliked: {
135+
var component = Qt.createComponent("qrc:/Settings/Settings.qml");
136+
var win = component.createObject(root);
137+
win.show();
138+
}
133139
onSettingsCliked: {
134140
settingsDrawer.open()
135141
}
142+
143+
Component{
144+
id:settings
145+
Settings{
146+
147+
}
148+
}
136149
}
137150
Loader{
138151
id:mainLoader

‎qml.qrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -590,5 +590,8 @@
590590
<file>common/SwitchWithLeftLabel.qml</file>
591591
<file>common/VerticalDivider.qml</file>
592592
<file>GameScreens/ScreenPage.qml</file>
593+
<file>Settings/Settings.qml</file>
594+
<file>Settings/SideListDelegate.qml</file>
595+
<file>Settings/SideListModel.qml</file>
593596
</qresource>
594597
</RCC>

0 commit comments

Comments
 (0)