diff --git a/app/qml/components/MMIconCheckBoxHorizontal.qml b/app/qml/components/MMIconCheckBoxHorizontal.qml index 368fb733c..871d0aa7d 100644 --- a/app/qml/components/MMIconCheckBoxHorizontal.qml +++ b/app/qml/components/MMIconCheckBoxHorizontal.qml @@ -15,7 +15,7 @@ import "." CheckBox { id: control - required property var sourceIcon + property var sourceIcon: "" property bool small: false height: (control.small ? 50 : 80) * __dp diff --git a/app/qml/onboarding/MMHowYouFoundUs.qml b/app/qml/onboarding/MMHowYouFoundUs.qml index 2c6cf9df9..c1eb250f7 100644 --- a/app/qml/onboarding/MMHowYouFoundUs.qml +++ b/app/qml/onboarding/MMHowYouFoundUs.qml @@ -15,188 +15,102 @@ import "../components" Page { id: root + width: parent.width + signal backClicked signal continueClicked - function uncheck(except, isChecked, items) { - if (!isChecked) - return; + readonly property string headerTitle: qsTr("How did you learn about us?") + readonly property real hPadding: width < __style.maxPageWidth + ? 20 * __dp + : (20 + (width - __style.maxPageWidth) / 2) * __dp - items.forEach( function(item) { - if (item !== except) { - item.checked = false - } - } ) + Rectangle { + anchors.fill: parent + color: __style.lightGreenColor } - function uncheckAllPrimary(except, isChecked) { - - var items = [ - searchSource, - blogSource, - mouthSource, - qgisSource, - applicationStoreSource, - teacherSource, - conferenceSource, - socialMediaSource, - otherSource - ] - - uncheck(except, isChecked, items) - } + MMHeader { + id: header - function uncheckAllSocialMedia(except, isChecked) { - if (!isChecked) - return; + x: root.hPadding + y: 20 * __dp + width: root.width - 2 * root.hPadding + headerTitle: listView.contentY > -30 * __dp ? root.headerTitle : "" + backVisible: false + step: 2 - var items = [ - youtubeSocialMediaSource, - twitterSocialMediaSource, - facebookSocialMediaSource, - linkedinSocialMediaSource, - mastodonSocialMediaSource, - redditSocialMediaSource, - ] - - uncheck(except, isChecked, items) + onBackClicked: root.backClicked() } - Column { - MMHeader { - headerTitle: qsTr("How did you learn about us") - step: 2 - - onBackClicked: root.backClicked() - } - - MMIconCheckBoxHorizontal { - id: searchSource - sourceIcon: __style.searchIcon - text: qsTr("Search engine (Google, ...)") - onToggled: uncheckAllPrimary(searchSource, checked) - } - - MMIconCheckBoxHorizontal { - id: blogSource - sourceIcon: __style.termsIcon - text: qsTr("Blog") - onToggled: uncheckAllPrimary(blogSource, checked) - } - - MMIconCheckBoxHorizontal { - id: mouthSource - sourceIcon: __style.mouthIcon - text: qsTr("Mouth") - onToggled: uncheckAllPrimary(mouthSource, checked) - } - - MMIconCheckBoxHorizontal { - id: qgisSource - sourceIcon: __style.qgisIcon - text: qsTr("QGIS website") - onToggled: uncheckAllPrimary(qgisSource, checked) - } - - MMIconCheckBoxHorizontal { - id: applicationStoreSource - sourceIcon: __style.subscriptionsIcon - text: qsTr("Application store") - onToggled: uncheckAllPrimary(applicationStoreSource, checked) - } - - MMIconCheckBoxHorizontal { - id: teacherSource - sourceIcon: __style.teacherIcon - text: qsTr("Teacher") - onToggled: uncheckAllPrimary(teacherSource, checked) - } - - MMIconCheckBoxHorizontal { - id: conferenceSource - sourceIcon: __style.briefcaseIcon - text: qsTr("Conference") - onToggled: uncheckAllPrimary(conferenceSource, checked) - } - - MMIconCheckBoxHorizontal { - id: socialMediaSource - sourceIcon: __style.socialMediaIcon - text: qsTr("Social media") - onToggled: uncheckAllPrimary(socialMediaSource, checked) - } - - MMIconCheckBoxHorizontal { - id: youtubeSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.youtubeIcon - text: qsTr("YouTube") - small:true - onToggled: uncheckAllSocialMedia(youtubeSocialMediaSource, checked) - } - - MMIconCheckBoxHorizontal { - id: twitterSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.xTwitterIcon - text: qsTr("Twitter") - small:true - onToggled: uncheckAllSocialMedia(twitterSocialMediaSource, checked) - } - - MMIconCheckBoxHorizontal { - id: facebookSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.facebookIcon - text: qsTr("Facebook") - small:true - onToggled: uncheckAllSocialMedia(facebookSocialMediaSource, checked) - } - - MMIconCheckBoxHorizontal { - id: linkedinSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.linkedinIcon - text: qsTr("LinkedIn") - small:true - onToggled: uncheckAllSocialMedia(linkedinSocialMediaSource, checked) - } + Item { + width: parent.width + height: parent.height - header.height - 40 * __dp + anchors.top: header.bottom + anchors.topMargin: 20 * __dp + + ListView { + id: listView + + width: parent.width - 2 * root.hPadding + anchors.horizontalCenter: parent.horizontalCenter + height: parent.height - header.height + spacing: 10 * __dp + clip: true + + model: ListModel { + Component.onCompleted: { + listView.model.append({name: qsTr("Search engine (Google, ...)"), icon: __style.searchIcon, submenu: false}) + listView.model.append({name: qsTr("Blog"), icon: __style.termsIcon, submenu: false}) + listView.model.append({name: qsTr("Mouth"), icon: __style.mouthIcon, submenu: false}) + listView.model.append({name: qsTr("QGIS website"), icon: __style.qgisIcon, submenu: false}) + listView.model.append({name: qsTr("Application store"), icon: __style.subscriptionsIcon, submenu: false}) + listView.model.append({name: qsTr("Teacher"), icon: __style.teacherIcon, submenu: false}) + listView.model.append({name: qsTr("Conference"), icon: __style.briefcaseIcon, submenu: false}) + listView.model.append({name: qsTr("Social media"), icon: __style.socialMediaIcon, submenu: false}) + listView.model.append({name: qsTr("YouTube"), icon: __style.youtubeIcon, submenu: true}) + listView.model.append({name: qsTr("Twitter"), icon: __style.xTwitterIcon, submenu: true}) + listView.model.append({name: qsTr("Facebook"), icon: __style.facebookIcon, submenu: true}) + listView.model.append({name: qsTr("LinkedIn"), icon: __style.linkedinIcon, submenu: true}) + listView.model.append({name: qsTr("Mastodon"), icon: __style.mastodonIcon, submenu: true}) + listView.model.append({name: qsTr("Reddit"), icon: __style.redditIcon, submenu: true}) + listView.model.append({name: qsTr("Other"), icon: __style.otherIcon, submenu: false}) + } + } - MMIconCheckBoxHorizontal { - id: mastodonSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.mastodonIcon - text: qsTr("Mastodon") - small:true - onToggled: uncheckAllSocialMedia(mastodonSocialMediaSource, checked) - } + header: Text { + id: listHeader + + width: root.width - 2 * root.hPadding + padding: 20 * __dp + text: root.headerTitle + font: __style.h3 + color: __style.forestColor + wrapMode: Text.WordWrap + horizontalAlignment: Text.AlignHCenter + lineHeight: 1.2 + } - MMIconCheckBoxHorizontal { - id: redditSocialMediaSource - visible: socialMediaSource.checked - sourceIcon: __style.redditIcon - text: qsTr("Reddit") - small:true - onToggled: uncheckAllSocialMedia(redditSocialMediaSource, checked) - } + delegate: MMIconCheckBoxHorizontal { + width: model.submenu ? listView.width - 20 * __dp : listView.width + x: model.submenu ? 20 * __dp : 0 + sourceIcon: model.icon + text: model.name + small: model.submenu + checked: listView.currentIndex === index - MMIconCheckBoxHorizontal { - id: otherSource - sourceIcon: __style.otherIcon - text: qsTr("Other") - onToggled: uncheckAllPrimary(otherSource, checked) + onClicked: listView.currentIndex = index + } } + } - MMInput { - id: otherSourceDescription - visible: otherSource.checked - title: qsTr("Source") - placeholderText: qsTr("Please specify the source") - } + MMButton { + width: root.width - 2 * root.hPadding + anchors.horizontalCenter: parent.horizontalCenter + anchors.bottom: parent.bottom + anchors.bottomMargin: 20 * __dp + text: qsTr("Continue") - MMButton { - onClicked: root.continueClicked() - text: qsTr("Continue") - } + onClicked: root.continueClicked() } } diff --git a/gallery/qml/pages/OnboardingPage.qml b/gallery/qml/pages/OnboardingPage.qml index 17f23f72d..9fa9e8ead 100644 --- a/gallery/qml/pages/OnboardingPage.qml +++ b/gallery/qml/pages/OnboardingPage.qml @@ -123,15 +123,17 @@ Page { onContinueClicked: visible = false } - MMHowYouFoundUs { id: howYouFoundUs + anchors.fill: parent - visible: false + //visible: false - onBackClicked: {visible=false} + onContinueClicked: visible = false + onBackClicked: visible = false } + MMWhichIndustry { id: whichIndustry anchors.fill: parent