Deepzoom in Silverlight 2.0

9 pagine in totale: <<Indietro 1 2 3 4 5 6 7 [8] 9 Avanti >>

private void showBorder() 
{ 
    // Recupero il rectangle dell'image in dimensioni 
    // logiche del viewport 
    Rect logicalRect = this.HighlightedImage.GetMainViewPortRect(); 
 
    // trasformo le dimensioni logiche del ViewPort in 
    // dimensioni element 
    Rect elementRect = this.target.LogicalToElementRect(logicalRect); 
 
    // dimensiono il Border 
    border.Width = elementRect.Width + 2; 
    border.Height = elementRect.Height + 2; 
 
    // sposto l'origine del border 
    Point borderOrigin = new Point( 
        elementRect.X - 1, 
        elementRect.Y - 1); 
    Canvas.SetLeft(this.border, borderOrigin.X); 
    Canvas.SetTop(this.border, borderOrigin.Y); 
 
    // rendo visibile il border 
    border.Opacity = 1; 
} 

Il codice del metodo showBorder è piuttosto semplice e merita veramente pochi commenti.

L'unico punto di interesse risiede nell'invocazione del metodo LogicalToElementRect, un altro extension method disponibile nella solution allegata che, analogamente a MultiScaleImage.LogicalToElementPoint, trasforma un rettangolo in coordinate logiche in un analogo con coordinate reali:

public static Rect LogicalToElementRect(this MultiScaleImage msi, Rect logicalRect) 
{ 
    // recupero gli estremi del rettangolo logico 
    Point logicalUpperLeft = new Point(logicalRect.X, logicalRect.Y); 
    Point logicalBottomRight = new Point(logicalRect.Right, logicalRect.Bottom); 
 
    // trasformo gli estremi in coordinate reali 
    Point realUpperLeft = msi.LogicalToElementPoint(logicalUpperLeft); 
    Point realBottomRight = msi.LogicalToElementPoint(logicalBottomRight); 
 
    // costruisco il rettangolo reale e lo restituisco 
    return new Rect(realUpperLeft, realBottomRight); 
} 
 

A questo punto è sufficiente creare un'istanza della classe ImageHighlighter all'interno della pagina, fornendo i riferimenti agli oggetti MultiScaleImage e Border da utilizzare

private void msi_ImageOpenSucceeded(object sender, RoutedEventArgs e) 
{ 
    highlighter = new ImageHighlighter(this.msi, this, this.border); 
} 

per ottenere un effetto simile a quello in figura:

9 pagine in totale: <<Indietro 1 2 3 4 5 6 7 [8] 9 Avanti >>

Attenzione: Questo articolo contiene un allegato

Contenuti dell'articolo

Commenti

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.



Segnala su: Facebook MSDN Social Twitter Segnalo Wikio Diggita Technorati Stumbleupon Google Yahoo FriendFeed Delicious Furl

TUTORIALS
TOP TEN ARTICOLI
ARTICOLI VIA E-EMAIL

Iscriviti alla nostra newsletter nuoviarticoli per ricevere via e-mail le notifiche!

MEDIA
IN EVIDENZA
MISC