Índice

 

Widgets Mobile 

No fluig, agora é possível visualizar widgets por meio das páginas, a partir de aplicativos móveis. Porém existem algumas particularidades que precisam ser lembradas para que o usuário tenha uma boa experiência com este recurso.

 

Recomendações para o desenvolvimento de widgets:

  1. HTML Responsivo: Hoje no mercado existem variados tamanhos de telas e resoluções, por isso qualquer html desenvolvido para Mobile deve ser responsivo, ou seja, deve se ajustar a qualquer tamanho de tela.

  2. Estética: A aparência visual e design da widget devem ser atraentes para os usuários, conseguimos isso através de CSS, para isso recomendamos a utilização do fluig style guide. 

  3. Usabilidade: A widget deve ser fácil de usar, contendo apenas o conteúdo necessário para usuário.

  4. Área de toque: Os elementos do html devem estar bem posicionados de forma que facilite a área de toque, pois hoje existem dispositivos que as telas são muito pequenas.

  5. Posicionamento das ações: As ações mais importantes devem estar posicionadas onde o usuário consegue alcançar facilmente, conforme a figura:

  6. Converter widgets já existentes para Mobile : Para agilizar o desenvolvimento focado em mobile e web é necessário utilizar frameworks que tratam a responsividade, recomendamos a utilização do fluig Style Guide.
  7. Elementos Suportados: Widgets Mobile suportam os tipos:
    1. text
    2. textArea
    3. radio
    4. select
    5. combobox
    6. checkbox.
    7. email (3)
    8. tel (3)
    9. range (3)
    10. date (3)
    11. time (1)(3)
    12. week (2)(3)
    13. number
    14. hidden
    15. password

(1) Existe um bug no Android Lollipop (5.0) que inviabiliza o uso do tipo time. Para mais informações, clique aqui.
(2) O campo week não é suportado pelo iOS.
(3) Os campos email, tel, range, date, time, week não são suportados pelo Windows Phone e são apresentados como caixas de texto padrão.

* Não está homologada a implementação de evento que utilizem Swipe.

 

Desenvolvendo widgets com suporte a exibição no fluig Mobile

Observação: Versão mínimas dos browsers suportados

Cada uma das plataformas utiliza um browser diferente para a renderização de html. Esta informação deve ser considerada durante o desenvolvimento para evitar problemas de compatibilidade com os arquivos JavaScript/CSS. A tabela abaixo apresenta a versão mínima dos browsers de cada plataforma que deve ser considerada durante o desenvolvimento:

Versão mínima da plataformaVersão mínima do browser
Windows Phone 8Internet Explorer 10
Android 4.0 (Ice Cream Sandwich)Webkit 534.30
iOS 7Mobile Safari 9537.53