--- title: "Crie um painel de controlo móvel que impressione qualquer executivo" date: "2017-03-16" categories: - "development" - "mobile" - "software" tags: - "mobile-dashboards" - "mobile-development" - "mobiletogether" description: Aqui está como criar um painel móvel com uma aparência excelente e alta funcionalidade no Altova MobileTogether. --- Status: #blog Tags: #mobile-dashboards #mobile-development #mobiletogether Categories: [mobile-development](/blog/pt/category/mobile-development.md) | [low-code+no-code](/blog/pt/category/low-codeno-code.md) # Crie um painel de controlo móvel que impressione qualquer executivo Num artigo anterior, intitulado "[Criar aplicações móveis elegantes](https://www.altova.com/blog/build-an-elegant-mobile-app-that-delights-end-users/)", mostrámos exemplos de uma aplicação simples e de um painel móvel completo a funcionar em vários dispositivos móveis. Os desenvolvedores de aplicações móveis também podem proporcionar uma experiência mais agradável aos utilizadores, permitindo-lhes personalizar a utilização da aplicação. O MobileTogether permite aos desenvolvedores adaptar as aplicações multiplataforma a cada plataforma móvel **e** capacitar os utilizadores através de um controlo simples e intuitivo para ajustar o tamanho do texto. Permitir que cada utilizador defina o tamanho de texto preferencial para as condições de visualização e para o dispositivo em questão é uma atitude cortês para com os utilizadores e, ao mesmo tempo, alivia os desenvolvedores da tarefa de determinar o tamanho de texto adequado para funcionar em todos os dispositivos. ![](/blog/images/MT_text_size1.jpg) ### Permitir que os utilizadores escolham o tamanho do texto Pode utilizar dois botões separados ou um controlo deslizante para permitir que os utilizadores definam o tamanho do texto exibido numa aplicação móvel. ### Tamanho do texto: dois botões O aplicativo de relatório de vendas da empresa, mencionado no nosso artigo anterior, utiliza a técnica de dois botões. ![Aplicação MobileTogether para relatórios de vendas - versão Android](/blog/images/Android-Landscape.png) A linha inferior de comandos inclui dois botões para ajustar o tamanho do texto, com rótulos intuitivos: ![Botões para ajustar o tamanho da fonte numa aplicação MobileTogether](/blog/images/Android-Bottom-Row.png) Estes botões aumentam ou diminuem o valor de um elemento de dados persistente chamado "textSize", dentro de uma gama de valores que vai de 10 a 50. Aqui está a ação de controlo atribuída ao botão de diminuição: ![Ação de controlo MobileTogether para aumentar o tamanho do texto](/blog/images/decrease-text-size.png) E a ação associada ao botão de aumento: ![Ação de controlo MobileTogether para aumentar o tamanho do texto](/blog/images/increase-text-size.png) O elemento `textSize` é utilizado numa função simples do MobileTogether para construir uma cadeia de caracteres válida que será utilizada para definir o tamanho do texto: ![Definição de uma função de utilizador MobileTogether para ajustar o tamanho do texto](/blog/images/set-text-size-function.png) Finalmente, o tamanho do texto de cada elemento de texto na aplicação é definido através de uma expressão XPath, em vez de através do menu de seleção de tamanho na janela de propriedades ![Propriedades "MobileTogether" para um elemento de texto](/blog/images/text-size-property.png) Como o elemento "textSize" é definido na estrutura de dados persistente, a seleção do tamanho do texto feita pelo utilizador é guardada e mantida para a próxima vez que a aplicação for executada nesse dispositivo. Este método com dois botões funciona bem para aplicações com apenas algumas páginas principais, como o relatório de vendas da empresa, porque o utilizador vê o resultado imediatamente e pode ajustar o tamanho de acordo com a sua preferência. Abaixo, apresentamos exemplos do relatório de vendas da empresa com texto pequeno e texto grande: ![Uma aplicação MobileTogether com texto de tamanho reduzido](/blog/images/small-text-sample.png)  ![Uma aplicação MobileTogether com texto de tamanho grande](/blog/images/large-text-sample.png) Note que o título principal é maior do que o texto do corpo. Isto é conseguido através de uma segunda função do utilizador, destinada ao texto dos títulos, que estabelece uma relação entre os tamanhos do texto do corpo e do título: ![Função do MobileTogether para o tamanho do texto do título](/blog/images/headline-text-function.png) ### Controlo do tamanho do texto Outra forma de permitir que o utilizador controle o tamanho do texto é através do controlo deslizante. Os programadores ainda precisarão criar um elemento de dados persistente para o tamanho do texto, criar funções para o utilizador que construam a cadeia de caracteres que representa o tamanho, e atribuir a propriedade do tamanho do texto como uma expressão XPath, como descrito anteriormente. No entanto, por vezes, não há espaço suficiente na tela para dedicar dois botões à modificação do tamanho do texto. Nesse caso, pode usar um botão para aceder a um controlo deslizante. A aplicação móvel de painel de vendas, mostrada abaixo, apresenta dados de vendas para qualquer data, em diversos formatos gráficos. A barra de controlos na parte superior oferece várias opções de seleção rápida de datas, mas só tem espaço para mais um botão para ajustar o tamanho do texto. ![Aplicação móvel de painel de controlo MobileTogether – versão para Android](/blog/images/Dashboard-app-Android.png) Nesta aplicação, o botão "A±" abre uma subpágina que contém um controle deslizante que permite aos utilizadores ajustar o valor do elemento "textSize": ![Controlo deslizante para redimensionar o texto na aplicação móvel do painel de controlo](/blog/images/resize-slider.png) O texto de exemplo na linha superior é redimensionado em tempo real à medida que o utilizador ajusta o controlo deslizante. Quando o utilizador clica no botão "voltar", a página principal é exibida novamente, com os elementos de texto redimensionados. Tal como acontece com a técnica de dois botões, o elemento "textSize" é armazenado como dados persistentes, e a seleção do utilizador será restaurada na próxima vez que a aplicação for iniciada. Alguns aplicativos terão vários elementos que são adequados para serem guardados como configurações do utilizador, como por exemplo, polegadas em vez de centímetros, dólares em vez de euros, ou um endereço predefinido ou um nome de ficheiro de imagem. Nesses casos, os programadores podem criar uma única página de preferências para que o utilizador possa visualizar e modificar todas as configurações persistentes do utilizador num único local. O MobileTogether Designer é a ferramenta gratuita que permite implementar rapidamente todas estas funcionalidades avançadas para aplicações multiplataforma, compatíveis com Android, iOS, Windows 8, Windows 10, Windows Phone 8 e um cliente baseado em navegador HTML-5. [Descarregue uma cópia](https://www.altova.com/pt/download/mobiletogether.html) e comece já!