AppStudio AppFramework enthält mehrere Komponenten für den Zugriff auf standardmäßige und bekannte Systemfunktionen. Diese Komponenten sind für die Verwendung dieser Funktionen in der App zwar nicht erforderlich, ihre Implementierung sollte jedoch in Erwägung gezogen werden, wenn Sie planen, diese Funktionen zu verwenden.
Clipboard
Standardmäßig kann eine AppStudio-App auf die Funktionen "Ausschneiden", "Kopieren" und "Einfügen" der Systemzwischenablage zugreifen. Sie müssen hierfür keinen Code schreiben. Bei komplexeren Workflows mit der Zwischenablage, beispielsweise zum Kopieren von Elementen wie Farben und JavaScript-Objekten, stellt die Komponente Clipboard einen detaillierteren Zugriff auf die Systemzwischenablage bereit.
Die Komponente Clipboard enthält mehrere Eigenschaften und Methoden für die Rückgabe von Inhalt der Systemzwischenablage, je nachdem, welche Daten darin gespeichert sind. Nach Möglichkeit gibt die Eigenschaft text den Inhalt als Zeichenfolge in Klartext ohne Formatierung und gegebenenfalls mit sichtbarem HTML zurück. Dies ist von den Inhalten der Zwischenablage abhängig.
TextArea {
id: textArea
Layout.fillWidth: true
Layout.fillHeight: true
text: AppFramework.clipboard.text
readOnly: true
}Die Eigenschaft html ist jedoch hauptsächlich für das Lesen und Anzeigen von HTML-Inhalt bestimmt. Diese Eigenschaft kann auch komplexere Textformatierungen lesen und speichern. Im folgenden Codebeispiel wird dies genutzt, indem die Eigenschaft an einen Textbereich mit aktiviertem Rich-Text-Format angefügt wird.
TextArea {
id: htmlTextArea Layout.fillWidth: true Layout.fillHeight: true text: AppFramework.clipboard.html textFormat: Text.RichText readOnly: true
}Farbwerte werden als ein application/x-color-MIME-Typ gespeichert und können nur von der Eigenschaft color geschrieben oder zurückgegeben werden.
Die Komponente Clipboard hat keine Möglichkeit, mit Bildern in der Systemzwischenablage zu interagieren (allerdings gibt die Eigenschaft text je nach Quelle möglicherweise eine URL zurück). Stattdessen stellt die Komponente ImageObject die Methoden copyFromClipboard und pasteFromClipboard für die Interaktion bereit.
Flow {
Layout.fillWidth: true ImageObject {
id: imageObject }
Button {
text: "Clear Image"
enabled: !imageObject.empty onClicked: {
imageObject.clear();
}
}
Button {
text: "Copy"
enabled: !imageObject.empty onClicked: {
imageObject.copyToClipboard();
}
}
Button {
text: "Paste"
enabled: imageObject.canPasteFromClipboard onClicked: {
imageObject.pasteFromClipboard();
}
}
}Freigabefunktionalität
Sie können Text, URLs oder Dateien für andere Apps freigeben, indem Sie die Freigabefunktionalität verwenden, die in AppFramework Clipboard zur Verfügung gestellt wird. Die share-Methode der Clipboard-Komponente dient zur Freigabe von Eingabetext oder URLs. Bei der Freigabe einer Datei mit der share-Methode müssen Sie die URL des Dateispeicherortes angeben. Der folgende Codeausschnitt veranschaulicht die Verwendung dieser Methode, indem der eingegebene Text in einem Textfeld freigegeben wird.
property url shareURL
TextField {
id: inputText placeholderText: "Enter something to share"
}
Button {
text: "Share as text"
onClicked: {
AppFramework.clipboard.share(inputText.text) }
}
Button {
text: "Share as Url"
onClicked: {
shareURL = inputText.text AppFramework.clipboard.share(shareURL) }
}Diese Funktion wird derzeit nur auf macOS-, iOS- und Android-Plattformen unterstützt.
Ein Beispiel für die Verwendung dieser Funktion finden Sie in der Beispiel-App, die in ArcGIS AppStudio verfügbar ist, oder im Repository für AppStudio-Beispiele in GitHub.
Gebietsschemainformationen
Bei den Gebietsschemainformationen handelt es sich um einen standardisierten Wert, mit dem eine Sprache oder ein Dialekt angegeben wird. Dies beinhaltet auch Details wie das verwendete Alphabet, Dezimaltrennzeichen und Datumsformat. Mit einem gültigen Gebietsschemacode können Sie das Standardgebietsschema des Systems überschreiben und eine Reihe wichtiger Methoden zur Anzeige von Informationen in der App bereitstellen.
Diese Gebietsschemas können mit der Komponente LocaleInfo, die Eigenschaften zur Definition eines Gebietsschemas sowie zur konsistenten Zuordnung des Gebietsschemas für alle Standards und weiteren App-Abschnitte enthält, an die App übergeben werden. Beispiel: In AppStudio wird LocaleInfo verwendet, um die Sprache eines Dialogfeldes zur OAuth-Anmeldung für ArcGIS Online zu bestimmen. Instanziieren Sie hierzu zuerst LocaleInfo, und geben Sie sowohl das ursprüngliche Gebietsschema als auch die Änderung des Gebietsschemas an.
property string localeName
property string oauthUrlFormat: "https://www.arcgis.com/sharing/rest/oauth2/authorize?client_id=arcgisonline&redirect_uri=http://www.arcgis.com&response_type=token&locale=%1"
property url oauthUrl
Component.onCompleted: {
// Get the current Locale from the system's locale settings
localeName = Qt.locale().name;
}
LocaleInfo {
id: localeInfo
name: localeName
// update the properties and the OAuth page when the app Locale is changed
onLocaleChanged: {
localeInfoModel.update(localeInfo);
oauthUrl = oauthUrlFormat.arg(esriName);
if (oauthTab.item) {
oauthTab.item.url = oauthUrl;
}
}
}Zum Aktualisieren des Gebietsschemas der App fügen Sie ein Textfeld sowohl für die Anzeige als auch für die Bearbeitung des Gebietsschemas hinzu.
Text {
text: "Locale search"
}
// locale Name provided by the user for the app e.g. fr-Fr, en-GB, de_DE TextField {
id: localeField Layout.fillWidth: true text: localeName placeholderText: "Locale"
onEditingFinished: {
localeName = text;
}
function update(name) {
text = name;
editingFinished();
}
}Da die anderen Eigenschaften von LocaleInfo während der Synchronisierung nicht aktualisiert werden, ist hierzu eine Funktion erforderlich. Für diesen Workflow steht die Funktion zudem in einem Listenmodell bereit, das in der Benutzeroberfläche angezeigt werden kann.
// Model to list the properties associated with the LocaleInfo ListModel {
id: localeInfoModel // function to update the properties when the Locale is changed in the textbox function update(localeInfo) {
clear();
add("name", localeInfo.name);
add("ietfName", localeInfo.ietfName);
add("esriName", localeInfo.esriName);
add("languageName", localeInfo.languageName);
add("languageCode", localeInfo.languageCode);
add("countryName", localeInfo.countryName);
add("countryCode", localeInfo.countryCode);
add("scriptName", localeInfo.scriptName);
add("scriptCode", localeInfo.scriptCode);
}
function add(name, value) {
append({
name: name, value: value.toString() });
}
}Wenn die Einrichtung des Listenmodells abgeschlossen ist, können Sie einer OAuth-Anmeldung eine Webansicht hinzufügen, in der das im oben erwähnten Textfeld deklarierte Gebietsschema angezeigt wird. In diesem Fall erfolgt die Anzeige der Webansicht als Bestandteil einer Registerkartenansicht neben der obigen Liste der LocaleInfo-Eigenschaften.
TabView {
Layout.fillWidth: true Layout.fillHeight: true
Tab {
id: localeInfoTab title: "LocaleInfo"
TableView {
model: localeInfoModel
TableViewColumn {
role: "name"
title: "Property"
}
TableViewColumn {
role: "value"
title: "Value"
}
}
}
Tab {
id: oauthTab title: "Sign In Page"
WebView {
// Load the OAuth url in the webView. Component.onCompleted: {
url = oauthUrl;
}
}
}
}Die Steuerung des Gebietsschemacodes und die entsprechende Änderung der App-Darstellung sind nur ein Teil des Lokalisierungsprozesses. Weitere Informationen finden Sie unter Globalisieren Ihrer App.
URLs
Für komplexe Vorgänge mit URLs stellt die Komponente UrlInfo Eigenschaften und Methoden zum Konstruieren und Dekonstruieren von URLs bereit. Diese Eigenschaften und Methoden können verwendet werden, um eine URL dynamisch zu konstruieren oder einzelne Komponenten von einer URL abzuleiten. Im folgenden Codeabschnitt wird gezeigt, wie Sie mit UrlInfo Abfrageparameter aus einer URL extrahieren können. In diesem Fall handelt es sich um einen Feature-Service. Änderungen, die bei der Ausführung der Beispiel-App an der extrahierten Abfrage vorgenommen werden, werden anschließend neu zusammengesetzt und als neue URL dargestellt.
Column {
id: cl width: parent.width spacing: 5
UrlInfo {
id: urlInfo }
Text {
text: "Your initial URL:"
wrapMode: Text.WrapAnywhere width: parent.width }
TextArea {
id: urlField selectByMouse: true cursorPosition: 1 wrapMode: "Wrap"
width: parent.width font.pixelSize: 10 horizontalAlignment :TextInput.AlignLeft text:"https://csmgisweb.smgov.net/csmgis01/rest/services/admin_boundaries/zoning/MapServer/0/query?objectIds=99,100&time=&geometry=&geometryType=esriGeometryPoint&inSR=&spatialRel=esriSpatialRelContains&f=html"
onTextChanged: {
urlInfo.fromUserInput(text);
}
}
CheckBox {
text: "<b>Is a query present?</b>"
checked: urlInfo.hasQuery enabled: false padding: 0 }
Text {
text: "<b>The query for your URL</b>: "
wrapMode: Text.WrapAnywhere width: parent.width }
Text {
text: "Edit the query, and the URL below it will update with your changes."
wrapMode: Text.WrapAnywhere width: parent.width }
TextArea {
id: queryField text: JSON.stringify(urlInfo.queryParameters, undefined, 2) wrapMode: Text.WrapAnywhere width: parent.width
onTextChanged: {
urlInfo.queryParameters = JSON.parse(text);
}
}
Text {
text: "<b>Your URL with updated query:<b>"
wrapMode: Text.WrapAnywhere width: parent.width }
TextField {
id: reQueried text: urlInfo.url wrapMode: Text.WrapAnywhere width: parent.width }
}