COMO: Personalizar um controle de formulários da Web móveis com modelos

Este guia passo a passo descreve como criar e usar modelos específicos de dispositivo para controles de Web Forms móveis. Esse é um processo em duas etapas. Primeiro, você deve atribuir um ou mais filtros de dispositivo para o controle. Em segundo lugar, você deve criar um modelo específicas de dispositivo que está associado com cada filtro do dispositivo. Este artigo presume que você instalou o Microsoft Visual Studio .NET e o Mobile Internet Toolkit com o designer de Internet Mobile.

Profissionais de TI podem usar o Mobile Internet Toolkit para implantar sites para desktops e dispositivos móveis sem fio. Esses dispositivos podem variar de telefones da Web a computadores pessoais portáteis. O Mobile Internet Toolkit inclui um conjunto de controles de servidor móvel que você pode usar em suas páginas da Web. Os controles móveis (essas também são chamadas controles de Web Forms móveis) detectam qual tipo de dispositivo está sendo usado para procurar o aplicativo. Esses controles com base no que detecção, emitir a linguagem de marcação que é apropriada para um dispositivo específico. Por exemplo, se um usuário está navegando usando um dispositivo sem fio Markup Language (WML), os controles móveis emitir WML para dispositivo do usuário.

Como dispositivos móveis têm uma grande variedade de recursos de exibição, talvez seja necessário personalizar a saída das páginas da Web para dispositivos específicos. Uma maneira de fazer isso é usando modelos para controles móveis que sejam baseiam no tipo de dispositivo que está sendo usado para procurar o aplicativo.

Requisitos

• O Visual Studio .NET
  
• Móvel Internet Toolkit
  

Definir filtros de dispositivo

1. No formulário da Web Mobile, clique no controle Mobile Web Form ao qual o filtro será aplicado.
2. Na janela Properties, clique no botão reticências próximo à propriedade AppliedDeviceFilters . A caixa de diálogo Aplicados filtros de dispositivo é exibida.
3. Clique em Editar para criar ou modificar os filtros. A caixa de diálogo Editor de filtro do dispositivo é exibida.
4. Clique em um novo dispositivo de filtro por:
   1. Clicando em novo filtro de dispositivo .
   2. Digitar o nome para o novo filtro. Observe que nomes de filtro diferenciam maiúsculas de minúsculas.
   3. Clicando em um tipo de filtro (por exemplo, clique em Comparação de igualdade ) e digitando as informações apropriadas nas caixas de Comparar e argumento .
5. Use os botões de Seta para cima e Seta para baixo para definir a ordem em que os filtros de dispositivo são salvas no arquivo de configuração do aplicativo (Web.config).
6. Clique em OK para salvar os filtros de dispositivo no arquivo de configuração do aplicativo e, em seguida, feche a caixa de diálogo Editor de dispositivo de filtro .

Aplicar filtros de dispositivo

1. Clique no controle ao qual o filtro será aplicado.
2. Na janela Properties, clique no botão reticências próximo à propriedade AppliedDeviceFilters . O criador de Internet Mobile exibe a caixa de diálogo Aplicados filtros de dispositivo .
3. A caixa de Filtros de dispositivo disponível contém todos os filtros de dispositivo que são definidos no nível do aplicativo. Clique no dispositivo de filtro que você deseja usar ou digite o nome de um método de representante de avaliador é definido no arquivo code-behind da página de Web Forms móvel.
4. Clique em Adicionar À lista . O nome de filtro ou método do dispositivo selecionado é incluído na lista Aplicados filtros de dispositivo .
5. Na caixa Aplicados filtros de dispositivo , clique em novo filtro de dispositivo.
6. Na caixa de argumento , digite o argumento de filtro de dispositivo opcional. Para filtros de comparação, o argumento substitui o valor que é definido na caixa de diálogo Editor de filtro do dispositivo e salvos no arquivo Web.config. Para filtros com base no delegado, o argumento é passado para o método. Se você não especificar um argumento, será usado um valor nulo.
7. Use os botões Seta para cima e Seta para baixo para ordenar os filtros de dispositivo aplicado. Em tempo de execução, o aplicativo testa os filtros um por um da parte superior para a parte inferior. O primeiro filtro de dispositivo que resulta em uma avaliação bem-sucedida determina qual conjunto da propriedade substitui os valores que o aplicativo usa.
8. Clique em OK para fechar a caixa de diálogo Aplicados filtros de dispositivo .

Selecionar um filtro aplicado dispositivo

1. Clique com o botão direito qualquer controle móvel que oferece suporte a modelos e clique em Opções de modelagem . A caixa de diálogo Opções de modelagem será exibida.
2. Na caixa Filtro aplicado do dispositivo , clique em um filtro.
3. Opcionalmente, clique ou digite um esquema de linguagem de marcação na caixa Esquema de marcação . As informações que você especifica são usadas somente pelo Mobile Internet Designer e não tem efeito em tempo de execução. Ele é usado no modo de exibição de HTML por tecnologia Microsoft IntelliSense.
4. Feche a caixa de diálogo Opções de modelagem . Quando você faz, o designer define a propriedade TemplateDeviceFilter do controle para o nome do filtro de dispositivo especificado na caixa Filtro do dispositivo requerido . O controle selecionado, em seguida, está pronto para modo de edição de modelo.

Editando modelos

1. No menu de atalho, clique em Edit Template . Você verá uma lista de modelos personalizáveis que suporta o controle selecionado no momento.
2. No menu Edit Template , clique no modelo que você deseja editar.
3. Na maioria dos modelos, você pode digitar texto literal diretamente dentro do modelo ou você pode arrastar controles da caixa de ferramentas e, em seguida, defina suas propriedades para formatar as informações que eles contêm. Por exemplo, você pode:
   • Arraste um controle Label para o modelo de cabeçalho. Digite o texto do cabeçalho no controle e, em seguida, configurar suas propriedades. Por exemplo, você pode alterar a cor de primeiro plano.
   • Arraste um controle Image em um modelo de separador. Em seguida, você pode usar a propriedade ImageUrl para vincular a um arquivo gráfico da Web para o separador que você deseja usar.
4. Quando tiver terminado, clique em End Template Editing no menu de atalho.