wpf移植库_将WPF应用程序移植到Microsoft Surface

wpf移植库

wpf移植库

What do you need to get through the Great Depression 2.0? Why, a giant computing table, of course! Sadly, the Surface SDK isn't available to folks without a real Surface (which, I say, is a bummer) so I can only tell you that developing for it is awesome. Lame, yes, I know.

通过大萧条2.0需要什么? 为什么呢,那是巨大的计算表! 遗憾的是,没有真正的Surface(我说这真是个笨拙)的人无法使用Surface SDK。因此,我只能告诉您为它开发的很棒。 me脚,是的,我知道。

I can't get you the SDK (yet?) or a Surface (I'm broke) but I can tell you what developing for it was like.

我无法获得SDK(还?)或Surface(我破产了),但是我可以告诉您它的开发是什么样的。

Of course, if you DO have an extra US$15,000 lying around, why not let your baby sit on it? That's my thinking.

当然,如果您确实还有15,000美元在附近,那为什么不让您的孩子坐在上面呢? 那是我的想法。

BabySmash (Code and DevCenter here) has been on hold over the holidays, although I have a lot of big plans once I get on the other side of the Mix conference.

宝贝粉碎 (这里的Code和DevCenter )在假期期间一直处于暂停状态,尽管一旦我参加了Mix会议的另一端,我就有了很多大计划。

One of the things I talked about at my PDC BabySmash talk (WMV) was porting BabySmash to the Surface. BabySmash is a simple WPF application that responds to keyboard and mouse input. Since there's no keyboard or mouse in the standard Surface configuration, I wanted to see how had it would be to port it.

我在PDC BabySmash演讲( WMV )上谈到的一件事是将BabySmash移植到Surface。 BabySmash是一个简单的WPF应用程序,可响应键盘和鼠标输入。 由于标准的Surface配置中没有键盘或鼠标,因此我想看看如何进行移植。

I had to deal with these changes in thinking:

我必须处理这些思想上的变化:

  • Orientation matters. People might be sitting on opposite sides of the Surface

    方向很重要。 人们可能坐在Surface的相对两侧
  • No mouse or keyboard. Many people can touch it at once.

    没有鼠标或键盘。 许多人可以一次触摸它。
  • Multifinger resizing. Folks expect to be able to multitouch a Surface and resize items, throw them around, etc.

    多指调整大小。 人们希望能够多点触摸Surface并调整项目大小,将它们扔到周围等。
  • Different application launcher model. The Surface needs an XML manifest and special icons for its launcher.

    不同的应用程序启动器模型。 Surface需要为其启动器使用XML清单和特殊图标。

Other than these changes, a Surface app is still .NET WPF app, so I wasn't too worried.

除了这些更改之外,Surface应用程序仍然是.NET WPF应用程序,因此我不太担心。

表面模拟器 (Surface Simulator)

The first step was to install the Surface Simulator. It only works on 32-bit Vista, so I had to go make myself a 32-bit machine (I'm all 64-bitted up. FTW!) which was a tiny hassle. (Although there ARE some Vista 64 Surface Simulator hacks) The Simulator is exactly what it sounds like. It's not "emulating" however, as a Surface is still a Vista machine underneath. It's more of a frame and some mouse input management to handle multiple mice and make them look like multiple fingers. This works surprisingly well. In the PDC talk, about halfway in, I plugged in three mice, plus the built in touchpad and had multiple virtual "fingers" moving items around the screen.

第一步是安装Surface Simulator。 它只能在32位Vista上运行,因此我不得不将自己设置为32位计算机(我全都是64位。FTW!),这是一个小麻烦。 (尽管有一些Vista 64 Surface Simulator hacks ),Simulator确实听起来像。 但是,这并不是“模仿”,因为Surface仍然是其下的Vista机器。 它更像是一个框架和一些鼠标输入管理,可以处理多个鼠标并使它们看起来像多个手指。 这出奇地好。 在大约一半的PDC谈话中,我插入了三只鼠标,外加内置的触摸板,并在屏幕上移动了多个虚拟“手指”。

You create your Surface app as you would a WPF app from File | New Project, hit START and it fires up the Simulator and frames up the WPF app.

您可以像通过File | WPF应用程序创建Surface应用程序一样。 新建项目,单击开始,它将启动模拟器并启动WPF应用程序。

Now in my case, I already had an existing WPF application, so I needed to change the type my main Window derived from from "Window" to "SurfaceWindow" and I added an assembly reference and a few namespaces:

现在以我为例,我已经有一个现有的WPF应用程序,因此我需要将主Window的类型从“ Window”更改为“ SurfaceWindow”,并添加了程序集引用和一些命名空间:

using Microsoft.Surface;
using Microsoft.Surface.Presentation;
using Microsoft.Surface.Presentation.Controls;

This base class adds adds all the Surfacey goodness and events and properties that my Window will need.

这个基类添加了我的Window需要的所有Surfacey优点以及事件和属性。

“ ContactDown而不是KeyDown和MouseDown ("ContactDown rather than KeyDown and MouseDown)

I added an event for "Contact_Down" rather than watching for keyboard events and mouse clicks that would never come.

我为“ Contact_Down”添加了一个事件,而不是看着键盘事件和鼠标单击永远不会发生。

private void SurfaceWindow_ContactDown(object sender, ContactEventArgs e)
{
controller.AddFigure(this, " ", e.GetPosition(mainGrid).X, e.GetPosition(mainGrid).Y);
}

BabySmash uses an MVC model, so I'm taking the input from the View and immediately delegating to a main controller object that handles everything.

BabySmash使用MVC模型,因此我从View中获取输入,并立即委派给处理所有内容的主控制器对象。

方向 (Orientation)

Your app can let the system decide which side of the Surface table the user is sitting on when it starts up. This isn't a huge deal with BabySmash, since it's just shapes, but still there's some text on the screen so I wanted the app to be right-side-up when appropriate.

您的应用可以让系统决定启动时用户坐在Surface桌子的哪一侧。 对于BabySmash来说,这并不是什么问题,因为它只是形状,但是屏幕上仍然有一些文本,因此我希望应用程序在适当的时候可以朝上放置。

There are a bunch of new properties on a SurfaceWindow, and one is:

SurfaceWindow上有很多新属性,其中一个是:

AutoOrientsOnStartup="True"

AutoOrientsOnStartup =“真实”

This changed the orientation of my entire application, basically turning it upside down when need-be. This did mean that I couldn't use any low-level X and Y APIs, otherwise the coords would be "lost in translation." As long as I stuck with high-level stuff like "GetPosition" to pull my X and Y's out, the Surface SDK would handle translation and everything just worked.

这改变了整个应用程序的方向,基本上在需要时将其上下颠倒。 这确实意味着我不能使用任何低级的X和Y API,否则这些坐标将“失去翻译”。 只要我坚持使用诸如“ GetPosition”之类的高级内容来将X和Y拖出,Surface SDK就可以处理翻译,并且一切正常。

应用启动器清单 (Application Launcher Manifest)

I needed to create a few icons for my app to live in the Surface Launcher and a manifest. There's other options I didn't use, as well as ways to create animated icons, or to have your application run as an "attract mode" app, to get folks wandering by to stop and touch the Surface.

我需要为我的应用创建一些图标,以使其驻留在Surface Launcher和清单中。 我没有使用过其他选项,以及创建动画图标或使您的应用程序作为“吸引模式”应用程序运行的方式,以使人们徘徊以停下来并触摸Surface。

<?xml version="1.0" encoding="utf-8" ?>

<ss:ApplicationInfo
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:ss="http://schemas.microsoft.com/Surface/2007/ApplicationMetadata">
<Application>
<Title>BabySmash!</Title>
<Description>BabySmash! for Surface</Description>
<ExecutableFile>c:\BabySurface\BabySurface.exe</ExecutableFile>
<Arguments></Arguments>
<IconImageFile>c:\BabySurface\Resources\icon.png</IconImageFile>
<Preview>
<PreviewImageFile>c:\BabySurface\iconPreview.png</PreviewImageFile>
</Preview>
</Application>
</ss:ApplicationInfo>

散点图 (ScatterView)

In the original BabySmash app I had a canvas that would hold all the shapes and letters, but I wanted things to be more Surface-like in this (hacked-together) BabySurface version.

在最初的BabySmash应用程序中,我有一个可以容纳所有形状和字母的画布,但是我希望在此版本(一起被砍死)的BabySurface版本中,事情变得更像Surface。

public void AddFigure(UserControl c, double x, double y)
{
this.figuresCanvas.Children.Add(c);
}

Fortunately there's a control called a ScatterView that makes throwing stuff on the Surface insanely easy. For example:

幸运的是,有一个名为ScatterView的控件,它使在Surface上轻松地扔东西变得非常容易。 例如:

<s:SurfaceWindow
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:s="http://schemas.microsoft.com/surface/presentation">
<s:ScatterView>
<Image Source="Toco Toucan.jpg"/>
<Image Source="Green Sea Turtle.jpg"/>
<Image Source="Desert Landscape.jpg"/>
</s:ScatterView>
</s:SurfaceWindow>

From their blog (here's a video of the Surface SDK in action):

从他们的博客中(这是Surface SDK运行中的视频):

ScatterView is a custom ItemsControl in our SDK which apps can databind or populate with any type of content. Simply sticking some Image elements in it gives you a basic Photos-like app without writing any code. By baking common manipulations into WPF SDK controls like this, we’re able to free developers up to focus on things that are unique to their apps while designers use Blend to add some custom pizazz.

ScatterView是我们SDK中的自定义ItemsControl ,应用可以使用任何类型的内容进行数据绑定或填充。 只需在其中粘贴一些Image元素即可为您提供基本的类似Photo的应用程序,而无需编写任何代码。 通过将常用的操作放入这样的WPF SDK控件中,我们可以使开发人员腾出精力专注于其应用程序特有的功能,而设计师则可以使用Blend添加一些自定义的pizazz。

I changed my AddFigure method to put the new shapes in a ScatterView. I also hooked up a "ContactLeave" event to the new item so that the application would giggle when you lift your finger.

我更改了AddFigure方法,以将新形状放入ScatterView中。 我还将“ ContactLeave”事件连接到新项,以便您松开手指时应用程序会咯咯笑。

public void AddFigure(UserControl c, double x, double y)
{
var s = new ScatterViewItem();
s.Content = c;
s.ContactLeave += new ContactEventHandler(s_ContactLeave);
this.figureScatterView.Items.Add(s);
}

This was cool, but it had a few issues. First, the ScatterView puts everything in a "Polaroid"  border by default:

这很酷,但是有一些问题。 首先,默认情况下,ScatterView将所有内容置于“ Polaroid”边框中:

microsoft-surface

The result was that my BabySmash shapes were inside a Photo Border. Easily removed with a custom style that marked a few properties as {x:Null}:

结果是我的BabySmash形状位于照片边框内。 通过自定义样式轻松删除,该样式将一些属性标记为{x:Null}:

<Style x:Key="ScatterViewItemBabySmashStyle" TargetType="{x:Type s:ScatterViewItem}">
<Setter Property="Background" Value="{x:Null}"/>
<Setter Property="BorderBrush" Value="{x:Null}"/>
<Setter Property="Foreground" Value="{x:Null}"/>
...

The second issue was that while my BabySmash shapes were draggable and scattered nicely, they weren't resizable. Well, they WERE, except when you resized them, you were resizing the container - that is, resizing the now-invisible Polaroid border. I needed a box to put the shapes in that would effectively lie to the inner control and scale/size them as the outside scaled and resized. Enter the ViewBox, including with WPF.

第二个问题是,尽管我的BabySmash形状可以拖动并很好地分散,但它们无法调整大小。 好吧,它们是,除了您调整它们的大小时,您正在调整容器的大小-即,调整现在不可见的宝丽来边框的大小。 我需要一个盒子来放置形状,该形状将有效地放在内部控件中,并在外部缩放和调整大小时对其进行缩放。 输入ViewBox ,包括WPF。

public void AddFigure(UserControl c, double x, double y)
{
var s = new ScatterViewItem();
s.Center = new Point(x, y);
s.Style = this.Resources["ScatterViewItemBabySmashStyle"] as Style;

Viewbox v = new Viewbox();
v.Child = c;

s.Content = v;

s.ContactLeave += new ContactEventHandler(s_ContactLeave);
this.figureScatterView.Items.Add(s);
}

I put the Control in the ViewBox, and put the ViewBox+Control in a ScatterViewItem. Bam, resizable, scattered BabySmash shapes.

我将控件放在ViewBox中,然后将ViewBox + Control放在ScatterViewItem中。 重击,可调整大小,分散的BabySmash形状。

I also got dragging and inertia (physics) for free so you, ahem, the baby, can spin and throw shapes around as well.

我还免费获得了拖动和惯性(物理)功能,因此,婴儿,婴儿,也可以旋转并抛出形状。

This development was all done on the simulator. I never saw a real Surface until I got to PDC last year. The app ran exactly as should. I was a little worried that the real Surface was somehow different, but not so. That was a huge relief.

这项开发工作全部在模拟器上完成。 直到去年加入PDC之前,我从未见过真正的Surface。 该应用程序完全按照预期运行 我有点担心真正的Surface有所不同,但事实并非如此。 那是极大的解脱。

If you have a very visual, shape oriented application that could benefit from touch and a big screen, porting it to the Surface isn't rocket science.

如果您有一个非常直观的,面向形状的应用程序,可以从触摸和大屏幕中受益,那么将其移植到Surface并不是火箭科学。

Definitely check out the PC17 "Developing for Microsoft Surface" talk from PDC. There's a lot of good stuff in the PPT as well with insights into how Multitouch is going to work in .NET 4.0 and Windows 7 and how work on Surface now is driving that future.

一定要查看来自PDCPC17“为Microsoft Surface开发”的演讲PPT中有很多不错的东西,还有关于Multitouch如何在.NET 4.0和Windows 7中工作以及如何在Surface上工作的见解的见识,从而推动了这一未来。

And really, who WOULDN'T want a Big Ass Table? I, for one, would like one for the living room. ;)

真的,谁会想要一个大屁股桌? 我想要一个,作为客厅。 ;)

Related Links

相关链接

翻译自: https://www.hanselman.com/blog/porting-wpf-applications-to-the-microsoft-surface

wpf移植库

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值