يحتوي AppStudio AppFramework على مكونات عديدة توفر الوصول إلى وظائف النظام المعروفة والقياسية. في حين أن هذه المكونات غير مطلوبة لاستخدام هذه الوظائف في التطبيق، يجب مراعاة تنفيذ المكونات أثناء التخطيط لاستخدام هذه الوظائف.
الحافظة
وافتراضيًا، لا يوجد ما يمنع أي تطبيق AppStudio من الوصول إلى وظائف القص والنسخ واللصق في حافظة النظام، ولن تلجأ إلى كتابة أي كود إذا كان هذا هو غرضك. لمزيد من دورات سير العمل المُعقّدة التي تتضمن الحافظة، بما في ذلك نسخ عنصر مثل الألوان وكائنات JavaScript، يوفر مكون Clipboard وصولاً أكثر تفصيلاً لحافظة النظام.
يحتوي مكون Clipboard على خصائص ووسائل عديدة لإرجاع محتويات حافظة النظام، اعتمادًا على نوع البيانات المخزنة فيها. تقوم خاصية text بإرجاع المحتويات في شكل نص عادي إن أمكن، دون تنسيق ومن المحتمل بـ HTML مرئي، وذلك اعتمادًا على محتويات الحافظة.
TextArea {
id: textArea
Layout.fillWidth: true
Layout.fillHeight: true
text: AppFramework.clipboard.text
readOnly: true
}
وعلى الرغم من ذلك، يتم استخدام خاصية html بشكل أساسي في قراءة محتوى HTML وعرضه. بإمكان هذه الخاصية أيضًا قراءة تنسيق نص أكثر تعقيدًا والاحتفاظ به، وهو ما يستخدمه نموذج الكود التالي بإرفاق الخاصية لمنطقة نصية بتنسيق غني مُمكَّن.
TextArea {
id: htmlTextArea Layout.fillWidth: true Layout.fillHeight: true text: AppFramework.clipboard.html textFormat: Text.RichText readOnly: true
}
يتم تخزين قيم اللون على أنها نوع application/x-color MIME، ولا يمكن كتابتها أو إرجاعها إلا بخاصية color.
لا يوجد لدى مكون Clipboard أي وسيلة للتفاعل مع الصور في حافظة النظام (وعلى الرغم من الاعتماد على المصدر، فإن خاصية text قد تُرجِع عنوان URL). وبدلاً من ذلك، يوفر مكون ImageObject طريقة copyFromClipboard وطريقة pasteFromClipboard للتقاطع.
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();
}
}
}
وظيفة المشاركة
يمكنك مشاركة النص أو عناوين URL أو الملفات مع التطبيقات الأخرى باستخدام وظيفة المشاركة التي توفرها حافظة AppFramework. تُستخدَم طريقة share الخاصة بمكون "الحافظة" لمشاركة أي نص مدخل أو عنوان URL. في حال مشاركة ملف، تحتاج طريقة share أن توفر عنوان URL لموقع الملف. تعرض قصاصة الكود التالية كيفية استخدام هذه الطريقة ومشاركة النص المُدخَل في حقل نصي.
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) }
}
وحاليًا، لا يتم دعم هذه الوظيفة إلا في أنظمة macOS وiOS وAndroid.
وكمثال على هذه الوظيفة عندما تكون قيد الاستخدام، راجع نموذج التطبيق المتاح في ArcGIS AppStudio أو في مستودع GitHub لنماذج AppStudio.
معلومات الإعدادات المحلية
الإعدادات المحلية هي قيمة موحدة توضح لغة أو لهجة، بما في ذلك التفاصيل، مثل الأبجدية المستخدمة والعلامات العشرية وتنسيق التاريخ. وباستخدام كود إعدادات محلية صحيح، يمكنك تجاوز الإعدادات المحلية الافتراضية للنظام، وتوفير عدد من الوسائل الهامة التي ستعرضها المعلومات في تطبيقك.
يمكن نقل هذه الإعدادات المحلية إلى التطبيق من خلال استخدام مكون LocaleInfo الذي يحتوي على خصائص لتحديد الإعدادات المحلية، وكذلك تخطيط الإعدادات المحلية بشكل دائم من خلال مقاييس التطبيق وأقسامه الأخرى. في AppStudio، يتمثل أحد الأمثلة في استخدام LocaleInfo لتحديد لغة مربع حوار تسجيل دخول OAuth في ArcGIS Online. وللقيام بذلك، أنشئ مثيلاً لـ LocaleInfo أولاً، وأبلغه بالإعدادات المحلية الأولية، وكذلك عند تغيير الإعدادات المحلية.
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;
}
}
}
لتحديث الإعدادات المحلية للتطبيق، أضف حقلاً نصيًا لعرض الإعدادات المحلية وتحريرها.
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();
}
}
ونظرًا لعدم تحديث خصائص LocaleInfo الأخرى أثناء التزامن، يجب وجود وظيفة لتحديثها. ولأغراض سير العمل، ستكون الوظيفة في نموذج قائمة يمكن عرضه في واجهة المستخدم.
// 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() });
}
}
وبعد إعداد نموذج القائمة، يمكنك إضافة عرض ويب إلى تسجيل دخول oAuth، وهو ما سيُعرَض في الإعدادات المحلية الموضحة في الحقل النصي السابق. في هذه الحالة، يُعرَض عرض الويب كجز من عرض علامة تبويب بجانب قائمة خصائص LocaleInfo أعلاه.
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;
}
}
}
}
يرجى العلم أن التحكم في كود الإعدادات المحلية وتغيير تمثيل التطبيق الذي يعتمد عليه ما هما إلا جزء من عملية التعريب. لمزيد من المعلومات، راجع موضوع عولمة التطبيق.
عناوين URL
لتنفيذ عمليات معقدة بعناوين URL، يوفر مكون UrlInfo خصائص ووسائل إنشاء عناوين URL وتحليلها. يمكن استخدام هذه الخصائص والطرق لإنشاء عنوان URL ديناميكيًا أو اشتقاق المكونات الفردية لأحدها.. يوضح القسم التالي من التعليمات البرمجية كيفية استخدام UrlInfo لاستخراج معلمات استعلام من عنوان URL، وهي في هذه الحالة خدمة المعالم. ثم يتم إعادة تجميع التعديلات التي تم إجراؤها على الاستعلام المستخرج عند تشغيل نموذج التطبيق وتقديمه كعنوان URL جديد.
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 }
}