Controllo Image

Articolo
04/11/2008

La possibilità di trasmettere immagini a dispositivi senza fili è importante nella creazione di efficienti applicazioni Web ASP.NET per computer portatili. Il controllo Image consente di specificare l'immagine che si desidera visualizzare su un dispositivo senza fili.

A causa della natura dei dispositivi senza fili, un singolo file di immagine non potrà essere adatto a tutti i dispositivi. Alcuni browser non sono in grado di visualizzare determinati formati di immagine e non tutti i colori e tutte le dimensioni dell'immagine sono adatti per qualsiasi dispositivo. Un'immagine in formato di file di immagine GIF sarà, ad esempio, visualizzata su browser HTML abilitati ma non su browser WML abilitati. Per visualizzare un'immagine su browser WML abilitati, sarà necessario utilizzare un formato di file WBMP.

Utilizzando il controllo Image è possibile specificare più file di immagine. In questo modo sarà possibile creare la stessa immagine in più formati di file. Il controllo è in grado di utilizzare il file di immagine corretto in base alle caratteristiche del dispositivo. Il controllo Image è indipendente dal tipo di file di immagine utilizzato. È possibile utilizzare qualsiasi tipo di file di immagine compatibile con il browser di destinazione.

Il riutilizzo delle immagini è diventata una tecnica altrettanto efficace quanto la tecnica di riutilizzo del codice nella progettazione delle applicazioni. Il controllo Image consente di riutilizzare un'immagine creando da essa un controllo utente. Per ulteriori informazioni sui controlli utente, vedere la documentazione Creazione di controlli mobili personalizzati.

Sintassi dei controlli mobili

Le proprietà necessarie, le impostazioni predefinite e gli elementi dalle funzionalità di codice sono in grassetto.

<mobile:Imagerunat="server"
   id="id"
   Font-Name="fontName"
   Font-Size="{NotSet|Normal|Small|Large}"
   Font-Bold="{NotSet|False|True}"
   Font-Italic="{NotSet|False|True}"
   ForeColor="foregroundColor"
   BackColor="backgroundColor"
   Alignment="{NotSet|Left|Center|Right}"
   StyleReference="styleReference"
   Wrapping="{NotSet|Wrap|NoWrap}"

   AlternateText="AltText"
   ImageUrl="masterImageSource"
   NavigateURL="targetURL"
   SoftkeyLabel="label">
Place DeviceSpecific/Choice construct here. (optional)
</mobile:Image>

Regole di contenimento

I controlli descritti di seguito possono contenere un controllo Image.

Controllo	Commenti
System.Web.UI.MobileControls.Form	Può contenere un numero indefinito di controlli Image.
System.Web.UI.MobileControls.Panel	Può contenere un numero indefinito di controlli Image.

In un controllo Image possono essere contenuti i controlli descritti di seguito.

Controllo	Commenti
System.Web.UI.MobileControls.DeviceSpecific	Specifica alternative di immagine per ogni dispositivo. In un controllo Image possono essere contenuti zero oppure un controllo DeviceSpecific.

Modelli di dispositivo

Nessuno.

Comportamento specifico del dispositivo

Quando un controllo Image viene attivato su un dispositivo mobile, valuta automaticamente le funzionalità del dispositivo. In base alla valutazione effettuata, è possibile che si verifichino le seguenti situazioni:

Se il dispositivo non è in grado di visualizzare immagini, la proprietà AlternateText verrà rappresentata come un controllo Label.
Per i dispositivi abilitati alla visualizzazione delle immagini il controllo verifica la presenza di un URI a un'immagine registrata specifica per il dispositivo in ingresso. Per trovare un'immagine registrata, il controllo verifica la presenza di una clausola <DeviceSpecific> all'interno del controllo Image. Se ne esiste una, il controllo valuterà ed estrarrà un valore dalla clausola <Choice> corrispondente. Questo valore viene considerato come l'URI di un file di immagine e viene utilizzato per eseguire il rendering del file sul dispositivo.

Indipendentemente dagli elementi di cui viene eseguito il rendering, il controllo seleziona le proprietà di testo e allineamento dall'oggetto Style.

Utilizzo dello schema symbol: dell'URL

Nella proprietà ImageUrl è solitamente contenuto l'URL di un'immagine. Tuttavia, quando il controllo Image recupera l'URL, verifica la presenza di uno schema particolare mediante cui vengono segnalate al controllo informazioni specifiche del dispositivo. Mediante questo schema o testo formattato con prefisso viene segnalato al controllo la necessità di generare tag specifici per visualizzare sul dispositivo di destinazione l'immagine incorporata corrispondente allo schema.

Mediante lo schema symbol:, utilizzato come valore per la proprietà ImageUrl, viene segnalato al controllo Image di avviare la ricerca dell'immagine specificata e di consentirne la visualizzazione sul dispositivo di destinazione. Se, ad esempio, il valore della proprietà ImageUrl su un telefono i-mode è symbol:63726*,* tale valore, emesso come valore &#63726*,* verrà rappresentato sul dispositivo di destinazione come un'icona a forma di cuore.

Lo schema symbol: viene eseguito su telefoni i-mode e telefoni WML versione 1.1 che supportano le icone.

Comunità HTML e WML

In fase di esecuzione il controllo Image genera solitamente un tag <img> con l'attributo src impostato sul valore Choice selezionato. L'attributo alt è impostato sul testo alternativo, se disponibile.

Se viene specificata una proprietà NavigateURL, l'immagine sarà racchiusa in un tag <a> di ancoraggio di cui è stato eseguito il rendering in modo appropriato.

Il controllo Image non esegue il rendering di un tag <br> di interruzione di riga dopo l'immagine. In questo modo viene eseguito il rendering delle immagini l'una accanto all'altra. Tuttavia, se si desidera simulare un'interruzione di riga, sarà possibile inserire un controllo Label vuoto dopo l'immagine.

Se la proprietà Alignment è impostata, il controllo Image imposterà l'attributo align su quel valore.

Nota I dispositivi WML presentano diversi limiti per la dimensione dell'immagine. Prima di procedere, verificare le specifiche per il dispositivo desiderato.

Esempio

Nell'esempio riportato di seguito vengono presentate in base alle caratteristiche del dispositivo tre immagini alternative che è necessario siano selezionate dal controllo. Il controllo seleziona il testo alternativo in cui nessuna immagine risulta appropriata. Sostituire i nomi delle immagini per eseguire il controllo e aggiungere i filtri di dispositivo al file web.config in uso. Per ulteriori informazioni sui filtri di dispositivo, vedere Rendering specifico di dispositivo.

<%@ Page Inherits= "System.Web.UI.MobileControls.MobilePage" %>
<%@ Register TagPrefix="mobile"
    Namespace="System.Web.UI.MobileControls"
    Assembly="System.Web.Mobile" %>

<mobile:Form runat="server">
  <mobile:Image runat="server" id="myImages" AlternateText=
   "Sorry, this requested image cannot be displayed on this device.">
   <deviceSpecific>
     <choice Filter="IsColor"
      ImageUrl="myColor.gif"/>
     <choice Filter="Wml"
      ImageUrl="myWMLImage.wbmp"/>
     <choice ImageUrl="myColor.bmp"/>
   </deviceSpecific>
  </mobile:Image>
</mobile:Form>

Vedere anche

Classe Image | Membri della classe Image | Riferimenti ai controlli

Condividi tramite