DeepZoom 是silverlight的特色功能之一,也同樣被加到了windows phone 7中來。這個功能現在應該算是phone7 Ui的主要功能了吧。因為phone7的很多Ui就是DeepZoom開發的,另外在MIX10大會有展出的漫畫閱讀軟體也是由DeepZoom開發的,由此也可以看的出這個功能在phone7上的重要性。
一.要開發DeepZoom首先需要 DeepZoom Composer這個在expression下的工具來產生deepzoom圖集。
二.建立windows phone application,在xaml設計視窗加入以下語句:
<MultiScaleImage x:Name="msi" Width="486" Height="652" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="-6,0,0,0" />
在Phone7中只能用MultiScaleImage來展示DeepZoom圖集。
三.將DeepZoom Composer產生的圖集加入到工程中。
四.加入如下代碼,以顯示圖集:
this.msi.ImageOpenSucceeded += new RoutedEventHandler(msi_ImageOpenSucceeded);
void msi_ImageOpenSucceeded(object sender, RoutedEventArgs e)
{
Point point = this.msi.ViewportOrigin;
msi.ViewportWidth = 1;
msi.ViewportOrigin = new Point(0, -0.3);
}
this.msi.Source = new DeepZoomImageTileSource(new Uri("Assets /dzc_output.xml", UriKind.Relative));
五.要讓圖集移動,縮放,還需要加入MouseMove,LButtonDown,LbuttonUp的響應。
private void Zoom(double zoomnew, Point p)
{
if (zoomnew < 0.5)
zoomnew = 0.5;
msi.ZoomAboutLogicalPoint(zoomnew / zoom, p.X, p.Y);
zoom = zoomnew;
}
好了,運行一下吧,看看是不很有趣!看看效果吧。