O AppStudio AppFramework contém vários componentes que fornecem acesso às funções de sistema padrão e bem conhecidas. Embora estes componentes não sejam necessários para utilizar estas funções em seu aplicativo, a implementação de componentes deve ser considerada quando planejar o uso destas funções.
Área de transferência
Por padrão, não há nada que impeça um aplicativo do AppStudio de acessar as funções de cortar, copiar e colar da área de transferência do sistema, e você não precisa escrever nenhum código se esta for sua intenção. Para fluxos de trabalhos mais complexos envolvendo a área de transferência, incluindo copiar itens como cores e objetos JavaScript, o componente Clipboard fornece o acesso mais detalhado para a área de transferência do sistema.
O componente Clipboard contém múltiplas propriedades e métodos para retornar o conteúdo da área de transferência do sistema, dependendo do tipo de dados armazenados nele. A propriedade text retorna o conteúdo como uma string de texto se possível, sem formatação e potencialmente com HTML visíveis, dependendo do conteúdo da área de transferência.
TextArea {
id: textArea
Layout.fillWidth: true
Layout.fillHeight: true
text: AppFramework.clipboard.text
readOnly: true
}A propriedade html , no entanto, destina-se principalmente a ler e exibir conteúdo HTML. Esta propriedade também é capaz de ler e recuperar a formatação de texto mais complexa, que a seguinte amostra de código utiliza anexando a propriedadea uma área de texto com formato de rich texto ativado.
TextArea {
id: htmlTextArea Layout.fillWidth: true Layout.fillHeight: true text: AppFramework.clipboard.html textFormat: Text.RichText readOnly: true
}Os valores de cores são armazenados como um tipo application/x-color MIME e podem somente ser gravados ou retornados pela propriedade color .
O componente Clipboard não tem interação com imagens na área de transferência do sistema (embora, dependendo da fonte, a propriedade text pode retornar uma URL). Ao contrário, o componente ImageObject fornece os métodos copyFromClipboard e pasteFromClipboard para interação.
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();
}
}
}Funcionalidade de compartilhamento
Você pode compartilhar texto, URLs ou arquivos para outros aplicativos utilizando a funcionalidade de compartilhamento fornecida pela Área de Transferência do AppFramework. O método share de componente da Área de Trabalho é utilizado para compartilhar qualquer texto ou URL de entrada. Se compartilhar um arquivo, o método share precisa que você forneça a URL de localização do arquivo. O seguinte snippet de código mostra como utilizar este método, compartilhando o texto inserido em um campo de texto.
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) }
}Atualmente, esta funcionalidade é suportada somente nas plataformas MacOS, iOS e Android.
Para um exemplo desta funcionalidade em uso, consulte o aplicativo de amostra disponível em ArcGIS AppStudio ou no repositório de GitHub das amostras do AppStudio.
Informações locais
Um local é um valor padronizado que descreve um idioma ou dialeto, incluindo detalhes como alfabeto utilizado, marcadores decimais e formato de data. Ao utilizar um código local válido, você pode substituir o local padrão do seu sistema e fornecer uma série de maneiras importantes que as informações em seu aplicativo serão exibidas.
Estes locais podem ser passados no aplicativo pelo uso do componente LocaleInfo , que contém propriedades para definir um local, assim como mapear o local constantemente através dos padrões e outras seções do seu aplicativo. No AppStudio, um exemplo é utilizar LocaleInfo para determinar o idioma de uma caixa de diálogo de registro do OAuth no ArcGIS Online. Para fazer isto, primeiro instancie LocaleInfo, e informe o local inicial e quando o local foi alterado.
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;
}
}
}Para atualizar o local do aplicativo, adicione um campo de texto para exibir e editar o local.
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();
}
}Já que as outras propriedades do LocaleInfo não serão atualizados durante a sincronização, é necessário uma função atualizá-las. Para os propósitos deste fluxo de trabalho, a função também estará em uma lista de modelos que pode ser exposta na interface do usuário.
// 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() });
}
}Após o modelo de lista ser configurado, você pode adicionar uma visualização da web a um registro do OAuth, que será exibido no local declarado no campo de texto anterior. Neste caso, a visualização da web é exibida como parte de uma visualização de tabela ao lado da lista de propriedades do LocaleInfo acima.
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;
}
}
}
}Esteja ciente que controlar o código de local e alterar a apresentação do seu aplicativo que depende disto são somente parte do processo de localização. Para mais informações, consulte Globalizar seu aplicativo.
URLs
Para executar operações complexas com URLs, o componente UrlInfo fornece propriedades e métodos para construir e desconstruir URLs. Estas propriedades e métodos podem ser utilizados para construir dinamicamente uma URL ou derivar componentes individuais de um. A seção seguinte do código mostra como utilizar UrlInfo para extrair os parâmetros de uma consulta a partir de uma URL, neste caso, um serviço de feição. A edições realizadas para a consulta extraída quando o aplicativo de amostra for executado são então juntados e apresentados como uma nova 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 }
}