Skip to content

Commit 63f2e2f

Browse files
committed
qml: onboarding views navbar cleanup
Use the OnboardingNav and NavButton control to simplify the navbar of each onboarding view page and reduce the amount of duplicate code.
1 parent 3a7b865 commit 63f2e2f

File tree

10 files changed

+62
-328
lines changed

10 files changed

+62
-328
lines changed

src/qml/pages/onboarding/onboarding01a.qml

Lines changed: 8 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -14,37 +14,14 @@ Page {
1414
background: null
1515
clip: true
1616
Layout.fillWidth: true
17-
header: RowLayout {
18-
height: 50
19-
Loader {
20-
active: true
21-
visible: active
22-
Layout.alignment: Qt.AlignRight
23-
Layout.margins: 11
24-
sourceComponent: Item {
25-
width: 24
26-
height: 24
27-
Rectangle {
28-
anchors.fill: parent
29-
color: Theme.color.white
30-
radius: width*0.5
31-
}
32-
Image {
33-
id: icon
34-
source: "qrc:/icons/info"
35-
width: parent.width
36-
height: parent.height
37-
anchors.centerIn: parent
38-
fillMode: Image.PreserveAspectFit
39-
mipmap: true
40-
MouseArea {
41-
anchors.fill: parent
42-
onClicked: {
43-
introductions.incrementCurrentIndex()
44-
swipeView.inSubPage = true
45-
}
46-
}
47-
}
17+
header: OnboardingNav {
18+
alignLeft: false
19+
navButton: NavButton {
20+
iconSource: "image://images/info"
21+
iconHeight: 24
22+
onClicked: {
23+
introductions.incrementCurrentIndex()
24+
swipeView.inSubPage = true
4825
}
4926
}
5027
}

src/qml/pages/onboarding/onboarding01b.qml

Lines changed: 7 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -12,42 +12,13 @@ Page {
1212
background: null
1313
clip: true
1414
Layout.fillWidth: true
15-
header: RowLayout {
16-
height: 50
17-
Layout.leftMargin: 10
18-
Loader {
19-
active: true
20-
visible: active
21-
sourceComponent: Item {
22-
width: 73
23-
height: 46
24-
RowLayout {
25-
anchors.fill: parent
26-
spacing: 0
27-
Image {
28-
source: "qrc:/icons/caret-left"
29-
mipmap: true
30-
Layout.preferredWidth: 30
31-
Layout.preferredHeight: 30
32-
Layout.alignment: Qt.AlignVCenter
33-
fillMode: Image.PreserveAspectFit
34-
}
35-
Text {
36-
Layout.alignment: Qt.AlignVCenter
37-
text: "Back"
38-
color: Theme.color.neutral9
39-
font.family: "Inter"
40-
font.styleName: "Semi Bold"
41-
font.pixelSize: 18
42-
}
43-
}
44-
MouseArea {
45-
anchors.fill: parent
46-
onClicked: {
47-
introductions.decrementCurrentIndex()
48-
swipeView.inSubPage = false
49-
}
50-
}
15+
header: OnboardingNav {
16+
navButton: NavButton {
17+
iconSource: "image://images/caret-left"
18+
text: "Back"
19+
onClicked: {
20+
introductions.decrementCurrentIndex()
21+
swipeView.inSubPage = false
5122
}
5223
}
5324
}

src/qml/pages/onboarding/onboarding01c.qml

Lines changed: 7 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -12,42 +12,13 @@ Page {
1212
background: null
1313
clip: true
1414
Layout.fillWidth: true
15-
header: RowLayout {
16-
height: 50
17-
Layout.leftMargin: 10
18-
Loader {
19-
active: true
20-
visible: active
21-
sourceComponent: Item {
22-
width: 73
23-
height: 46
24-
RowLayout {
25-
anchors.fill: parent
26-
spacing: 0
27-
Image {
28-
source: "qrc:/icons/caret-left"
29-
mipmap: true
30-
Layout.preferredWidth: 30
31-
Layout.preferredHeight: 30
32-
Layout.alignment: Qt.AlignVCenter
33-
fillMode: Image.PreserveAspectFit
34-
}
35-
Text {
36-
Layout.alignment: Qt.AlignVCenter
37-
text: "Back"
38-
color: Theme.color.neutral9
39-
font.family: "Inter"
40-
font.styleName: "Semi Bold"
41-
font.pixelSize: 18
42-
}
43-
}
44-
MouseArea {
45-
anchors.fill: parent
46-
onClicked: {
47-
introductions.decrementCurrentIndex()
48-
swipeView.inSubPage = true
49-
}
50-
}
15+
header: OnboardingNav {
16+
navButton: NavButton {
17+
iconSource: "image://images/caret-left"
18+
text: "Back"
19+
onClicked: {
20+
introductions.decrementCurrentIndex()
21+
swipeView.inSubPage = true
5122
}
5223
}
5324
}

src/qml/pages/onboarding/onboarding02.qml

Lines changed: 5 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -11,40 +11,11 @@ Page {
1111
background: null
1212
clip: true
1313
Layout.fillWidth: true
14-
header: RowLayout {
15-
height: 50
16-
Layout.leftMargin: 10
17-
Loader {
18-
active: true
19-
visible: active
20-
sourceComponent: Item {
21-
width: 73
22-
height: 46
23-
RowLayout {
24-
anchors.fill: parent
25-
spacing: 0
26-
Image {
27-
source: "qrc:/icons/caret-left"
28-
mipmap: true
29-
Layout.preferredWidth: 30
30-
Layout.preferredHeight: 30
31-
Layout.alignment: Qt.AlignVCenter
32-
fillMode: Image.PreserveAspectFit
33-
}
34-
Text {
35-
Layout.alignment: Qt.AlignVCenter
36-
text: "Back"
37-
color: Theme.color.neutral9
38-
font.family: "Inter"
39-
font.styleName: "Semi Bold"
40-
font.pixelSize: 18
41-
}
42-
}
43-
MouseArea {
44-
anchors.fill: parent
45-
onClicked: swipeView.currentIndex -= 1
46-
}
47-
}
14+
header: OnboardingNav {
15+
navButton: NavButton {
16+
iconSource: "image://images/caret-left"
17+
text: "Back"
18+
onClicked: swipeView.currentIndex -= 1
4819
}
4920
}
5021
OnboardingInfo {

src/qml/pages/onboarding/onboarding03.qml

Lines changed: 5 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -11,40 +11,11 @@ Page {
1111
background: null
1212
clip: true
1313
Layout.fillWidth: true
14-
header: RowLayout {
15-
height: 50
16-
Layout.leftMargin: 10
17-
Loader {
18-
active: true
19-
visible: active
20-
sourceComponent: Item {
21-
width: 73
22-
height: 46
23-
RowLayout {
24-
anchors.fill: parent
25-
spacing: 0
26-
Image {
27-
source: "qrc:/icons/caret-left"
28-
mipmap: true
29-
Layout.preferredWidth: 30
30-
Layout.preferredHeight: 30
31-
Layout.alignment: Qt.AlignVCenter
32-
fillMode: Image.PreserveAspectFit
33-
}
34-
Text {
35-
Layout.alignment: Qt.AlignVCenter
36-
text: "Back"
37-
color: Theme.color.neutral9
38-
font.family: "Inter"
39-
font.styleName: "Semi Bold"
40-
font.pixelSize: 18
41-
}
42-
}
43-
MouseArea {
44-
anchors.fill: parent
45-
onClicked: swipeView.currentIndex -= 1
46-
}
47-
}
14+
header: OnboardingNav {
15+
navButton: NavButton {
16+
iconSource: "image://images/caret-left"
17+
text: "Back"
18+
onClicked: swipeView.currentIndex -= 1
4819
}
4920
}
5021
OnboardingInfo {

src/qml/pages/onboarding/onboarding04.qml

Lines changed: 6 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -12,40 +12,11 @@ Page {
1212
background: null
1313
Layout.fillWidth: true
1414
clip: true
15-
header: RowLayout {
16-
height: 50
17-
Layout.leftMargin: 10
18-
Loader {
19-
active: true
20-
visible: active
21-
sourceComponent: Item {
22-
width: 73
23-
height: 46
24-
RowLayout {
25-
anchors.fill: parent
26-
spacing: 0
27-
Image {
28-
source: "qrc:/icons/caret-left"
29-
mipmap: true
30-
Layout.preferredWidth: 30
31-
Layout.preferredHeight: 30
32-
Layout.alignment: Qt.AlignVCenter
33-
fillMode: Image.PreserveAspectFit
34-
}
35-
Text {
36-
Layout.alignment: Qt.AlignVCenter
37-
text: "Back"
38-
color: Theme.color.neutral9
39-
font.family: "Inter"
40-
font.styleName: "Semi Bold"
41-
font.pixelSize: 18
42-
}
43-
}
44-
MouseArea {
45-
anchors.fill: parent
46-
onClicked: swipeView.currentIndex -= 1
47-
}
48-
}
15+
header: OnboardingNav {
16+
navButton: NavButton {
17+
iconSource: "image://images/caret-left"
18+
text: "Back"
19+
onClicked: swipeView.currentIndex -= 1
4920
}
5021
}
5122
ColumnLayout {
@@ -71,4 +42,4 @@ Page {
7142
onClicked: swipeView.incrementCurrentIndex()
7243
}
7344
}
74-
}
45+
}

src/qml/pages/onboarding/onboarding05a.qml

Lines changed: 5 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -12,40 +12,11 @@ Page {
1212
background: null
1313
Layout.fillWidth: true
1414
clip: true
15-
header: RowLayout {
16-
height: 50
17-
Layout.leftMargin: 10
18-
Loader {
19-
active: true
20-
visible: active
21-
sourceComponent: Item {
22-
width: 73
23-
height: 46
24-
RowLayout {
25-
anchors.fill: parent
26-
spacing: 0
27-
Image {
28-
source: "qrc:/icons/caret-left"
29-
mipmap: true
30-
Layout.preferredWidth: 30
31-
Layout.preferredHeight: 30
32-
Layout.alignment: Qt.AlignVCenter
33-
fillMode: Image.PreserveAspectFit
34-
}
35-
Text {
36-
Layout.alignment: Qt.AlignVCenter
37-
text: "Back"
38-
color: Theme.color.neutral9
39-
font.family: "Inter"
40-
font.styleName: "Semi Bold"
41-
font.pixelSize: 18
42-
}
43-
}
44-
MouseArea {
45-
anchors.fill: parent
46-
onClicked: swipeView.currentIndex -= 1
47-
}
48-
}
15+
header: OnboardingNav {
16+
navButton: NavButton {
17+
iconSource: "image://images/caret-left"
18+
text: "Back"
19+
onClicked: swipeView.currentIndex -= 1
4920
}
5021
}
5122
ColumnLayout {

src/qml/pages/onboarding/onboarding05b.qml

Lines changed: 7 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -12,33 +12,13 @@ Page {
1212
background: null
1313
Layout.fillWidth: true
1414
clip: true
15-
header: RowLayout {
16-
height: 50
17-
Loader {
18-
active: true
19-
visible: active
20-
Layout.alignment: Qt.AlignRight
21-
Layout.topMargin: 12
22-
Layout.rightMargin: -7
23-
sourceComponent: Item {
24-
Layout.fillWidth: true
25-
width: 73
26-
height: 46
27-
Text {
28-
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
29-
text: "Done"
30-
color: Theme.color.neutral9
31-
font.family: "Inter"
32-
font.styleName: "Semi Bold"
33-
font.pixelSize: 18
34-
}
35-
MouseArea {
36-
anchors.fill: parent
37-
onClicked: {
38-
storages.decrementCurrentIndex()
39-
swipeView.inSubPage = false
40-
}
41-
}
15+
header: OnboardingNav {
16+
alignLeft: false
17+
navButton: NavButton {
18+
text: "Done"
19+
onClicked: {
20+
storages.decrementCurrentIndex()
21+
swipeView.inSubPage = false
4222
}
4323
}
4424
}

0 commit comments

Comments
 (0)