diff --git a/Managed App Config/MyApp.qml b/Managed App Config/MyApp.qml new file mode 100644 index 0000000..23f324a --- /dev/null +++ b/Managed App Config/MyApp.qml @@ -0,0 +1,332 @@ +/* Copyright 2017 Esri + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +import QtQuick 2.7 +import QtQuick.Layouts 1.1 +import QtQuick.Controls 2.1 +import QtQuick.Controls.Material 2.1 +import QtGraphicalEffects 1.0 + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 +import ArcGIS.AppFramework.Management 1.0 + +import "controls" as Controls + +App { + id: app + width: 414 + height: 736 + function units(value) { + return AppFramework.displayScaleFactor * value + } + property real scaleFactor: AppFramework.displayScaleFactor + property int baseFontSize : app.info.propertyValue("baseFontSize", 15 * scaleFactor) + (isSmallScreen ? 0 : 3) + property bool isSmallScreen: (width || height) < units(400) + property bool isTablet: AppFramework.systemInformation.family === "tablet" + property bool isPhone: (AppFramework.systemInformation.family === "phone") + + property bool isSupported:ManagedAppConfiguration.supported + + Page{ + anchors.fill: parent + header: ToolBar{ + id:header + width: parent.width + height: 50 * scaleFactor + Material.background: "#8f499c" + Controls.HeaderBar{} + } + + // sample starts here ------------------------------------------------------------------ + contentItem: Rectangle { + anchors.top:header.bottom + + Connections { + target: ManagedAppConfiguration + + onPolicyDefaultsChanged : { + defaultPortalName.text = ManagedAppConfiguration.defaultValue("portalName"); + defaultPortalUrl.text = ManagedAppConfiguration.defaultValue("portalUrl"); + defaultJson.text = JSON.stringify(ManagedAppConfiguration.policyDefaults, null, 2); + } + + onPolicySettingsChanged : { + portalName.text = ManagedAppConfiguration.value("portalName", false, "ArcGIS"); + portalUrl.text = ManagedAppConfiguration.value("portalUrl", false, "www.arcgis.com"); + settingsJson.text = JSON.stringify(ManagedAppConfiguration.policySettings, null, 2); + } + } + + Rectangle { + anchors.margins: 5 * scaleFactor + anchors.fill: parent + color:"#F5F5F5" + + Rectangle { + anchors.margins: 4 * scaleFactor + anchors.fill: parent + color:"#F5F5F5" + + ColumnLayout { + anchors.fill: parent + spacing: 0 + + Item { + Layout.preferredHeight: 35 * scaleFactor + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Controls.CustomizedText { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + cusText: qsTr("Default portalUrl: ") + } + + Item { + Layout.fillWidth: true + TextField { + id: defaultPortalUrl + width: parent.width + text: "portalUrl" + Material.accent: "#8f499c" + font.pixelSize: 11 * scaleFactor + clip: true + anchors.verticalCenter: parent.verticalCenter + } + } + } + } + + Item { + Layout.preferredHeight: 35 * scaleFactor + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Controls.CustomizedText { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + cusText: qsTr("Default portalName: ") + } + + Item { + Layout.fillWidth: true + + TextField { + id: defaultPortalName + width: parent.width + anchors.verticalCenter: parent.verticalCenter + placeholderText: "portalName" + Material.accent: "#8f499c" + selectByMouse: true + font.pixelSize: 11 * scaleFactor + } + } + } + } + + + Item { + Layout.preferredHeight: (parent.height - 140)/2.1 + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Item { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + Layout.preferredHeight: parent.height + + ColumnLayout { + anchors.fill: parent + spacing: 0 + + Controls.CustomizedText { + text: "Default JSON: " + Layout.preferredWidth: parent.width + + } + + Item { + Layout.fillHeight: true + } + } + } + + Item { + Layout.fillHeight: true + Layout.fillWidth: true + clip: true + + Flickable { + anchors.fill: parent + contentWidth: this.width + contentHeight:defaultJson.height + boundsBehavior: Flickable.StopAtBounds + + Label { + id: defaultJson + wrapMode: TextArea.Wrap + width: parent.width + font.pixelSize: 11 * scaleFactor + } + } + } + } + } + + + Item { + Layout.preferredHeight: 35 * scaleFactor + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Controls.CustomizedText { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + cusText: qsTr("Settings portalUrl: ") + } + + Item { + Layout.fillWidth: true + + TextField { + id: portalUrl + width: parent.width + anchors.verticalCenter: parent.verticalCenter + placeholderText: "portalUrl" + Material.accent: "#8f499c" + selectByMouse: true + font.pixelSize: 11 * scaleFactor + } + } + } + } + + Item { + Layout.preferredHeight: 35 * scaleFactor + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Controls.CustomizedText { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + cusText: qsTr( "Settings portalName: ") + } + + Item { + Layout.fillWidth: true + + TextField { + id: portalName + width: parent.width + anchors.verticalCenter: parent.verticalCenter + placeholderText: "portalName" + Material.accent: "#8f499c" + selectByMouse: true + font.pixelSize: 11 * scaleFactor + } + } + } + } + + + Item { + Layout.preferredHeight: (parent.height - 140)/2.1 + Layout.preferredWidth: parent.width + + RowLayout { + anchors.fill: parent + spacing: 10 * scaleFactor + + Item { + Layout.preferredWidth: isTablet ? Math.max(0.18 * parent.width, 10 * scaleFactor) : Math.max(0.3 * parent.width, 10 * scaleFactor) + Layout.fillHeight: true + + ColumnLayout { + anchors.fill: parent + spacing: 0 + + Controls.CustomizedText { + text: "Settings JSON: " + Layout.preferredWidth: parent.width + } + + Item { + Layout.fillHeight: true + } + } + } + + Item { + Layout.fillHeight: true + Layout.fillWidth: true + clip: true + + Flickable { + anchors.fill: parent + contentWidth: this.width + contentHeight:defaultJson.height + boundsBehavior: Flickable.StopAtBounds + + Label { + id: settingsJson + wrapMode: TextArea.Wrap + width: parent.width + font.pixelSize: 11 * scaleFactor + } + } + } + } + } + } + } + } + } + } + + + Component.onCompleted: { + defaultPortalName.text = ManagedAppConfiguration.defaultValue("portalName"); + defaultPortalUrl.text = ManagedAppConfiguration.defaultValue("portalUrl"); + defaultJson.text = JSON.stringify(ManagedAppConfiguration.policyDefaults, null, 2); + + console.log("defaults: ", JSON.stringify(ManagedAppConfiguration.policyDefaults, null, 1)); + + portalName.text = ManagedAppConfiguration.value("portalName", false, "ArcGIS"); + portalUrl.text = ManagedAppConfiguration.value("portalUrl", false, "www.arcgis.com") + settingsJson.text = JSON.stringify(ManagedAppConfiguration.policySettings, null, 2); + + console.log("settings: ", JSON.stringify(ManagedAppConfiguration.policySettings)); + } + + // sample ends here ------------------------------------------------------------------------ + Controls.DescriptionPage{ + id:descPage + visible: false + } +} + + diff --git a/Managed App Config/MyApp.qmlproject b/Managed App Config/MyApp.qmlproject new file mode 100644 index 0000000..6abbd20 --- /dev/null +++ b/Managed App Config/MyApp.qmlproject @@ -0,0 +1,32 @@ +//------------------------------------------------------------------------------ + +import QmlProject 1.1 + +Project { + mainFile: "MyApp.qml" + + QmlFiles { + directory: "." + recursive: true + } + + JavaScriptFiles { + directory: "." + recursive: true + } + + ImageFiles { + directory: "." + recursive: true + } + + Files { + directory: "." + recursive: true + filter: "*.json;*.html;*.txt;*.conf;*.xml" + } + + importPaths: [ + ] +} + diff --git a/Managed App Config/README.md b/Managed App Config/README.md new file mode 100644 index 0000000..a087f9c --- /dev/null +++ b/Managed App Config/README.md @@ -0,0 +1,57 @@ +## Managed App Config + +This sample app demonstrates how to use AppFramework.Management plugin -ManagedAppConfiguration QML type to allow Enterprise Mobility Management (EMM) software to overwrite certain provided default settings. Currently, managed app configuration is only supported on iOS and Android platforms. + +In this sample app, the default portal URL is “www.arcgis.com” and the default portal name is “ArcGIS”. You can upload the app installation file into the EMM software and set the preferred portal URL and name values. The portal URL and name set in the EMM will be shown in the Settings portalURL and Settings portalName field in the sample app. You can see what happens when changing values in EMM software in Settings JSON field. + +To use this feature, you will need to: + +Step 1: Include restriction .xml file for Android and configuration schema .xml file for iOS in your app project folder. In this sample app, the restriction file is "restrictions.xml" and the configuration schema file is "specfile.xml". + +Step 2: Include the management property into the appinfo.json file. You can go to the appinfo.json file, line 82 to check how we add the management property. + +Step 3: Use ManagedAppConfiguration QML type to read policy settings in AppStudio app. + +Step 4: Upload the app to your EMM software and follow the steps provided by your EMM software to setup managed app configuration using key-value pairs. + +Please read this [blog](https://community.esri.com/groups/appstudio/blog/2019/03/04/support-for-managed-app-configuration-with-enterprise-mobility-management-solutions) to learn more. + + + +[Resource Level](https://geonet.esri.com/groups/appstudio/blog/2016/12/06/how-to-describe-our-resources-in-terms-of-difficulty-complexity-and-time-to-digest): 🍌🍌 + + +## Instructions to run this sample in AppStudio Desktop + +1. Download the `.zip` file +2. Unzip and copy this folder into AppStudio Apps folder (Windows: `C:\Users\\ArcGIS\AppStudio\Apps` Mac or linux: `Home\ArcGIS\AppStudio\Apps`) +3. The new app will now appear in the AppStudio Desktop. Run the application or open it in the bundled Qt-Creator IDE to look at the code and modify. + +## Issues + +Find a bug or want to request a new feature? Please let us know by submitting an issue. + +## Contributing + +Esri welcomes contributions from anyone and everyone. Please see our [guidelines for contributing](https://github.com/esri/contributing). + +## Licensing +Copyright 2017 Esri + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + +http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. + +A copy of the license is available in the repository's [license.txt](license.txt) file. + + +[](Esri Tags: ArcGIS Runtime SDK Qt QML JavaScript iOS Android Xamarin Ionic PhoneGap Mac linux Windows Apps samples templates appstudio) +[](Esri Language: Qt QML JavaScript) diff --git a/Managed App Config/appicon.png b/Managed App Config/appicon.png new file mode 100644 index 0000000..39504b9 Binary files /dev/null and b/Managed App Config/appicon.png differ diff --git a/Managed App Config/appinfo.json b/Managed App Config/appinfo.json new file mode 100644 index 0000000..77fb4e1 --- /dev/null +++ b/Managed App Config/appinfo.json @@ -0,0 +1,96 @@ +{ + "arcgisRuntime": 0, + "capabilities": { + "audio": false, + "backgroundAudio": true, + "backgroundBluetoothCentral": false, + "backgroundLocation": false, + "beacon": false, + "biometricAuthentication": false, + "bluetooth": false, + "camera": false, + "fileSharing": false, + "highAccuracyLocation": false, + "ios": { + "backgroundExternalAccessory": false, + "externalAccessoryProtocolStrings": [ + ] + }, + "localnotification": false, + "location": true, + "microphone": false, + "network": true, + "storage": true, + "vibration": false + }, + "deployment": { + "android": { + }, + "arcgisRuntimeExtensionsLicense": "", + "arcgisRuntimeLicense": "", + "ios": { + "codeSignIdentity": "" + }, + "macos": { + "codeSignIdentity": "" + }, + "shortcutName": "", + "uwp": { + }, + "winphone": { + "packageDisplayName": "" + } + }, + "devicesTypes": [ + "desktop", + "tablet", + "phone" + ], + "display": { + "desktop": { + "minimumHeight": 0, + "minimumWidth": 0, + "windowMode": "default" + }, + "enableHighDpi": true, + "phone": { + "landscape": true, + "portrait": true, + "showStatusBar": true + }, + "tablet": { + "landscape": true, + "portrait": true, + "showStatusBar": true + }, + "windows": { + "renderingEngine": "default" + } + }, + "environment": { + }, + "launchUrlSchemes": [ + ], + "mainFile": "MyApp.qml", + "management": { + "android": { + "restrictionFile": "restrictions.xml" + }, + "configurationSchema": "specfile.xml" + }, + "multipleInstances": true, + "projectFile": "MyApp.qmlproject", + "properties": { + }, + "resources": { + "appIcon": "default-app.png", + "launchImageBackground": "launchimage-background.png", + "launchImageBackgroundColor": "#ffffff", + "launchImageOverlay": "launchimage-overlay.png" + }, + "type": "app", + "version": { + "major": 1, + "micro": 1 + } +} diff --git a/Managed App Config/assets/clear.png b/Managed App Config/assets/clear.png new file mode 100644 index 0000000..6b717e0 Binary files /dev/null and b/Managed App Config/assets/clear.png differ diff --git a/Managed App Config/assets/info.png b/Managed App Config/assets/info.png new file mode 100644 index 0000000..c41a5fc Binary files /dev/null and b/Managed App Config/assets/info.png differ diff --git a/Managed App Config/controls/CustomizedText.qml b/Managed App Config/controls/CustomizedText.qml new file mode 100644 index 0000000..94aecbf --- /dev/null +++ b/Managed App Config/controls/CustomizedText.qml @@ -0,0 +1,17 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.1 +import QtQuick.Layouts 1.1 + + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 + +Text { + property string cusText + text: cusText + font.pixelSize: 12 * scaleFactor + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + elide: Text.ElideRight +} + diff --git a/Managed App Config/controls/DescriptionPage.qml b/Managed App Config/controls/DescriptionPage.qml new file mode 100644 index 0000000..0572ab6 --- /dev/null +++ b/Managed App Config/controls/DescriptionPage.qml @@ -0,0 +1,93 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.1 +import QtQuick.Layouts 1.1 + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 + +Item { + id: descPage + width: parent.width + height: parent.height + + Rectangle{ + anchors.fill:parent + + ColumnLayout{ + anchors.fill:parent + spacing: 0 + clip:true + + Rectangle{ + id:descPageheader + color:"#8f499c" + Layout.preferredWidth: parent.width + Layout.preferredHeight: 50 * scaleFactor + + ImageButton { + source: "../assets/clear.png" + height: 30 * scaleFactor + width: 30 * scaleFactor + checkedColor : "transparent" + pressedColor : "transparent" + hoverColor : "transparent" + glowColor : "transparent" + anchors { + right: parent.right + rightMargin: 10 * scaleFactor + verticalCenter: parent.verticalCenter + } + onClicked: { + descPage.visible = 0 + } + } + + Text { + id: aboutApp + text:qsTr("About") + color:"white" + font.pixelSize: app.baseFontSize * 1.1 + font.bold: true + anchors.centerIn: parent + maximumLineCount: 2 + elide: Text.ElideRight + } + } + + Rectangle{ + color:"black" + Layout.fillWidth: true + Layout.fillHeight: true + + Flickable { + anchors.fill:parent + contentHeight: descText.height + clip:true + + Text{ + id: descText + y: 30 * scaleFactor + text:app.info.description + anchors.horizontalCenterOffset: 0 + color:"white" + width: 0.85 * parent.width + horizontalAlignment: Text.AlignLeft + linkColor: "#e5e6e7" + wrapMode: Text.WordWrap + elide: Text.ElideRight + anchors.horizontalCenter: parent.horizontalCenter + font { + pixelSize: app.baseFontSize + } + onLinkActivated: Qt.openUrlExternally(link) + } + } + } + } + } +} + + + + + diff --git a/Managed App Config/controls/HeaderBar.qml b/Managed App Config/controls/HeaderBar.qml new file mode 100644 index 0000000..2ddd736 --- /dev/null +++ b/Managed App Config/controls/HeaderBar.qml @@ -0,0 +1,59 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.1 +import QtQuick.Layouts 1.1 + + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 + +RowLayout{ + anchors.fill: parent + spacing:0 + clip:true + + Rectangle{ + Layout.preferredWidth: 50*scaleFactor + } + + Text { + text:app.info.title + color:"white" + font.pixelSize: app.baseFontSize * 1.1 + font.bold: true + maximumLineCount:2 + wrapMode: Text.Wrap + elide: Text.ElideRight + anchors{ + verticalCenter: parent.verticalCenter + horizontalCenter:parent.horizontalCenter + } + } + + Rectangle{ + id:infoImageRect + Layout.alignment: Qt.AlignRight + Layout.preferredWidth: 50*scaleFactor + + ImageButton { + id:infoImage + source: "../assets/info.png" + height: 30 * scaleFactor + width: 30 * scaleFactor + checkedColor : "transparent" + pressedColor : "transparent" + hoverColor : "transparent" + glowColor : "transparent" + anchors { + centerIn: parent + } + onClicked: { + descPage.visible = 1 + } + } + } +} + + + + + diff --git a/Managed App Config/default-app.png b/Managed App Config/default-app.png new file mode 100644 index 0000000..8fa9021 Binary files /dev/null and b/Managed App Config/default-app.png differ diff --git a/Managed App Config/image b/Managed App Config/image new file mode 100644 index 0000000..e69de29 diff --git a/Managed App Config/iteminfo.json b/Managed App Config/iteminfo.json new file mode 100644 index 0000000..5accf58 --- /dev/null +++ b/Managed App Config/iteminfo.json @@ -0,0 +1,54 @@ +{ + "access": "public", + "accessInformation": null, + "appCategories": [ + ], + "avgRating": 0, + "banner": null, + "categories": [ + ], + "commentsEnabled": true, + "created": 1551467725000, + "culture": "en-au", + "description": "\n

This sample app demonstrates how to use AppFramework.Management plugin -ManagedAppConfiguration QML type to allow Enterprise Mobility Management (EMM) software to overwrite certain provided default settings. Currently, managed app configuration is only supported on iOS and Android platforms. 

\n

 

\n

In this sample app, the default portal URL is “www.arcgis.com” and the default portal name is “ArcGIS”. You can upload the app installation file into the EMM software and set the preferred portal URL and name values. The portal URL and name set in the EMM will be shown in the Settings portalURL and Settings portalName field in the sample app. You can see what happens when changing values in EMM software in Settings JSON field. 

\n

 

\n

To use this feature, you will need to:

\n

 

\n

Step 1:  Include restriction .xml file for Android and configuration schema .xml file for iOS in your app project folder. In this sample app, the restriction file is "restrictions.xml" and the configuration schema file is "specfile.xml".

\n

 

\n

Step 2: Include the management property into the appinfo.json file. You can go to the appinfo.json file, line 82 to check how we add the management property.   

\n

 

\n

Step 3: Use ManagedAppConfiguration QML type to read policy settings in AppStudio app.

\n

 

\n

Step 4: Upload the app to your EMM software and follow the steps provided by your EMM software to setup managed app configuration using key-value pairs.

\n

 

\n


", + "documentation": null, + "extent": [ + ], + "groupDesignations": null, + "guid": null, + "industries": [ + ], + "itemControl": "admin", + "languages": [ + ], + "largeThumbnail": null, + "licenseInfo": null, + "listed": false, + "modified": 1551469253000, + "numComments": 2, + "numRatings": 0, + "numViews": 3, + "orgId": "2U3NfasNQ9o9LkLt", + "properties": null, + "protected": false, + "proxyFilter": null, + "scoreCompleteness": 83, + "screenshots": [ + ], + "size": 37768, + "snippet": "This sample app demonstrates how to use AppFramework.Management plugin -ManagedAppConfiguration QML type to allow Enterprise Mobility Management (EMM) software to overwrite certain provided default settings", + "spatialReference": null, + "thumbnail": "thumbnail/thumbnail.png", + "title": "Managed App Config", + "type": "Native Application", + "typeKeywords": [ + "API_QML", + "App", + "Application", + "AppStudio", + "Configuration", + "Native", + "qml" + ], + "url": null +} diff --git a/Managed App Config/qtquickcontrols2.conf b/Managed App Config/qtquickcontrols2.conf new file mode 100644 index 0000000..1ddd1cd --- /dev/null +++ b/Managed App Config/qtquickcontrols2.conf @@ -0,0 +1,10 @@ +; This file can be edited to change the style of the application +; See Styling Qt Quick Controls 2 in the documentation for details: +; http://doc.qt.io/qt-5/qtquickcontrols2-styles.html + +[Controls] +Style=Material + +[Universal] +Theme=Light +;Accent=Steel diff --git a/Managed App Config/restrictions.xml b/Managed App Config/restrictions.xml new file mode 100644 index 0000000..248fe03 --- /dev/null +++ b/Managed App Config/restrictions.xml @@ -0,0 +1,16 @@ + + + + + + + + diff --git a/Managed App Config/specfile.xml b/Managed App Config/specfile.xml new file mode 100644 index 0000000..522f0d5 --- /dev/null +++ b/Managed App Config/specfile.xml @@ -0,0 +1,37 @@ + + + 1.0.0 + com.esri.appstudioapp + + + + www.arcgis.com + + + + + ArcGIS + + + + + + + + + + + + + + + + + + diff --git a/Managed App Config/thumbnail.png b/Managed App Config/thumbnail.png new file mode 100644 index 0000000..ec4184f Binary files /dev/null and b/Managed App Config/thumbnail.png differ diff --git a/Status Bar/MyApp.qml b/Status Bar/MyApp.qml new file mode 100644 index 0000000..569b5fe --- /dev/null +++ b/Status Bar/MyApp.qml @@ -0,0 +1,207 @@ +/* Copyright 2017 Esri + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +import QtQuick 2.9 +import QtQuick.Layouts 1.1 +import QtQuick.Controls 2.2 +import QtQuick.Controls.Material 2.2 +import QtGraphicalEffects 1.0 +import QtQuick.Dialogs 1.2 +import QtQuick.Layouts 1.3 + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Platform 1.0 + +import "controls" as Controls + +AppLayout { + id: appLayout + width: 400 + height: 750 + + delegate: App { + id: app + height: appLayout.height + width: appLayout.width + + function units(value) { + return AppFramework.displayScaleFactor * value + } + + property real scaleFactor: AppFramework.displayScaleFactor + property int baseFontSize : app.info.propertyValue("baseFontSize", 15 * scaleFactor) + (isSmallScreen ? 0 : 3) + property bool isSmallScreen: (width || height) < units(400) + + StackView { + id: stackView + initialItem: landingPage + anchors.fill: parent + } + + Component { + id: landingPage + + Page { + header: ToolBar { + id:header + width: parent.width + height: 50 * app.scaleFactor + Material.background: Material.color(Material.Purple) + Material.elevation: 0 + Controls.HeaderBar{} + } + + Rectangle { + anchors.margins: 5 * app.scaleFactor + anchors.fill: parent + color:"#F5F5F5" + + // sample starts here ------------------------------------------------------------------ + + ColumnLayout { + id: contentColumn + anchors.fill: parent + spacing: 20 * app.scaleFactor + + Item { + Layout.preferredHeight: 20 * app.scaleFactor + } + + ComboBox { + id: colorBox + Layout.alignment: Qt.AlignHCenter + displayText: "Color: " + currentText + currentIndex: Material.Purple + Layout.preferredWidth: parent.width * 0.7 + + model: ListModel { + ListElement { name: "Red" } + ListElement { name: "Pink" } + ListElement { name: "Purple" } + ListElement { name: "DeepPurple" } + ListElement { name: "Indigo" } + ListElement { name: "Blue" } + ListElement { name: "LightBlue" } + ListElement { name: "Cyan" } + ListElement { name: "Teal" } + ListElement { name: "Green" } + ListElement { name: "LightGreen" } + ListElement { name: "Lime" } + ListElement { name: "Yellow" } + ListElement { name: "Amber" } + ListElement { name: "Orange" } + ListElement { name: "DeepOrange" } + ListElement { name: "Brown" } + ListElement { name: "Grey" } + ListElement { name: "BlueGrey" } + } + + delegate: ItemDelegate { + id: colorDelegate + text: modelData + width: colorBox.popup.width + + Rectangle { + anchors.fill: parent + parent: colorDelegate.background + color: Material.color(index) + } + } + + onCurrentIndexChanged: { + StatusBar.color = Material.color(colorBox.currentIndex) + } + } + + ComboBox { + id: themeBox + Layout.alignment: Qt.AlignHCenter + displayText: "Theme: " + currentText + currentIndex: Material.Dark + Layout.preferredWidth: parent.width * 0.7 + + model: ListModel { + ListElement { name: "Light" } + ListElement { name: "Dark" } + } + + delegate: ItemDelegate { + id: themeDelegate + text: modelData + width: themeBox.popup.width + } + + onCurrentIndexChanged: { + StatusBar.theme = themeBox.currentIndex + } + } + + Button { + Layout.alignment: Qt.AlignHCenter + Layout.preferredWidth: parent.width * 0.7 + text: "reset" + + onClicked: { + StatusBar.theme = Material.Dark + themeBox.currentIndex = Material.Dark + StatusBar.color = Material.color(Material.Purple) + colorBox.currentIndex = Material.Purple + } + } + + Item { + Layout.preferredHeight: 10 * app.scaleFactor + } + + + Label { + text: "Note: Status bars are not displayed by default on devices; it first has to be enabled by setting the property display.statusBar to true in the app's appinfo.json." + Layout.alignment: Qt.AlignHCenter + Layout.preferredWidth: parent.width * 0.7 + wrapMode: Label.Wrap + } + + Item { + Layout.fillHeight: true + Layout.fillWidth: true + } + } + } + + + contentItem: Rectangle { + anchors.top:header.bottom + } + } + } + + // sample ends here -------------------------------------------------------- + + Component { + id: descriptionPage + + Controls.DescriptionPage { + id: descPage + } + } + } + + Component.onCompleted: { + StatusBar.theme = Material.Dark + StatusBar.color = Material.color(Material.Purple) + } +} + diff --git a/Status Bar/MyApp.qmlproject b/Status Bar/MyApp.qmlproject new file mode 100644 index 0000000..b8ff5f5 --- /dev/null +++ b/Status Bar/MyApp.qmlproject @@ -0,0 +1,32 @@ +//------------------------------------------------------------------------------ + +import QmlProject 1.1 + +Project { + mainFile: "MyApp.qml" + + QmlFiles { + directory: "." + recursive: true + } + + JavaScriptFiles { + directory: "." + recursive: true + } + + ImageFiles { + directory: "." + recursive: true + } + + Files { + directory: "." + recursive: true + filter: "*.json;*.html;*.txt" + } + + importPaths: [ + ] +} + diff --git a/Status Bar/README.md b/Status Bar/README.md new file mode 100644 index 0000000..7cd2462 --- /dev/null +++ b/Status Bar/README.md @@ -0,0 +1,41 @@ +## Status Bar + +This sample demonstrates how to change status bar color and theme using the StatusBar component, which is included in the ArcGIS.AppFramework.Platform plugin. In addition, AppLayout component, which is included in the ArcGIS.AppFramework.Platform plugin is used along with the StatusBar component to handle various heights of the status bar across devices. + +[Resource Level](https://geonet.esri.com/groups/appstudio/blog/2016/12/06/how-to-describe-our-resources-in-terms-of-difficulty-complexity-and-time-to-digest): 🍌🍌 + + +## Instructions to run this sample in AppStudio Desktop + +1. Download the `.zip` file +2. Unzip and copy this folder into AppStudio Apps folder (Windows: `C:\Users\\ArcGIS\AppStudio\Apps` Mac or linux: `Home\ArcGIS\AppStudio\Apps`) +3. The new app will now appear in the AppStudio Desktop. Run the application or open it in the bundled Qt-Creator IDE to look at the code and modify. + +## Issues + +Find a bug or want to request a new feature? Please let us know by submitting an issue. + +## Contributing + +Esri welcomes contributions from anyone and everyone. Please see our [guidelines for contributing](https://github.com/esri/contributing). + +## Licensing +Copyright 2017 Esri + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + +http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. + +A copy of the license is available in the repository's [license.txt](license.txt) file. + + +[](Esri Tags: ArcGIS Runtime SDK Qt QML JavaScript iOS Android Xamarin Ionic PhoneGap Mac linux Windows Apps samples templates appstudio) +[](Esri Language: Qt QML JavaScript) diff --git a/Status Bar/appicon.png b/Status Bar/appicon.png new file mode 100644 index 0000000..39504b9 Binary files /dev/null and b/Status Bar/appicon.png differ diff --git a/Status Bar/appinfo.json b/Status Bar/appinfo.json new file mode 100644 index 0000000..7a64562 --- /dev/null +++ b/Status Bar/appinfo.json @@ -0,0 +1,101 @@ +{ + "arcgisRuntime": 0, + "capabilities": { + "audio": false, + "backgroundModes": { + "audio": { + "enabled": false + }, + "bluetooth": { + "central": { + "enabled": false + } + }, + "location": { + "enabled": true + } + }, + "beacon": false, + "biometricAuthentication": false, + "bluetooth": false, + "camera": false, + "fileSharing": false, + "highAccuracyLocation": false, + "ios": { + "backgroundExternalAccessory": false, + "externalAccessoryProtocolStrings": [ + ] + }, + "localnotification": false, + "location": true, + "microphone": false, + "network": true, + "storage": false, + "vibration": false + }, + "deployment": { + "android": { + }, + "arcgisRuntimeExtensionsLicense": "", + "arcgisRuntimeLicense": "", + "ios": { + "codeSignIdentity": "" + }, + "macos": { + "codeSignIdentity": "" + }, + "shortcutName": "", + "uwp": { + }, + "winphone": { + "packageDisplayName": "" + } + }, + "devicesTypes": [ + "desktop", + "tablet", + "phone" + ], + "display": { + "desktop": { + "minimumHeight": 0, + "minimumWidth": 0, + "windowMode": "default" + }, + "enableHighDpi": true, + "phone": { + "landscape": true, + "portrait": true, + "showStatusBar": true + }, + "statusBar": true, + "tablet": { + "landscape": true, + "portrait": true, + "showStatusBar": true + }, + "windows": { + "renderingEngine": "default" + } + }, + "environment": { + }, + "launchUrlSchemes": [ + ], + "mainFile": "MyApp.qml", + "multipleInstances": true, + "projectFile": "MyApp.qmlproject", + "properties": { + }, + "resources": { + "appIcon": "default-app.png", + "launchImageBackground": "launchimage-background.png", + "launchImageBackgroundColor": "#ffffff", + "launchImageOverlay": "launchimage-overlay.png" + }, + "type": "app", + "version": { + "major": 1, + "micro": 1 + } +} diff --git a/Status Bar/assets/clear.png b/Status Bar/assets/clear.png new file mode 100644 index 0000000..6b717e0 Binary files /dev/null and b/Status Bar/assets/clear.png differ diff --git a/Status Bar/assets/info.png b/Status Bar/assets/info.png new file mode 100644 index 0000000..c41a5fc Binary files /dev/null and b/Status Bar/assets/info.png differ diff --git a/Status Bar/controls/DescriptionPage.qml b/Status Bar/controls/DescriptionPage.qml new file mode 100644 index 0000000..af2933e --- /dev/null +++ b/Status Bar/controls/DescriptionPage.qml @@ -0,0 +1,91 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.2 +import QtQuick.Controls.Material 2.2 +import QtQuick.Layouts 1.1 + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 +import ArcGIS.AppFramework.Platform 1.0 + +Item { + id: descPage + width: desAppLayout.width + height: desAppLayout.height + + Rectangle { + anchors.fill:parent + + ColumnLayout { + anchors.fill:parent + spacing: 0 + clip:true + + Rectangle { + id:descPageheader + color: Material.color(Material.Purple) + Layout.preferredWidth: parent.width + Layout.preferredHeight: 50 * app.scaleFactor + + ImageButton { + source: "../assets/clear.png" + height: 30 * app.scaleFactor + width: 30 * app.scaleFactor + checkedColor : "transparent" + pressedColor : "transparent" + hoverColor : "transparent" + glowColor : "transparent" + anchors { + right: parent.right + rightMargin: 10 * app.scaleFactor + verticalCenter: parent.verticalCenter + } + onClicked: { + stackView.pop() + // descPage.visible = 0 + } + } + + Text { + id: aboutApp + text:qsTr("About") + color:"white" + font.pixelSize: app.baseFontSize * 1.1 + font.bold: true + anchors.centerIn: parent + maximumLineCount: 2 + elide: Text.ElideRight + } + } + + Rectangle{ + color:"black" + Layout.fillWidth: true + Layout.fillHeight: true + + Flickable { + anchors.fill:parent + contentHeight: descText.height + clip:true + + Text{ + id: descText + y: 30 * app.scaleFactor + text:app.info.description + anchors.horizontalCenterOffset: 0 + color:"white" + width: 0.85 * parent.width + horizontalAlignment: Text.AlignLeft + linkColor: "#e5e6e7" + wrapMode: Text.WordWrap + elide: Text.ElideRight + anchors.horizontalCenter: parent.horizontalCenter + font { + pixelSize: app.baseFontSize + } + onLinkActivated: Qt.openUrlExternally(link) + } + } + } + } + } +} diff --git a/Status Bar/controls/HeaderBar.qml b/Status Bar/controls/HeaderBar.qml new file mode 100644 index 0000000..08fbab0 --- /dev/null +++ b/Status Bar/controls/HeaderBar.qml @@ -0,0 +1,70 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.2 +import QtQuick.Controls.Material 2.2 +import QtQuick.Layouts 1.1 + +import ArcGIS.AppFramework 1.0 +import ArcGIS.AppFramework.Controls 1.0 + + +RowLayout { + anchors.fill: parent + spacing:0 + clip:true + + Item { + Layout.preferredWidth: 50 * app.scaleFactor + } + + Item { + Layout.fillWidth: true + } + + Text { + text:app.info.title + color:"white" + font.pixelSize: app.baseFontSize + font.bold: true + maximumLineCount:2 + wrapMode: Text.Wrap + elide: Text.ElideRight + Layout.alignment: Qt.AlignHCenter + } + + Item { + Layout.fillWidth: true + } + + Item { + id: infoIcon + Layout.preferredWidth: 50 * app.scaleFactor + + Rectangle { + id:infoImageRect + anchors.fill: parent + + ImageButton { + id:infoImage + source: "../assets/info.png" + height: 30 * app.scaleFactor + width: 30 * app.scaleFactor + checkedColor : "transparent" + pressedColor : "transparent" + hoverColor : "transparent" + glowColor : "transparent" + anchors { + centerIn: parent + } + onClicked: { + stackView.push(descriptionPage) +// descPage.visible = 1 + } + } + } + } +} + + + + + diff --git a/Status Bar/default-app.png b/Status Bar/default-app.png new file mode 100644 index 0000000..8fa9021 Binary files /dev/null and b/Status Bar/default-app.png differ diff --git a/Status Bar/image b/Status Bar/image new file mode 100644 index 0000000..e69de29 diff --git a/Status Bar/iteminfo.json b/Status Bar/iteminfo.json new file mode 100644 index 0000000..fef87c9 --- /dev/null +++ b/Status Bar/iteminfo.json @@ -0,0 +1,55 @@ +{ + "access": "public", + "accessInformation": null, + "appCategories": [ + ], + "avgRating": 0, + "banner": null, + "categories": [ + ], + "commentsEnabled": true, + "created": 1553205148000, + "culture": "en-au", + "description": "\n

This sample demonstrates how to change status bar color and theme using the StatusBar component, which is included in the ArcGIS.AppFramework.Platform plugin. In addition, AppLayout component, which is included in the ArcGIS.AppFramework.Platform plugin is used along with the StatusBar component to handle various heights of the status bar across devices.   

\n


\n

Resource Level:🍌

", + "documentation": null, + "extent": [ + ], + "groupDesignations": null, + "guid": null, + "industries": [ + ], + "isOrgItem": true, + "itemControl": "admin", + "languages": [ + ], + "largeThumbnail": null, + "licenseInfo": null, + "listed": false, + "modified": 1554226723000, + "numComments": 3, + "numRatings": 0, + "numViews": 10, + "orgId": "2U3NfasNQ9o9LkLt", + "properties": null, + "protected": false, + "proxyFilter": null, + "scoreCompleteness": 81, + "screenshots": [ + ], + "size": 35288, + "snippet": "This sample demonstrates how to change status bar color and theme", + "spatialReference": null, + "thumbnail": "thumbnail/thumbnail.png", + "title": "Status Bar", + "type": "Native Application", + "typeKeywords": [ + "API_QML", + "App", + "Application", + "AppStudio", + "Configuration", + "Native", + "qml" + ], + "url": null +} diff --git a/Status Bar/qtquickcontrols2.conf b/Status Bar/qtquickcontrols2.conf new file mode 100644 index 0000000..1ddd1cd --- /dev/null +++ b/Status Bar/qtquickcontrols2.conf @@ -0,0 +1,10 @@ +; This file can be edited to change the style of the application +; See Styling Qt Quick Controls 2 in the documentation for details: +; http://doc.qt.io/qt-5/qtquickcontrols2-styles.html + +[Controls] +Style=Material + +[Universal] +Theme=Light +;Accent=Steel diff --git a/Status Bar/thumbnail.png b/Status Bar/thumbnail.png new file mode 100644 index 0000000..42f75a2 Binary files /dev/null and b/Status Bar/thumbnail.png differ