Qt World Summit Conference App
import Felgo 3.0
import QtQuick 2.9
import "../common"
FlickablePage {
id: mainPage
title: "Main"
leftBarItem: ButtonBarItem {
Component.onCompleted: {
if (!Theme.isAndroid) {
leftBarItem = null
}
}
contentItem: Icon {
id: menuIcon
anchors.centerIn: parent
color: "#fff"
icon: Theme.isAndroid ? "menu" : IconType.navicon
textItem.font.family: Theme.isAndroid ? Theme.androidIconFont.name : Theme.iconFont.name
size: Theme.isAndroid ? dp(Theme.navigationBar.androidIconSize) : dp(Theme.navigationBar.defaultIconSize)
}
z: 100
visible: Theme.isAndroid
RippleMouseArea {
enabled: parent.visible
rippleEffectEnabled: true
fillColor: "#20ffffff"
backgroundColor: "#10ffffff"
anchors.fill: parent
centerAnimation: true
touchPoint: Qt.point(width/2,height/2)
onClicked: {
navigation.drawer.open()
}
}
}
titleItem: Item {
width: dp(50)
implicitWidth: img.width
height: dp(Theme.navigationBar.height)
Image {
id: img
source: "../../assets/Qt_logo.png"
width: dp(50)
height: parent.height * 0.6
fillMode: Image.PreserveAspectFit
y: Theme.isAndroid ? dp(Theme.navigationBar.titleBottomMargin) + dp(10) : dp(10)
}
}
flickable.contentWidth: width
flickable.contentHeight: Math.max(flickable.height, content.height + demosArea.height)
Rectangle {
width: parent.width
height: dp(1000)
color: app.secondaryTintColor
anchors.bottom: parent.top
}
Column {
id: content
width: parent.width
property real descriptionTextMaxWidth: Math.min(parent.width - dp(Theme.navigationBar.defaultBarItemPadding) * 2, dp(600))
Column {
width: parent.width
Rectangle {
id: qwsWrapper
height: dp(300)
width: parent.width
color: app.secondaryTintColor
AppImage {
id: bannerImage
width: parent.width
anchors.bottom: parent.bottom
height: mainPage.flickable.contentY < 0 ? parent.height - mainPage.flickable.contentY : parent.height
fillMode: AppImage.PreserveAspectCrop
source: "../../assets/herobg_qtws17-1.jpg"
opacity: 0.35
}
Rectangle {
opacity: 0.5
anchors.centerIn: bannerImage
height: bannerImage.width
width: bannerImage.height
rotation: -90
transformOrigin: Item.Center
gradient: Gradient {
GradientStop { position: 0.0; color: "#41cd52" }
GradientStop { position: 1.0; color: "#0041cd52" }
}
}
Column {
width: parent.width
anchors.verticalCenter: parent.verticalCenter
spacing: dp(Theme.navigationBar.defaultBarItemPadding)
AppText {
width: parent.width
horizontalAlignment: AppText.AlignHCenter
color: "white"
text: "The Future is\nWritten with Qt"
font.pixelSize: sp(22)
}
AppImage {
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/QtWS2019_globe_white.png"
width: dp(120)
fillMode: AppImage.PreserveAspectFit
}
AppText {
width: parent.width
horizontalAlignment: AppText.AlignHCenter
color: "white"
text: "Berlin, Germany / 4 - 6 November"
font.pixelSize: sp(14)
}
}
}
Rectangle {
width: parent.width
color: Theme.secondaryBackgroundColor
height: qtIntroCol.height
Column {
id: qtIntroCol
width: parent.width
topPadding: dp(15)
bottomPadding: dp(15)
AppText {
width: content.descriptionTextMaxWidth
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: sp(13)
wrapMode: Text.WordWrap
text: "Qt is the fastest and smartest way to produce industry-leading software that users love."
}
}
}
Rectangle {
width: parent.width
height: felgoBlockColumn.height
color: Theme.backgroundColor
Column {
id: felgoBlockColumn
width: parent.width
spacing: dp(Theme.navigationBar.defaultBarItemPadding)
Item {
width: parent.width
height: px(1)
}
AppText {
width: content.descriptionTextMaxWidth
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: sp(13)
wrapMode: Text.WordWrap
text: "This cross-platform mobile app<br/>was made with <b>Qt & the Felgo SDK</b>!"
}
AppText {
anchors.horizontalCenter: parent.horizontalCenter
width: Math.min(parent.width - dp(Theme.navigationBar.defaultBarItemPadding), implicitWidth + dp(Theme.navigationBar.defaultBarItemPadding))
font.pixelSize: sp(13)
wrapMode: Text.WordWrap
textFormat: AppText.RichText
onLinkActivated: nativeUtils.openUrl(link)
text: "<style>a:link { color: "+Theme.tintColor+";}</style>
<ul><li><b>Only ~2900 lines of code</b> - download the full source on GitHub below</li>
<li><b>Build cross-platform native apps</b> for" + (system.isPlatform(System.IOS) ? " all major mobile platforms, desktop and embedded devices</li>" : "</li>")
}
AppImage {
width: parent.width * 0.8
fillMode: AppImage.PreserveAspectFit
source: "../../assets/platforms.png"
anchors.horizontalCenter: parent.horizontalCenter
visible: !system.isPlatform(System.IOS)
}
AppButton {
flat: false
anchors.horizontalCenter: parent.horizontalCenter
text: "More Info & Source Code"
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : text})
confirmOpenUrl("https://felgo.com/qws-conference-in-app-2019")
}
verticalMargin: 0
}
Item {
width: parent.width
height: px(1)
}
}
}
}
Column {
width: parent.width
Rectangle {
width: parent.width
height: dp(220)
color: Theme.secondaryBackgroundColor
Column {
anchors.centerIn: parent
spacing: dp(10)
AppImage {
source: "../../assets/felgo_black.png"
width: dp(200)
fillMode: Image.PreserveAspectFit
anchors.horizontalCenter: parent.horizontalCenter
}
Item {
width: parent.width
height: px(1)
}
AppText {
text: "WE MADE THIS APP FOR YOU!"
font.bold: true
font.pixelSize: sp(18)
anchors.horizontalCenter: parent.horizontalCenter
}
AppText {
text: "And there is <b>much more</b> we can do."
anchors.horizontalCenter: parent.horizontalCenter
}
Item {
width: parent.width
height: dp(5)
}
AppImage {
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/qt_tech_partner.png"
width: dp(180)
fillMode: Image.PreserveAspectFit
}
}
MouseArea {
anchors.fill: parent
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : "WE MADE THIS APP FOR YOU!"})
confirmOpenUrl("https://felgo.com/qws-2019-felgo-offer")
}
}
}
}
Item {
width: parent.width
height: dp(15)
}
AppText {
width: content.descriptionTextMaxWidth
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: sp(13)
wrapMode: Text.WordWrap
text: "Felgo <b>extends Qt</b> with:"
}
Item {
width: parent.width
height: dp(10)
}
AppText {
anchors.horizontalCenter: parent.horizontalCenter
width: content.descriptionTextMaxWidth
font.pixelSize: sp(13)
wrapMode: Text.WordWrap
textFormat: AppText.RichText
text: "<ul>
<li><b>200+ Extra Qt APIs</b>: faster development thanks to more components</li>
<li><b>Live & Hot Code Reload</b>: higher efficiency thanks to rapid testing cycles</li>
<li><b>Specialized Qt CI/CD</b>: save time with continuous integration and testing for Qt projects</li>
<li><b>60+ polished Qt demos</b> with best practices for <b>UI/UX</b> and application architecture for <b>Mobile, Desktop, Embedded & Web</b></li>
</ul>"
}
Rectangle {
color: Theme.backgroundColor
width: parent.width
height: dp(70)
AppButton {
flat: false
anchors.centerIn: parent
text: "How Felgo accelerates Qt development"
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : text})
confirmOpenUrl("https://felgo.com/qws-2019-felgo-offer")
}
verticalMargin: 0
}
}
}
Rectangle {
id: demosArea
anchors.bottom: parent.bottom
width: parent.width
height: demosContent.height + 2 * dp(Theme.navigationBar.defaultBarItemPadding)
color: Theme.secondaryBackgroundColor
Column {
id: demosContent
width: parent.width
anchors.verticalCenter: parent.verticalCenter
spacing: content.spacing
AppText {
id: demosText
width: parent.width - dp(Theme.navigationBar.defaultBarItemPadding) * 2
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: sp(13)
horizontalAlignment: Text.AlignHCenter
wrapMode: Text.WordWrap
color: Theme.secondaryTextColor
text: "Try more of the open-source Qt & Felgo apps:"
}
Grid {
id: grid
property real itemWidth: Math.min(parent.width/2,dp(200))
property real itemHeight: dp(130)
columns: 2
topPadding: dp(15)
bottomPadding: dp(15)
anchors.horizontalCenter: parent.horizontalCenter
Item {
width: grid.itemWidth
height: grid.itemHeight
Column {
width: parent.width - dp(Theme.navigationBar.defaultBarItemPadding)*2
spacing: dp(5)
anchors.horizontalCenter: parent.horizontalCenter
AppText {
text: "Jira Tima"
font.pixelSize: sp(13)
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
}
AppImage {
width: parent.width * 0.4
fillMode: AppImage.PreserveAspectFit
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/logo-tima.png"
}
AppText {
width: parent.width
font.pixelSize: sp(12)
color: Theme.secondaryTextColor
horizontalAlignment: AppText.AlignHCenter
text: "Master Jira time tracking on the go!"
}
}
MouseArea {
anchors.fill: parent
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : "Jira Tima"})
var url = Theme.isAndroid ? "https://play.google.com/store/apps/details?id=net.vplay.tima" : "https://itunes.apple.com/us/app/id1440145973?mt=8"
nativeUtils.openUrl(url)
}
}
}
Item {
width: grid.itemWidth
height: grid.itemHeight
Column {
width: parent.width - dp(Theme.navigationBar.defaultBarItemPadding)*2
spacing: dp(5)
anchors.horizontalCenter: parent.horizontalCenter
AppText {
text: "WTR - Weather Pro"
font.pixelSize: sp(13)
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
}
AppImage {
width: parent.width * 0.4
fillMode: AppImage.PreserveAspectFit
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/logo-wtr.png"
}
AppText {
width: parent.width
font.pixelSize: sp(12)
color: Theme.secondaryTextColor
horizontalAlignment: AppText.AlignHCenter
text: "The Qt-est weather app in the app stores!"
}
}
MouseArea {
anchors.fill: parent
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : "WTR"})
var url = Theme.isAndroid ? "https://play.google.com/store/apps/details?id=net.vplay.demos.apps.weatherapp" : "https://itunes.apple.com/us/app/weather-pro-forecast-history/id1438432642?mt=8"
nativeUtils.openUrl(url)
}
}
}
Item {
width: grid.itemWidth
height: grid.itemHeight
Column {
width: parent.width - dp(Theme.navigationBar.defaultBarItemPadding)*2
spacing: dp(5)
anchors.horizontalCenter: parent.horizontalCenter
AppText {
text: "Felgo Developer App"
font.pixelSize: sp(13)
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
}
AppImage {
width: parent.width * 0.4
fillMode: AppImage.PreserveAspectFit
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/logo-showcase.png"
}
AppText {
width: parent.width
font.pixelSize: sp(12)
color: Theme.secondaryTextColor
horizontalAlignment: AppText.AlignHCenter
text: "This app includes all open-source demos of Felgo!"
}
}
MouseArea {
anchors.fill: parent
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : "Developer App"})
var url = Theme.isAndroid ? "https://play.google.com/store/apps/details?id=net.vplay.apps.QMLLive" : "https://itunes.apple.com/us/app/qt-quick-qml-live-scripting-by-v-play/id1157319191"
nativeUtils.openUrl(url)
}
}
}
Item {
width: grid.itemWidth
height: grid.itemHeight
Column {
width: parent.width - dp(Theme.navigationBar.defaultBarItemPadding)*2
spacing: dp(5)
anchors.horizontalCenter: parent.horizontalCenter
AppText {
text: "31 Online"
font.pixelSize: sp(13)
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
}
AppImage {
width: parent.width * 0.4
fillMode: AppImage.PreserveAspectFit
anchors.horizontalCenter: parent.horizontalCenter
source: "../../assets/logo-31.png"
}
AppText {
width: parent.width
font.pixelSize: sp(12)
color: Theme.secondaryTextColor
horizontalAlignment: AppText.AlignHCenter
text: "Top-5 Card Game in the app stores, single- and multiplayer powered by Felgo and Qt"
}
}
MouseArea {
anchors.fill: parent
onClicked: {
amplitude.logEvent("Click MainPage Button",{"label" : "Hosn Obe"})
var url = Theme.isAndroid ? "https://play.google.com/store/apps/details?id=com.donkeycat.hosnobeol" : "https://itunes.apple.com/us/app/hosn-obe-online/id1207752026?mt=8"
nativeUtils.openUrl(url)
}
}
}
}
}
}
Rectangle {
width: parent.width
height: dp(1000)
color: Theme.secondaryBackgroundColor
anchors.top: parent.bottom
}
function confirmOpenUrl(url) {
NativeDialog.confirm("Open Website?","This action opens your browser to visit "+url,function(ok) {
if(ok)
nativeUtils.openUrl(url)
})