Introduzione alle pagine Web ASP.NET per dispositivi mobili

Aggiornamento: novembre 2007

In questa sezione della documentazione vengono descritte le modalità di progettazione delle pagine Web ASP.NET per dispositivi mobili utilizzando i controlli mobili ASP.NET. I controlli mobili si basano sulla tecnologia Microsoft .NET Framework e la estendono.

Nota:
Per creare pagine in una lingua diversa dall'inglese, vedere Suggerimenti per lo sviluppo di applicazioni internazionali nella documentazione relativa a Microsoft ASP.NET.

Strumenti di creazione

Per creare pagine Web ASP.NET per dispositivi mobili, è possibile utilizzare Microsoft Visual Studio o un editor di testo. In Visual Studio sono disponibili strumenti per la creazione di pagine Web per dispositivi mobili e il relativo codice, nonché per la gestione dell'applicazione contenente le pagine Web per dispositivi mobili create.

Dopo aver creato le pagine per dispositivi mobili, è possibile visualizzarle utilizzando un browser in un dispositivo supportato. Per ulteriori informazioni, vedere Piattaforme e dispositivi supportati da .NET Compact Framework.

Applicazioni del lato server

I controlli mobili vengono eseguiti nel server e inviano il linguaggio di markup al browser. Il linguaggio di markup specifica come visualizzare i controlli e il contenuto nel form o nella pagina corrente.

In ogni pagina Web per dispositivi mobili è contenuto almeno un elemento form, indicato dal tag <mobile:Form>. In ogni tag di controllo mobile deve essere incluso l'attributo runat=server.

Script client

Allo stesso modo di altri tipi di pagine Web, le pagine Web per dispositivi mobili possono includere gli script client per l'elaborazione da parte del browser. Se fanno riferimento a controlli server Web specifici, questi script devono utilizzare l'identificatore generato nel linguaggio di markup. Questi identificatori variano a seconda del linguaggio markup supportato dal dispositivo. Per ottenere il nome esatto del controllo, compilare l'applicazione, passare alla pagina o al form, quindi visualizzarne il linguaggio di markup di origine.

Esempio "Hello World" tradizionale

Nell'esempio di codice riportato di seguito viene illustrata una pagina Web "Hello World" per dispositivi mobili. In questo esempio viene mostrato l'utilizzo di un controllo Form come contenitore di un controllo mobile Label che visualizza il testo "Hello, world!".

<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage" 
   Language="C#" %>
<mobile:Form id=Form1 >
  <mobile:Label id=Label1 >
    Hello, world!
  </mobile:Label>
</mobile:Form>

Esempio di "Hello World" internazionale

La community degli utenti di dispositivi mobili è diffusa in ogni parte del mondo. Nell'esempio di codice riportato di seguito viene illustrata una versione internazionale di "Hello World". In questa variazione dell'esempio precedente il controllo List visualizza un elenco di lingue definite in singoli elementi <Item>. Un gestore eventi legge la lingua selezionata da un utente e quindi passa a un altro form. Viene utilizzata un'istruzione switch per visualizzare il testo corretto per la lingua selezionata dall'utente.

<%@ Page Language="C#" 
    Inherits="System.Web.UI.MobileControls.MobilePage" %>

<script >
public void MyEventHandler(Object source, ListCommandEventArgs e)
{
    Selection.Text = "You selected " + e.ListItem.Text;
    ActiveForm = SecondForm;

    switch (e.ListItem.Text)
    {
      case "French":
          Selection.Text = "Bonjour le monde";
          break;

      case "German":
          Selection.Text = "Hallo Welt";
          break;

      case "Italian":
          Selection.Text = "Ciao il mondo";
          break;

      case "Norwegian":
          Selection.Text = "Hei verden";
          break;

      case "Portuguese":
          Selection.Text = "Oi mundo";
          break;

      default:
          Selection.Text = "Hello World";
          break;
   }
}
</script>
<mobile:Form id="ListStuff"  
      BackColor="White" ForeColor="#bb7023">
  <mobile:Label runat=server id="label">
    Pick a Language!
  </mobile:Label>
  <mobile:List runat=server id="ListMe" 
      OnItemCommand="MyEventHandler">
    <item Text="English" />
    <item Text="French" />
    <item Text="German" />
    <item Text="Italian" />
    <item Text="Norwegian" />
    <item Text="Portuguese" /> 
  </mobile:List>
</mobile:Form>

<mobile:Form id="SecondForm" 
    BackColor="White" ForeColor="Green">
  <mobile:Label runat=server>
     Your "Hello World"  Translation
  </mobile:Label>
  <mobile:Label runat=server 
    id="Selection"></mobile:Label>
  <mobile:Link runat=server id="GoBack" 
    NavigateURL="#ListStuff">back</mobile:Link>
</mobile:Form>

Modifica della codifica del testo per un'applicazione internazionale

Nelle applicazioni internazionali spesso è necessario modificare la codifica dei caratteri rispetto alla codifica UTF-8 predefinita. Per modificare la codifica del testo, utilizzare l'elemento globalization, come mostrato nell'esempio riportato di seguito, in cui viene impostata la codifica UTF-16:

<globalization>
  requestEncoding="utf-16"
  responseEncoding="utf-16"
/>

È possibile impostare la codifica nel file globale Machine.config, in cui viene specificata la codifica per tutte le applicazioni, o nel file Web.config dell'applicazione, in cui viene specificata la codifica solo per l'applicazione specifica.

Vedere anche

Concetti

Suggerimenti per lo sviluppo di applicazioni internazionali

Piattaforme e dispositivi supportati da .NET Compact Framework

Riferimenti

Form

Label

Elemento <item>

Altre risorse

Sviluppo di pagine Web ASP.NET per dispositivi mobili