- 浏览: 188644 次
- 性别:
- 来自: 深圳
文章分类
最新评论
xaml:
<MultiScaleImage HorizontalAlignment="Left" Margin="36,80,0,0" Name="multiScaleImage1" VerticalAlignment="Top" Width="382" Source="http://www.daisy123.com/MyDeepZoom/dzc_output.xml" ImageOpenSucceeded="multiScaleImage1_ImageOpenSucceeded" />
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Image/appbar.basecircle.rest.png" Text="full" Click="abbFull_Click"/>
<shell:ApplicationBarIconButton IconUri="/Image/appbar.favs.addto.rest.png" Text="Original" Click="abbOri_Click"/>
<shell:ApplicationBarIconButton IconUri="/Image/appbar.favs.rest.png" Text="zoomin" Click="abbZoomIn_Click"/>
<shell:ApplicationBarIconButton IconUri="/Image/appbar.feature.settings.rest.png" Text="zoomout" Click="abbZoomOut_Click"/>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
multiscaleImage 控件的Source的路径是要web路径
dzc_output.xml是张图片,要用Deep Zoom Composer工具生成
cs:
public partial class MultiScaleImage : PhoneApplicationPage
{
private double zoom = 1;
private bool isMoving = false;
private bool isDown = false;
private Point lastMouseDownPos = new Point();
private Point lastMousePos = new Point();
private Point lastMouseViewPort = new Point();
public MultiScaleImage()
{
InitializeComponent();
}
//成功加载事件
private void multiScaleImage1_ImageOpenSucceeded(object sender, RoutedEventArgs e)
{
//成功加载后 固定初始位置
multiScaleImage1.ViewportOrigin = new Point(0, 0);
multiScaleImage1.ViewportWidth = 1;
}
private void PhoneApplicationPage_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
//获取按下时图像坐标位置
lastMouseDownPos = e.GetPosition(multiScaleImage1);
//获取视区中心点位置
lastMouseViewPort = multiScaleImage1.ViewportOrigin;
//标识用户已经按下了 down
isDown = true;
//开始获取
multiScaleImage1.CaptureMouse();
}
private void PhoneApplicationPage_MouseMove(object sender, MouseEventArgs e)
{
//获取移动的时候图像的坐标位置
lastMousePos = e.GetPosition(multiScaleImage1);
//条件为 按下了和没在移动中 才进入
if (isDown && !isMoving)
{
//设为在移动
isMoving = true;
//获取视区窗口大小
double w = multiScaleImage1.ViewportWidth;
//获取视区窗口的坐标位置
Point p = new Point(multiScaleImage1.ViewportOrigin.X, multiScaleImage1.ViewportOrigin.Y);
//设置暂时还没移动效果
multiScaleImage1.UseSprings = false;
//把获取好的坐标值赋值
multiScaleImage1.ViewportOrigin = new Point(p.X, p.Y);
//把获取到的视区宽度赋值
multiScaleImage1.ViewportWidth = w;
//设置变焦数
zoom = 1 / w;
//启动移动效果
multiScaleImage1.UseSprings = true;
}
//正在移动
if (isMoving)
{
//将获取到按下时视区的中心位置
Point point = lastMouseViewPort;
//进行坐标进行
point.X = (lastMouseDownPos.X - lastMousePos.X) / multiScaleImage1.ActualWidth * multiScaleImage1.ViewportWidth;
point.Y = (lastMouseDownPos.Y - lastMousePos.Y) / multiScaleImage1.ActualWidth * multiScaleImage1.ViewportWidth;
//将计算好的视区坐标进行赋值
multiScaleImage1.ViewportOrigin = point;
}
}
private void PhoneApplicationPage_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
if (isMoving)
{
bool isShift = (Keyboard.Modifiers & ModifierKeys.Shift) == ModifierKeys.Shift;
double newzoom = zoom;
if (isShift)
{
newzoom /= 2;
}
else
{
newzoom *= 2;
}
}
isMoving = false;
isDown = false;
Zoom(zoom, multiScaleImage1.ElementToLogicalPoint(this.lastMousePos));
multiScaleImage1.ReleaseMouseCapture();
}
private void Zoom(double newzoom, Point p)
{
if (newzoom < 0.5)
{
newzoom = 0.5;
}
multiScaleImage1.ZoomAboutLogicalPoint(newzoom / zoom, p.X, p.Y);
zoom = newzoom;
}
private void abbFull_Click(object sender, EventArgs e)
{
multiScaleImage1.ZoomAboutLogicalPoint(3, 0, 0);
}
private void abbOri_Click(object sender, EventArgs e)
{
this.multiScaleImage1.ViewportWidth = 1;
this.multiScaleImage1.ViewportOrigin = new Point(0, 0);
}
private void abbZoomIn_Click(object sender, EventArgs e)
{
Zoom(zoom * 1.3, multiScaleImage1.ElementToLogicalPoint(new Point(0.5 * multiScaleImage1.ActualWidth, 0.5 * multiScaleImage1.Height)));
}
private void abbZoomOut_Click(object sender, EventArgs e)
{
Zoom(zoom / 1.3, multiScaleImage1.ElementToLogicalPoint(new Point(0.5 * multiScaleImage1.ActualWidth, 0.5 * multiScaleImage1.Height)));
}
}
发表评论
文章已被作者锁定,不允许评论。
-
WP7 学习之pivot控件应用
2012-01-08 22:52 1900Pivot控件用来过滤大量的数据集,在不同的视图中查看它们,或 ... -
WP7 学习之panorama 全景控件应用
2012-01-08 22:28 2242引入命名空间xmlns:controls="clr- ... -
WP7学习之使用字体文件库
2012-01-05 20:49 1118<TextBlock Text="60&quo ... -
WP7 silverlight toolkit 学习之NavigationInTransition
2011-12-30 22:09 1982NavigationInTransition这个是实现页面切换 ... -
WP7 silverlight toolkit 之 AutoCompleteBox 应用学习
2011-12-27 22:13 1544案例一: xaml: < ... -
WP7 silverlight toolkit 学习之DatePicker and TimePicker
2011-12-26 20:48 1938DatePicker xaml: <toolkit:D ... -
WP7 silverlight toolkit 学习之 WrapPanel 使用
2011-12-23 21:28 2252xaml: <toolkit:WrapPanel H ... -
WP7 silverlight toolkit 学习 之 ToggleSwitch 使用
2011-12-23 21:23 2132xaml: <toolkit:ToggleSwitch ... -
Wp7 silverlight toolkit 学习之 ContextMenu使用
2011-12-23 21:17 1835xaml: <Button Content=" ... -
wp7学习笔记 之二
2011-12-22 23:07 12784)可以选中一个控件然后再在控件里添加子控件5)新建时间线、可 ... -
wp7学习笔记 之一
2011-12-22 23:06 1212Emulator中文叫仿真器,是精确地在一种环境下仿真另一种环 ... -
盘点Windows Phone Developer Tools 7.1 Beta (for Mango)新增功能
2011-12-21 20:50 1015盘点Windows Phone Developer Tools ... -
Windows Phone中Silverlight Toolkit的使用
2011-12-19 22:18 1205首先需要去下载一个Silv ... -
WP7 开发学习之 Map 地图小应用
2011-12-16 23:33 1864用map控件 首先要先注册一个key ,我这就提供一个:AtR ... -
wp7 开发学习之 ScrollViewer小应用
2011-12-09 09:17 1346xaml <ScrollViewerWidth=&qu ... -
wp7 开发学习之 MediaElment小应用
2011-12-09 09:18 859xaml <MediaElement Height=& ... -
wp7 开发学习之 TextBox小应用
2011-12-09 09:18 1022xaml <TextBox Height=" ... -
wp7 开发学习之 Thumb小应用
2011-12-09 09:19 1342xaml页面 <Thumb Height=" ... -
wp7 开发学习之 Slider 小应用
2011-12-09 09:19 1593xaml页面 <Slider Height=" ... -
wp7 开发学习之 ProgressBar 小应用
2011-12-08 22:28 2076xaml页面 <ProgressBar Height ...
相关推荐
7. ChildWindow:ChildWindow是一个模态窗口,可以在主窗口之上弹出,阻止用户与主窗口的交互,常用于对话框或设置界面。 8. ComboBox:ComboBox结合了文本框和下拉列表,用户既可以输入,也可以从列表中选择,适合...
3、Silverlight(5) - 2.0控件之ListBox, MediaElement, MultiScaleImage, PasswordBox, ProgressBar, RadioButton 4、Silverlight(6) - 2.0控件之ScrollViewer, Slider, StackPanel, TabControl, TextBlock, ...
3. **使用MultiScaleImage控件**:在XAML中,你可以插入`MultiScaleImage`控件并设置其`Source`属性为XML配置文件的路径。这样,控件会自动加载和显示正确的图像层。 4. **交互处理**:WPF提供了一套完整的事件处理...
文章介绍了基于Azure的软件来进行图像上传,使用Silverlight MultiScaleImage控件进行查看,标记和注释。 浏览器无需在用户机器/设备上进行任何额外安装即可执行操作(查看浏览器应支持Silverlight)。
2. **Deep Zoom原理**:学习如何利用Deep Zoom技术构建可平移和缩放的图像,包括切片概念、MultiscaleImage类的使用以及如何处理图像的缩放级别。 3. **Deep Zoom Composer的使用**:掌握如何导入图像、设置参数、...