#15 - Accedere al DOM di una pagina HTML da Silverlight 2.0

Silverlight è un potente strumento che permette di creare applicazioni web più ricche, ma sebbene possa sostituire anche interamente i normali elementi HTML, si possono verificare situazioni in cui le pagine sono miste e formate in parte da zone sviluppate in Silverlight e da altre realizzate con (X)HTML. In questi casi può inoltre essere necessario far comunicare i due mondi, per esempio per manipolare oggetti HTML da Silverlight o interagire con il browser.

In Silverlight 2.0 è presente un namespace System.Windows.Browser che contiene una serie di classi che permettono di raggiungere questo scopo la cui classe principale è HtmlPage. Questa dispone di alcune proprietà statiche pubbliche, dal nome già comprensibile al loro scopo, come Document, Plugin, BrowserInformation e Window.

La proprietà HtmlPage.Document permette di accedere al nodo principale della pagina, nella quale è contenuto il plugin di Silverlight, e di operare con le comuni operazioni che si possono effettuare solitamente in JavaScript. Di seguito un esempio per inteccettare gli eventi di movimento e uscita del mouse, su un bottone con ID sampleButton:

HtmlElement sampleButton = HtmlPage.Document.GetElementById("sampleButton");

sampleButton.AttachEvent("onmousemove", SampleButton_MouseOver);

sampleButton.AttachEvent("onmouseleave", SampleButton_MouseLeave);

Il gestore degli eventi ha una particolare firma che permette di accedere ai più comuni dati, quali posizione del mouse, pulsante della tastiera premuto, origine dell'evento ecc:

private void SampleButton_MouseOver(object sender, HtmlEventArgs e)
{
    mousePosition.Text = String.Format("Posizione mouse: {0}:{1}", e.ClientX, e.ClientY);
    // Cambio il colore del pulsante

    ((HtmlElement)e.Source).SetStyleAttribute("color", "red");
}

Tra i vari metodi e proprietà, utili sono quelli per la manipolazione dell'alberto degli elementi presenti nella pagina. I metodi AppendChild e RemoveChild permettono di aggiungere e rimuovere figli, mentre con Document.CreateElement è possibile creare un nuovo oggetto e inserirlo nel grafo:

// Recupero l'oggetto select

HtmlElement sampleSelect = HtmlPage.Document.GetElementById("sampleSelect");

// Creo una nuova option

HtmlElement option = HtmlPage.Document.CreateElement("option");
sampleSelect.AppendChild(option);

int c = sampleSelect.Children.Count;
// Imposto il valore

option.SetAttribute("value", c.ToString());
// Imposto il testo

option.SetAttribute("text", "Opzione " + c);
// Autoseleziono l'elemento

option.SetProperty("selected", "true");

La proprietà HtmlPage.BrowserInformation invece contiene alcune informazioni su piattaforma (Platform), tipo di browser (UserAgent) e consente di sapere se i cookies sono abilitati (CookiesEnabled). Bisogna inoltre ricordare che questo strumento gode delle performance date dal CLR incluso nel plugin di Silverlight ed è possibile inoltre abbinarlo all'uso di LINQ to Object che lo rende di gran lunga più comodo rispetto a JavaScript.


Approfondimenti

Commenti

Esprimi il tuo giudizio su questo script:

Per procedere devi essere autenticato.

Aggiungi un nuovo commento »»»
Per inserire un commento, devi registrarti alla nostra community.

Hai trovato un errore di formattazione o battitura? Segnalacelo!

Feedback
non votato Utilità
Autore: Cristian Civera
Data: 5 giugno 2008

Categorie: Silverlight 2.0
Tags: , , , , ,
Requisiti: Silverlight
Stampa Stampa Download


MEDIA

Tutti i media



IN EVIDENZA
MISC