博客园_快乐的博客

《Windows Fun 7》四：修改ListBox的模板，视觉状态，及状态过渡

2011-11-08T18:20:00Z

明天要去交大讲Expression Blend的课，做了一个教程，也整理到博客园分享一下：

本示例的目的是：

修改ListBox的模板
修改ListBoxItem的视觉状态
添加ListBoxItem视觉状态之间的过渡

步骤：

1. 添加一个Windows Phone页面

2. 添加示例数据：

3.通过数据创建ListBox

4.设置，将ListBox调制剧中的位置

5. 编辑模板

6.修改模板的样式，可以复制以下代码：

<DataTemplate x:Key="ItemTemplate">
<Grid Height="100" Margin="0,10,0,0" Width="400">
<Image Source="{Binding BackImage}" HorizontalAlignment="Left" Width="400"/>
<Rectangle Fill="#FF131523" HorizontalAlignment="Left" Height="40" Margin="0" Stroke="Black" Width="400" VerticalAlignment="Bottom" StrokeThickness="0" Opacity="0.79" d:LayoutOverrides="VerticalAlignment"/>
</Grid>
</DataTemplate>

7.修改ListBoxItem的样式，通过以下方式调出ListBoxItem模板进行编辑：

8.修改ListBoxItem的容器为Grid，这是为了便于后面做动画

9.添加2个TextBlock，分别用于显示两个绑定字段，注意这里没有将这两个元素定义在前面的ItemTemplate中，是因为，在ListBox中，ItemTemplate只是作为ListBoxItem的一个内容控件，所以如果需要处理状态过渡，则在ListBoxItem的状态中是找不到这些元素的，这些状态是由ListBoxItem提供而不是ItemTemplate提供，所以，如果需要处理过渡则不能依赖于ItemTemplate，Blend提供一种方式直接调出ListBoxItem，作为一个补充，也为了更好的定制化ListBox

10，但是，这样就需要手动绑定TextBlock

11.绑定

12.设置两个文本元素，值看起来如下图：

13.修改视觉状态，首先删除ListBox选中默认的背景变换：

14.变换name元素，使在选中的时候向右滑动：

15.title元素相反向左滑动：

16,修改状态变换：

19.大功告成

20.源代码：http://files.cnblogs.com/hielvis/HelloBlend.rar

本文链接

《Windows Fun 7》三：Metro风格的图标按钮

2011-09-28T14:17:00Z

Windows Phone中的Metro风格大家都比较熟悉了，其中ApplicationBar中Button的风格更是独特于iphone和Android，这样的图标我们在地铁商场随处可见，如下：

ApplicationBar中的图标有一个特点，它看起来像两张图片的切换，当手按下去的时候它会呈现相反的颜色。但实际上我们在使用中知道，它其实只有一张图片，这张图片具有以下特点：

背景透明
前景色纯白
没有外边的圆框，ApplicationBar在显示的时候自动加上
当手按下去的时候，系统会替换图标和背景颜色

这看起来很酷，它通过颜色变化给用户操作反馈，而且统一到Metro风格设计中。

但是我们发现，只有在ApplicationBar中才可以这样使用，而在PhoneApplicationPage的区域，要实现类似的效果，有时候我们不得不做两张图片切换，而且要有多种颜色更要更多的图片。

这样的地方也经常用到，系统的电话记录就是其中一种，历史记录的列表左边有一个拨打电话的图标，它和ApplicationBar中的风格一致。

所以，我们怎么实现一个类似的图标按钮呢？这就是本文的任务。

使用本文提供的控件，我们像ApplicationBar中的Button一样使用：

可以指定前景色和背景色，自动切换
只需要指定一张图片
可以更换图片，实现像IE9中的刷新和停止的效果。

我们来分析下实现的思路是什么，我们首先看对图标的要求，要求图标的背景透明，而前景色是纯色，而图片实际上是由一个一个的像素点组成，所以我们就可以在程序中分析出哪些像素点是纯色图标，哪些是背景色，这样我们就可以修改纯色的部分，实现各种不同的颜色。并且可以在手按下的状态变换颜色，原理就是这里简单。

剩下的问题就是，我们怎样得到这些像素点呢？答案是WriteableBitmap，他有一个Pixels属性，可以获取所有像素点的颜色值，一个颜色值实际上对应一个十六进制，从而对应一个整数，这里剩下的问题就是整数以及颜色值之间的转换，颜色到整数之间的转换：

byte alpha = (byte)(pixel >> 24);
var a = alpha + 1;
var col = (alpha << 24)
         | ((byte)((color.R * a) >> 8) << 16)
         | ((byte)((color.G * a) >> 8) << 8)
         | ((byte)((color.B * a) >> 8));

我们这里只需要这个转换即可，没有反向的转换。

使用的方式非常简单：

<metro:MetroImage Source="Images/appbar.sync.rest.png" BackgroundColor="Red" ForegroundColor="Green"/>

是不是跟ApplicationBar的一样的呢？呵呵

比较简单，大家可以下载源代码。

http://files.cnblogs.com/hielvis/WriteableBitmap.rar

http://techappy.net

本文链接

《Windows Fun 7》二：Windows Phone怎样实现一个水平切换Page的Transition

2011-09-10T11:39:00Z

前言

重置过Windows Phone 7手机的朋友，一定记得，重置之后第一件要做的事是设置语言，时区，时间，Live ID等信息。我们也一定记得那是一种水平切换的动画。当我们点击下一步时，页面从右向左滑动。有点类似iphone主页菜单的左右滑动效果。

前段时间QQ群有人在问这种效果。这样的效果有时候会用到，比如街旁WP7客户端开始的引导用户使用的几个页面，类似教程，就可以做成这种效果。还有，如果需要在客户端注册，也可以把几个注册过程做成这样的效果，还有比如翻书的效果，也可以这样平移……

我们可以看下一下效果，它是从右向左连贯的水平滑动，本篇就分析这样的思路以及实现原理，并给出源代码下载：

1.你的思路

如果我猜的没错，你已经有了大概的思路：设置一个Canvas，按每个页面实际的位置布局，然后每次修改每个元素的Canvas.Left……

确实，以前我也这么干过！

这样虽然可行，但是有点显得我们不够专业，而且所有页面需要一次实例化，如果页面过多，那会影响第一次加载时间。

那怎么办呢？不急，我们一步一步来慢慢分析。

2.Silverlight中的简单导航

切换，切换，切换，该怎么切换呢？

想想，在Silverlight中，我们要由一个UI页面切换到另一个UI页面，在不借助Frame的时候，会怎么办呢。

最简单的，就是将容器的Content给替换成另一个对象，没错就是这样。

所以，页面切换的最简单模型就是，最外层放置一个ContentControl，第一次显示的时候给他的Content赋值一个页面实例，在用户点击导航按钮之后，用另一个页面实例替换。如下的模型：

3.Frame+Page

其实，没错啦，页面切换的基本模型就是这么简单。

Silverlight提供了一个Frame+Page的导航模型，它其实仍然是这样的原理。我们首先看下Frame的定义：

1: public class Frame : ContentControl, INavigate 2: { 3: public bool CanGoBack { get; internal set; } 4: public bool CanGoForward { get; internal set; } 5: public Uri CurrentSource { get; internal set; } 6: public Uri Source { get; set; } 7: public UriMapperBase UriMapper { get; set; } 8: public event FragmentNavigationEventHandler FragmentNavigation; 9: public event NavigatedEventHandler Navigated; 10: public event NavigatingCancelEventHandler Navigating; 11: public event NavigationFailedEventHandler NavigationFailed; 12: public event NavigationStoppedEventHandler NavigationStopped; 13: public void GoBack(); 14: public void GoForward(); 15: public bool Navigate(Uri source); 16: public void StopLoading(); 17: }

Frame首先是一个ContentControl，那么每个Page就是一个页面了。不同的是不需要我们去替换Content，我们只需要指定一个XAML文件的地址，Frame会根据路径找到这个页面，然后实例化，然后自己替换它的Content。

相比我们前面得出的最简单的模型，它仅仅是提供了一些导航事件，使得我们可以做出一些处理。

我们看到，Frame模型简化了我们开发中的页面导航。还是很有用的。

4.Windows Phone 7中的Transitions

Nice！但是页面切换太突兀了，一下子就换过来，一点都不符合Silverlight的风格，Silverlight可是做动画的啊，Silverlight可是替换Flash的啊，为什么要像HTML一样导航呢。

Windows Phone 7操作系统出来后，Metro横空出世，Metro强调流畅，强调平滑，强调每户的每个操作和响应都能通过一些视觉变换反馈给用户。因此，给Page之间的过度加入了Transition。

不过默认的PhoneApplicationFrame并没有加入Transition的功能，我们需要去分析Toolkit里面的TransitionFrame代码。

对TransitionFrame的分析以及将本实例转化为Frame的方式将会在下一篇分析。

5.本示例代码分析

本实例实际上来源于PDC大会上介绍Expression Blend 4时官方演示的源代码示例。其中我把导航的部分抽取出来。

和Frame+Page的模型类似，本实例也由两部分组成：TransitionContentControl和SlideShow。其中TransitionContentControl类似于Frame的功能，而SlideShow类似于Page，不同的是SlideShow是继承于ItemsControl，它首先就会取得所有页面并实例化，这在页面多得时候不是很可取，后面我会将它进行改造。

1: public class TransitionContentControl : Control 2: { 3: private ContentControl currentWrappedContent = null; 4: private Grid grid = null; 5: 6: public Style TransitionStyle { get; set;} 7: public object Content{ get; set;} 8: 9: static void ContentPropertyChanged(object o, DependencyPropertyChangedEventArgs args); 10: static void TransitionStylePropertyChanged(object o, DependencyPropertyChangedEventArgs args); }

和前面的Frame没有太大区别,神奇之处在于多了一个TransitionStyle依赖属性,这个Style也没什么区别,神奇之处在于多了一个LayoutStates

1: <Style x:Key="SlideTemplate" TargetType="ContentControl"> 2: <Setter Property="Template"> 3: <Setter.Value> 4: <ControlTemplate TargetType="ContentControl"> 5: <Grid x:Name="grid" Background="{TemplateBinding Background}"> 6: <VisualStateManager.VisualStateGroups> 7: <VisualStateGroup x:Name="LayoutStates"> 8: <VisualState x:Name="BeforeLoaded"> 9: <VisualState x:Name="AfterLoaded"/> 10: <VisualState x:Name="BeforeUnloaded"> 11: </VisualStateManager.VisualStateGroups> 12: <Grid.RenderTransform> 13: <CompositeTransform/> 14: </Grid.RenderTransform> 15: <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}"}"/> 16: </Grid> 17: </ControlTemplate> 18: </Setter.Value> 19: </Setter> 20: </Style>

关于LayoutStates，我之前的一篇文章有介绍：http://www.cnblogs.com/hielvis/archive/2010/10/09/1846046.html

其实也很简单，它定义了三个状态BeforeLoaded，AfterLoaded，BeforeUnloaded。

BeforeLoaded就是一个页面加载之前的状态，如果页面是从右向左滑动，那么它应该是在屏幕右边看不见：

1: <VisualState x:Name="BeforeLoaded"> 2: <Storyboard> 3: <DoubleAnimation Duration="0" To="1000" 4: Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 5: Storyboard.TargetName="grid"/> 6: <DoubleAnimation Duration="0" To="0" 7: Storyboard.TargetProperty="(UIElement.Opacity)" 8: Storyboard.TargetName="grid"/> 9: </Storyboard> 10: </VisualState>

我们看到这个状态，其CompositeTransform.TranslateX被设置到屏幕后边的位置，并且透明度为0，不可见。

与BeforeLoaded状态相反，BeforeUnloaded如下：

1: <VisualState x:Name="BeforeUnloaded"> 2: <Storyboard> 3: <DoubleAnimation Duration="0" To="-1000" 4: Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 5: Storyboard.TargetName="grid"/> 6: <DoubleAnimation Duration="0" To="0" 7: Storyboard.TargetProperty="(UIElement.Opacity)" 8: Storyboard.TargetName="grid"/> 9: </Storyboard> 10: </VisualState>
而AfterLoaded就是一个页面正常显示的状态，那为什么它是空的没有设置呢，那是因为它和正常状态一样，没有修改任何元位置，下面就是正常状态：

1: <Grid.RenderTransform> 2: <CompositeTransform/> 3: </Grid.RenderTransform>

好了，由此我们不难明白，由BeforeLoaded状态过度到AfterLoaded状态，就是新页面由右向左滑入的动画；而由AfterLoaded状态过度到BeforeUnloaded状态，就实现了页面向左淡出的动画效果。

那么你会问，这两个状态过度如何同时进行的。实际上，这两个动画不是同时作用在一个元素上，通过前面简单的模型，我们知道Frame实际上控制着两个页面实例，在切换的时候，它将两个不同的状态过度分别作用的两个页面上，具体的代码在OnContentChanged方法中：

1: protected virtual void OnContentChanged(object oldContent, object newContent) 2: { 3: ContentControl oldWrapper = this.currentWrappedContent; if (oldWrapper != null) 4: { 5: VisualStateGroup layoutStatesGroup = FindNameInWrapper(oldWrapper, "LayoutStates") as VisualStateGroup; 6: if (layoutStatesGroup == null) 7: { 8: this.grid.Children.Remove(oldWrapper); 9: SetContent(oldWrapper, null); 10: } 11: else 12: { 13: layoutStatesGroup.CurrentStateChanged += delegate(object sender, VisualStateChangedEventArgs args) 14: { 15: this.grid.Children.Remove(oldWrapper); 16: SetContent(oldWrapper, null); 17: }; 18: VisualStateManager.GoToState(oldWrapper, this.Reversed ? "BeforeLoaded" : "BeforeUnloaded", true); 19: } 20: } 21: 22: ContentControl newWrapper = new ContentControl(); 23: newWrapper.Style = this.TransitionStyle; 24: newWrapper.HorizontalContentAlignment = HorizontalAlignment.Stretch; 25: newWrapper.VerticalContentAlignment = VerticalAlignment.Stretch; 26: 27: this.grid.Children.Add(newWrapper); 28: newWrapper.ApplyTemplate(); 29: if (this.TransitionStyle != null) 30: { 31: SetContent(newWrapper, newContent); 32: if (oldWrapper != null) 33: { 34: VisualStateManager.GoToState(newWrapper, this.Reversed ? "BeforeUnloaded" : "BeforeLoaded", false); 35: VisualStateManager.GoToState(newWrapper, "AfterLoaded", true); 36: } 37: } 38: this.currentWrappedContent = newWrapper;} 这个方法实际上是本示例最核心的部分，它分别将两种状态切换作用在两个页面实例上，然后两个动画同时作用，就形成了页面由右向左滑入的效果。这里也提前指出TransitionFrame的一个缺点，它不能像这样两个动画同时作用。我后面将要改造的Frame会加上LayoutStates的支持。此示例其实代码非常精简，思路也很清晰。以上我分析了核心部分。

6.下一篇内容

在此基础上，我相信你已经大概知道TransitionFrame的实现思路了，是的，至少思想是类似的。

但是TransitionFrame要复杂得多，我将在下一篇分析。

本实例实际上有很多缺陷：

所有页面第一次全部实例化，不能像Frame可以在导航的时候加载页面
不能结合PhoneApplicationPage响应回退键，需要响应后退事件还需要手工做一些事情

后续，我将把次功能整合进TransitionFrame或者自定义一个Frame，那是就会分析一下Frame，这样就可以把这种效果与Back事件集成。

7.源代码下载

源代码：http://files.cnblogs.com/hielvis/TecHappy.WindowsPhone.Toolkit.rar

Xap包：http://files.cnblogs.com/hielvis/TecHappy.WindowsPhone.Sample.xap

8.Windows Phone 7技术沙龙

9月17号，我们将在微软亚太研发集团举办Windows Phone 7的技术沙龙，将有一些大家熟悉的一线开发人员分享实战经验。

微博报名：http://event.weibo.com/199979

我们官方宣传页：http://www.techappy.net/

特邀嘉宾

本文链接

《Windows fun 7》一：MVVM for Windows Phone 7

2011-09-08T04:01:00Z

每个Silverlight程序员都有一段痛苦的MVVM经历，MVVM是Silverlight开发永恒的话题。

完美的概念后面是没有标准框架，网络上所能找到的例子也并没有深入介绍，使用过程中一定会接触深层次的问题，并且各个开源框架也是实现方式各异，叫我们Silverlight程序员情何以堪？

网络上一搜MVVM关键字，最常出现的就是MSDN上的一篇：http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

但实际这篇只讲述一般应用场景，实际在使用中还有很多问题需要自己解决。

MVVM的概念最早由Josh Smith于2005年提出：http://blogs.msdn.com/b/johngossman/archive/2005/10/08/478683.aspx

网络上比较完善比较经典的可能是唯一比较全面的教程也是他那本只有54页的《Advanced MVVM》，这本Google上能找到PDF链接。

不过，经仔细阅读和分析之后发现，这个例子仍是讲述一般场景，真正开发仍然还有很多问题留给开发者自己解决。

我的安排是首先我们来总结一下到底哪些问题令我们痛苦，然后分析MVVM的起因，最后我们谈谈怎样消除这些痛苦。

1.MVVM到底有哪些令人痛苦的问题？

我这里总结一下，你也可以一起思考，自己有没有遇到过这些问题，或者正在思考这些问题。

设计时和运行时支持？XAML需要设计时支持，很多MVVM框架直接将ViewModel定义在Xaml资源中，这不是View引用了ViewModel吗？
如果View不能引用ViewModel，那么View怎样取得ViewModel作为上下文？有很多框架都是直接在CodeBehind中加载ViewModel对象？
ViewModel的定义好像很乱，标准的ViewModel应该怎样定义？
ViewModel应该怎样加载数据？
在导航的时候，怎样赋予另一个页面一个ViewModel上下文？有View来指定ViewModel实例还是另外的方式
ViewModel的构造函数应不应该有参数？
一个方法有多个参数，View应该怎么样传递这些参数？
View的CodeBehind中应不应该有代码？
很多时候，ViewModel中的一个方法都要对应View中的一个UI操作，或则切换状态，或者修改属性，ViewModel怎样触发UI变化？
ViewModel怎样调用需要在CodeBehind中执行的方法，比如有些控件的操作不能通过属性修改，而只能在CodeBehind中调用这个控件的某个方法，比如弹出一个ChildWindows，或者MessageBox？比如VisualStateManager.GotoState就只能在CodeBehind中执行？
上述问题：ViewModel怎样切换状态？
多线程？
Windows Phone 7上的ViewModel怎样切换多个Application bar？
Windows Phone 7中ViewModel如何处理回退和导航？

看看吧，你有没有遇到活思考过这些问题？

2.MVVM的由来

其实，这些大多数问题都是有由来的，我们来分析一下。

大多数知道MVVM的人，都可能知道它和MVC有些联系？然而是什么联系和区别？为什么一般人很容易理解和使用ASP.NET MVC，却始终不会应用MVVM？可能都说不清楚。

事实上，拿MVC和MVVM比较并没有多大意义，反而会使人糊涂。在ASP.NET MVC中的View只承担显示数据的作用，它和Controller的交互是通过用户重新发起一起请求，这个请求和View几乎没有关系。并且MVC中得HTML是解释性的，服务器端按View的定义，顺序解释，替换掉相应的数据即可。

然而，Xaml却不是那么简单的，Xaml不仅定义了UI（渲染引擎按照Xaml语言的定义计算和排列元素），Xaml更是一棵对象树，Xaml对象树的概念十分重要，以至于我们应该时时记住Xaml中的每个节点都是一个对象，这些对象由Xaml解析器实例化，并由Silverlight的UI渲染引擎根据布局原理将UI元素绘制到屏幕的相应位置。

可以看到，这和ASP.NET MVC的机制是完全不一样的，虽然都是基于控件事件模型，但是ASP.NET中对象数实例化和显示是分开的，而Silverlight的UI元素对象树就是实际显示在屏幕的UI元素，它们是一个东西，因为Silverlight中这些UI元素和程序的交互和联系就十分重要和强大。

在Silverlight中，可以说最重要的是引入Xaml编程模型，使我们很好和很方便的定义UI元素和对象树，加上它的Xaml解析器，顺序的解析Xaml中的一个一个对象，Xaml解析器通过调用每个节点对应的类型的够构造函数来构造对象树，而Xaml能够识别每个节点的类型，能够识别像INotifyChanged这样的类型，所以Silverlight加入依赖属性，绑定这样一些概念。这都跟Xaml特点是有关的。Xaml是一种强大的编程模型，据悉Xaml团队已经加入Windows 8 Team，所以可以预见Windows 8的应用程序跟Xaml有很大的关系。

因此，MVVM基本上是Xaml这种编程模型催生出来的。它和MVC除了分离的思想外没有什么可比的意义。

3.MVVM痛苦的根节点

然而，不管怎么样，Silverlight终究还是基于事件模型，事件的编程模型是一种极简的编程模式，它让开发者很容易的处理用户的输入（文本或者事件）。不管是Windows Form，Web Form还是Silverlight，都是基于这种编程模型。

可是事件编程模型有一个很大的缺点，开发者很容易将业务逻辑混在UI操作中，这经常被称为Codebehind的文件。这样的后果是容易使开发者将注意力放到一些表现层的细节上，而且，很容易将业务逻辑与一些表现的细节耦合在一起，更严重的是，由于大多数控件对象的不可构造，对程序的可测试性带来很大挑战。它也使美工和开发的分工很不明确。

因此，早期有分层的思想，分层实际上就是将某一抽象级别的业务封装。

而在分层的接近UI层面，也出现分离的思想，它企图将UI彻底分离出来。MVC即是一种方案，可惜的是VS对ASP.BET MVC的设计时支持不够好。

而在Silverlight开发中，Blend能支持很好的设计时。

可是问题是，Xaml并不是为MVVM设计的，它的核心思想任然是控件和事件。所以MVVM试图将View和ViewModel分开，它需要将用户事件转化为ViewModel的方法，它需要在ViewModel中驱动一个UI变换，而View有各种各样的事件和控件，View也有各种各样的变换。因此原本在Codebehind中轻松搞定的事情，在MVVM模式下需要做大量的事情。我承认Codebehind的方式让业务有点混乱，但是MVVM实在是很麻烦，有时候你会觉得MVVM实际上把一件事情搞复杂了。

5.MVVM痛苦级别

MVVM的痛苦级别，取决于你想让Codebehind有多干净，这也有需求方面的考量。

1. 如果你仅仅是为了易于测试，业务清晰，这很简单，你只要注意把业务尽量移到ViewModel即可，View引用ViewModel都无所谓，在Codebehind中调用ViewModel中方法也无所谓，这实际上跟一般的分层没多大区别。

2. 如果View和ViewModel都是你在设计，不需要View和ViewModel严格分离，你可以大部分使用各个MVVM框架的标准做法，但是，你知道的，每个MVVM框架都有很难完全分离的方面，这个时候可以在CodeBehind中处理，因为转换到ViewModel中需要增加很大的工作量和理解上的复杂度。这也是我推荐的，或者说这是一个折中。

3. 如果你想完全将View交给另一个你甚至不认识的家伙去设计。你将挑战最难的MVVM设计--将事件模型完美转化为MVVM模型，你将不得不去解决所有问题，包括我上面列举出的一些问题。这样应该很少。

6.MVVM核心技术和思想

1.附加属性和Binding

附加属性是WPF提出的一个全新的属性系统，它用来支持绑定，变更通知，以及Xaml的样式Style系统，在ＭＶＶＭ中主要是View和ViewModel之间的数据绑定和传输。

2.附加属性

不可否认，Xaml编程模型，最强大和最重要的概念是附加属性。

Blend中最强大的Behavior，Action，Trigger，VisualState等等，绝大部分特性都和附加属性有关。要使View和ViewModel完全分开，必须有一层抽象层作为两者之间的桥梁。

Xaml对于附加属性的支持，使得这个中间层（附加属性所属的类）可以得到一个被附加的对象的引用，这个中间层拿到引用之后就可以做一些翻译，比如一个ButtonCommand就是一个中间层，它拿到一个Button对象之后，订阅这个Button的Click事件到一个方法，并让CanExecute方法执行时，去修改Button的IsEnable属性。

还有比如你要想在ViewModel控制PhoneApplicationPage的导航和回退，Application Bar的切换等，都可以通过类似的思路来实现。

总之，你记住附加属性是Silverlight最重要的知识点。

3.上诉情景有时候也可以用扩展方法来代替，这个扩展方法就充当中间层，但是这种情况下要假设这个中间层能够根据某种规则找到ViewModel对象，并且需要在Codebehind中调用扩展方法。不过这种方式有时候确实有一定的好处。

总之，掌握上述两点你能应付大部分场景，并且在遇到问题之后可以想办法去解决，核心思想就是一个中间层，它要么是利用附加属性，要么是利用扩展方法。

7.MVVM技术分享

9月17号，我们将在微软亚太研发集团举办Windows Phone 7的技术沙龙，将会详细分享MVVM的知识和经验。

详情见这里：http://event.weibo.com/199979

我们官方宣传页：http://www.techappy.net/

本文链接

快乐技术沙龙 for Windows Phone 7

2011-08-28T15:06:00Z

官方主页：http://www.techappy.net/

本文链接

5月29号,望京微软,北京快乐技术沙龙,Blend设计示例提前看(Silverlight)

2011-05-24T01:29:00Z

你在开发Silverlight/WPF/WP7应用程序？

你不怎么会使用Blend？

你们公司没有Blend设计师？

你想做出更流程炫丽的界面？

5月29号，与你分享Blend设计，内容贯穿：

深刻理解XAMl，附加属性，Behavior，Trigger&&Action，VSM，FluidMoveBehavior，FluidLayout，LayoutStates，FluidMoveTagSetBehavior，PathListBox

我的Silverlight&Blend系列文章：

Behavior：http://www.cnblogs.com/hielvis/archive/2010/10/06/1806813.html

Silverlight布局：http://www.cnblogs.com/hielvis/archive/2010/10/12/1847025.html

Blend模板设计：http://www.cnblogs.com/hielvis/archive/2010/10/21/1857415.html

XAML那些事儿：http://www.cnblogs.com/hielvis/archive/2011/02/27/1966201.html

Blend 4：http://www.cnblogs.com/hielvis/archive/2010/10/09/1846046.html

熟悉的名字：

nowpaper

Alexis

田永智(Windows Phone 7中文输入法作者)

chenkai

金色海洋

.....

特别嘉宾：

黄继佳：黄继佳是平台及工具事业部资深开发技术顾问负责Silverlight和IE项目

严飞，严飞是平台及工具事业部资深开发技术顾问负责WindowsPhone7项目

活动详情：

http://www.cnblogs.com/hielvis/archive/2011/05/18/2049521.html

本文链接

【5月29号】北京快乐技术沙龙第二期活动【微软站】

2011-05-17T22:27:00Z

联合举办！

北京中游在线科技有限公司是无端化领域的网络游戏开发公司，是微软中国战略合作伙伴，开发有全球首款SilverlightMMORPG《窝窝世界》，是全国非商业性质推广.Net技术的先锋组织！！

一，本次活动详情

活动时间：2011-5-29

活动地点：：北京市朝阳区望京街8号利星行广场C座，微软大厦316

活动联系人：秦春林（186 1024 8500）

活动开始时间：下午1点

活动结束时间：下午5点

二，活动主题

本次活动主要分两个场次：

13:00-14:30：交流环节，每个人简短介绍自己，介绍自己的工作经验，希望学习了解的技术等等，不限形式，让大家之间相互认识。

14:40-17:00：技术环节，示例讲解Blend的各个方面的使用和设计，每个知识点会有一个比较擅长的人讲解和操作一个小例子：

XAML及Blend设计器设计时（10-20分钟）

行为（Behavior）和触发器（20-30分钟）

模板和修改控件样式（20-30分钟）

控件自定义（10-30分钟）

状态设计（状态管理器，缓动函数等）（20-30分钟）

Blend中的一般行为介绍和分析（10-20分钟）

总结：Blend可以设计大部分与UI相关的界面和行为动画（无需Code）

三，活动要求

正如快乐技术沙龙的主旨，我们希望每个人都能参与到活动中，将自己学习工作过程中的一些经验分享。每个人都有自己的爱好和擅长的技术，每个人都有一些经验可以分享。所以我们的主题的主要形式是每个人来讲述自己的理解和经验。

但是，我们不会要求每个人准备一份PPT或者演讲稿什么的，你只需要那么几分钟时间简单描述你擅长的技术或者思想就行。当然我们希望经验丰富的朋友能够多分享一点给其他朋友。

如果你觉得自己啥都不会，或者不能讲，那么你一定遇到困难，请讲出你遇到的困难或者迷惑。

总之，希望每个人都参与讨论和分享。

四，警告

很牛不屑于分享的人不能参见

很菜又很自卑的人不能参加

只想当听众的人不能参加

五，报名方式

因为我们每个人都需要参与主题讨论和分享，所以我们需要提前了解一下每个人的大概情况，以便于控制和推动活动有序进行，请按一下格式发送Email到 Tech.Happy@live.com

唯一标识符(URI)：网名，QQ昵称，或者博客园ID，或者真实姓名

工作年限：

擅长技术或领域（可以为我们分享的内容）：

期望学习和了解的技术：

联系方式(可选)：便于我们有事联系你。

另外，也很欢迎附上你对活动的建议，^_^

六，乘车路线

活动地点：北京市朝阳区望京街8号利星行广场C座，微软大厦316

乘车路线：乘地铁15号线至望京站下，然后打车（5分钟）或步行（15分钟）至微软大厦

完整活动文档下载：

http://files.cnblogs.com/hielvis/Techappy_Blend.pdf

本文链接

北京快乐技术沙龙5月8号活动介绍

2011-05-03T01:25:00Z

一，北京"快乐技术沙龙"简介

北京"快乐技术沙龙"是由博客园"快乐之王"(http://hielvis.cnblogs.com) 发起的，主要面向.NET技术开发者的不定期举行的线下讨论交流活动。2011年5月8号活动是该技术沙龙的第一期活动。

"快乐技术沙龙"不定期举行：

1. 地点不固定：地点可以是由一些软件或其他公司提供，也可以根据大家协定在一些公共场所，如咖啡厅，或者其他休闲场所。甚至可以是户外的形式。

2. 形式不固定：可以是单纯的演讲式，可以是讨论式，可以是类似电视节目主持的方式等等。

3. 内容不固定：主要针对.NET技术，但是内容不固定。可以是前端，可以是数据库，架构或者某一类具体技术等。但是每一期会有几个协定的主题内容。会提前告知每个参与者。

北京有许许多多的技术沙龙，有大公司主持的，有大的社区网站主持等等，然而快乐技术沙龙的出发点和宗旨不一样。

一般的技术沙龙主要由几场演讲组成，每一场的演讲者是某个领域的牛人。整场活动围绕这几个牛人展开，会议期间很少有人提问，参与者之间也缺乏足够的交流。整个流程就是“进会场”-“听演讲”-“离开会场”。而且事实上，除非很专业的沙龙，一般演讲的内容都是很基础的。

快乐技术沙龙，关注开发人员的成长，主要围绕以下两方面展开：

1.快乐生活： 我们一般都是来自异地，远离家乡和亲人在外面打工。然而现在大都市人与人之间的距离很远。我们缺乏朋友，因此生活有些单调。

可是既然我们大部分时间要在这里度过，为什么我们不过的更快乐一些呢！

在一个城市快乐的生活，我觉得首要的是朋友。我们需要一些知心的朋友，可以一起玩，一起聊天，一起学习，一起交流。朋友之间也会相互影响，跟优秀的人在一起，你也会走向优秀；更积极的人在一起，你也会更有激情。而这些朋友对我们的生活和职业发展都是有益处的。

所以，在我们的活动中，我们重点强调每个参与者的交流，分享自己的技术经验，学习方法等。我们的活动内容不是某个牛人的指点，而是所有参与者的经验分享。以此增进每个人的了解，也许他们会成为你的一个朋友。

2.快乐工作：有时候我们觉得技术日新月异，感叹自己跟不上技术的发展，总是在追逐技术的变化，并且感到这种变化太快，总是觉得技术的生活过得很累，感到前途黯淡。

然而也有一种现象是，我们看到国外，其实包括台湾，有一些技术大牛，不但技术很牛，并且感觉他们过得很开心，不像我们过得那么痛苦。

然而，几乎可以看得出，这些悲观的态度里面有很多是对自己技术没有信心，而不是对行业没有信心。所以既然这样，与其没有结果的抱怨，不如我们来真正的提高自己。

所以，我们希望在技术交流中，你能够不光了解一种技术。更重要的是了解不同人的学习方法，技术经验和一些思想。这些相比于技术细节，也许是更能真正使你技术提高的。

所以，从生活和工作两个方面，通过结交朋友和学习技术经验两个方面，快乐技术沙龙真正在乎的结果，其实是每个人的成长。我们希望每个人都在一个城市快乐生活，快乐成长。

所以，在快乐技术沙龙中，每个人都是主角，每个人都应该积极分享自己的经验。

费用原则上AA，不过有时候会有公司赞助。

联系方式，目前以QQ群(51825601)为主，后面会建立相关站点。

Emial: Tech.Happy@live.com

二，活动详情

活动时间：2011-5-8

活动地点：北京市海淀区上地七街八维教育内金和软件（后附乘车路线）

活动联系人：快乐之王（186 1024 8500）

活动开始时间：上午10点至10点半

活动结束时间：下午4点半至5点左右

三，活动主题

本次活动主要分三个场次：

10:00-10:30：进场，介绍沙龙基本形式和内容，大家相互之间认识一下

10:30-12:00：主要讨论和分享Silverlight，WPF开发相关技术。包括WP7，MVVM，Blend的使用等。

12:30-13:30：感兴趣的根据天气可以举行一场篮球赛，也可以玩乒乓球，室内足球，飞镖等

13:30-15:00：主要讨论Web开发，包括前端，缓存，搜索引擎优化等内容。

15:00-17:00：艺街开放平台架构思路，开源方式，以及发展方向等。如果你还不了解，参见：

http://www.cnblogs.com/hielvis/archive/2011/03/30/1999366.html

四，活动要求

如果你觉得自己啥都不会，或者不能讲，那么你一定遇到困难，请讲出你遇到的困难或者迷惑。

总之，希望每个人都参与讨论和分享。

五，警告

很牛不屑于分享的人不能参见

很菜又很自卑的人不能参加

只想当听众的人不能参加

另外，鉴于快乐技术沙龙这种思想和形式的首次尝试，我们不能保证效果很好，不能保证给予你太多实质上的东西。如果你承受不起这种失望，强烈建议你不要参加！

六，其他

本次活动由北京金和软件公司(http://jh0101.com) 赞助，提供糕点，茶水等。

七，报名方式

因为我们每个人都需要参与主题讨论和分享，所以我们需要提前了解一下每个人的大概情况，以便于控制和推动活动有序进行，请按一下格式发送Email到 Tech.Happy@live.com

唯一标识符(URI)：网名，QQ昵称，或者博客园ID，或者真实姓名

工作年限：

擅长技术或领域：可以为我们分享的内容，能准备示例Demo更加，您需要花几分钟的时间分享一下，^_^

期望学习和了解的技术：

联系方式(可选)：便于我们有事联系你。

您对活动的建议：很欢迎附上你对活动的建议，^_^

八，乘车路线

活动地点：北京市海淀区上地七街八维教育内金和软件

乘车路线：城铁13号线西二旗站换乘509路公交至软件园南站或者114至软件园东站向西300米左右

公交站上地七街(205,114,112,717)（有个大转盘）向西直走，穿过一个十字路口过200米即是八维教育

九，活动文档下载

http://files.cnblogs.com/hielvis/%E5%8C%97%E4%BA%AC%E5%BF%AB%E4%B9%90%E6%8A%80%E6%9C%AF%E6%B2%99%E9%BE%99.pdf

本文链接

托管可扩展框架MEF高清视频下载+在线Silverlight流式播放+源代码+PPT

2011-05-03T01:24:00Z

Content：

这是给一些朋友介绍Managed Extensibility Framewo（MEF）的视频，第一次录制视频，请多多包涵！

由于博客园不支持ifreame，所以很遗憾不能直接放到博客园播放，请点击后面的链接，该页面只有一个Silverlight播放器。

刚进去需要等一点时间（应该不到一分钟）加载，请耐心等一下，视频肯定会出来的！

你的网速越快，视频越清晰，反之会有点模糊！这是基于Silverlight流式加载的！

在考虑有时间也做几个类似的Silverlight的视频。

Silverlight Streaming

顺便介绍的是，一个这样的Silverlight视频不需要主机，只需要Azure中的Blob就能搞定，甚至不需要Azure的虚拟机，Blob的费用是很低的，很划算。如果你也想体验怎么用，参看Smarx的博客：

http://blog.smarx.com/posts/smooth-streaming-with-windows-azure-blobs-and-cdn

Expression Encoder

另外一点就是Expression Encoder默认是不支持AVI格式的，需要下载一个解码器：

http://www.free-codecs.com/

这样你就可以在Encoder中处理AVI格式的视频

Downloads

在线播放地址： http://egy.blob.core.windows.net/mef/Default.html

源代码： http://files.cnblogs.com/hielvis/MEFDemo.rar

PPT ： http://files.cnblogs.com/hielvis/MEF.pptx

高清版视频下载(514M)： http://egy.blob.core.windows.net/videos/mef.avi

快乐技术沙龙：

顺便提一下：上一篇提到的技术沙龙初步计划5月第一个周末（5月7号或者5月8号），感兴趣的朋友赶紧报名！

http://www.cnblogs.com/hielvis/archive/2011/05/02/2034649.html

本文链接

艺街开放平台开源计划

2011-03-30T02:43:00Z

相信园子里也有一部分朋友听说过艺街开放平台了，还有很多关注过她的开发过程。之前是作为自己的一个创业项目，曾经辞职4个多月时间开发，受到很多朋友的支持和鼓励。其中最感谢的要算善友了，他不仅很支持并且给予很多技术上的指点，例如最终采用的OpenID和OAuth的方案，并且我们都喜欢REST；另外还有麒麟也很支持，我们曾经深入讨论过技术方案；还有炭炭等等，以及我的QQ群的很多朋友，他们陪我度过了那4个月枯燥的岁月！

到目前艺街的思路也算完整并完成了很基础的开发。由于种种原因（后面会详细介绍），现在打算将艺街开源出来。本篇会介绍艺街的成长过程以及公布开源计划，如果你感兴趣欢迎你的加入，^_^！

体验地址：http://elvis.egyee.com

最初的梦想

2010年4月左右，我初步有了这个想法。那个时候想法比较简单：我手上有一个ipod touch，感觉这样的方式使用应用程序确实很方便，很丰富，能将各种应用集中到一个地方，用户可随意选择。然而遗憾的是，你必须随时带着这个终端才能使用。

而反观各种互联网，各种应用被分布在多个网站，每个网站都会重复建立用户的基本信息，用户需要不停地注册和记住各种各样的密码和账号，不同的网站之间几乎都有重复的功能等等。

于是，最初的想法就是能不能把一个iphone终端换成一个浏览器！

酝酿

这个想法其实很简单，或许你曾经也有过这样的想法。

然而它却使我着迷和疯狂：因为凭借我当时的技术经验，很多技术问题我根本无法实现！然而，就像大多数热血沸腾的程序员一样，我们都有一颗冲动不安的心，尤其对于刚毕业半年的我，她很快就会引发你的激情，使你想到了国外的某个谁谁谁，她很快就会变成你的一个创业梦想！

于是，我开始寻思解决方案：首先想到了用Silverlight来实现，接下来就是最大的挑战，手机终端会提供数据存储并且可以按照软件，而基于浏览器你得到为不同的应用程序提供Web服务的托管，你得为每个应用程序的Web服务提供基础的数据服务；

你得有一个框架，让开发者可以发布Silverlight应用程序包，这个简单；你得让开发者可以以组件的形式发布Web服务，这个方案并不知道怎么实现，它大概就是让一个WCF的集合打包成一个dll，并且需要被正确路由；你得为每个应用提供存储服务，这个没辙了……

然而，梦想和想法之间的区别就是，梦想会刺激你不断的想办法去实现它，而想法可能只是一个想法。

那个时候刚好公司有技术顾问讲解Windows Azure，于是是否看到一些希望，那个时候Azure几乎很少中文资料，激情之下居然阅读了大部分的Azure文档和一些关于Azure的电子书，沿着自己的思路不断学习不断完善。从2010年4月到2010年9月，期间我无时无刻不在想着怎样实现它，无时无刻不在想着怎样完善它，思想和可行性都慢慢变得越来越成熟，可是期间的过程真是相当的困难，因为很多技术问题对于当时的我来说是无法完成的。

下面这张图文件的创建日期是2010年6月15日：

而这一张图的创建时间是2010年9月24日：

当它变成这一张图的时候，我辞职了：

辞职实现：

2010年9月30日，我办完了离职手续，汗，工作大半年那个时候手上才8000块钱左右！

当它的技术方案成熟之后，我的心思再也不能放在工作上，虽然那个时候没有资金。从一开始我考虑的就是首先要把它做出来，只有做出来才知道它怎么样，如果不行动结果什么都没有，所以那段时间几乎没有考虑运营和推广的事情。

为了筹钱，还卖掉了ipod touch，开500还被刀了50，呵呵

辞职之后其实还算顺利，因为整个思路非常清晰了，基本上是按计划实现，之后只是技术实现的细节，虽然也会遇到一些挑战，但是大的方向没有问题的。

那段时间体验到了一种感觉，就是你不断去解决问题，得到一点成就，然后很快就会遇到另一个问题；有些问题是令人沮丧的，因为毕竟我没有太多的技术经验。这样的感觉不断的跟着我大半年的时间直至今年初的完工！

辞职之后也积极参与博客园技术分享，认识了善友，麒麟，谢方，已经很多加入QQ群的朋友。尤其得到善友的不少指点，真是非常感激！

辞职之后为了节省房租，跑到了离深圳很远的一个海边小镇--南澳！300的房租还算可以，而且在海边

经历了大概4个月的时间，大体完成了开发，你可以从这里看到演示地址，它可以托管Web服务，它可以为每个用户的每个应用程序提供标准的Windows Azure存储API，其中的ipivot应用程序便是一个真实的例子：

思考运作

之前一直只想把它实现出来。这个时候虽然东西大体出来了，但是运作却并非那么简单。技术上一些问题可以查资料学习，这个事情却没办法学习

也在深圳找过一些朋友一起做，但是都不太可行，他们都不可能像我一样全职做这件事情，都只能业余参与，这样肯定做不好事情的。另外，我的同学到是很多热情的愿意出点钱，但是觉得不知道怎么着手运营风险太大却不敢要他们的钱。

也许，这就是我们缺乏各种社会经验的方面，并且这些事情不可能通过学习得到。

想了很久无果，后来刚好看到创新工场的助跑计划。

面试创新工场助跑计划

在提交了创新工程助跑计划之后，2月底收到面试通知。

在激情的半个小时演讲之后，创新工场的投资人士告诉我：

这个平台，不是你要做的事情，它是Google要做的事情，你没有用户开发者为什么在你上面开发应用程序，你没有应用程序，用户为什么使用。希望没有打击到你，再见！

很简洁，很干脆，原来这就是投资者！

一个北大青鸟的老师也说：

你基于微软的云设施，你给微软钱，你赚什么钱
你这个平台如果我们来做更有实力和影响力，你凭什么做

后来在经济压力下，我找工作了，(>_<)

开源计划

经受一系列打击之后，其实想想做平台也许真不是那么好做的：

Facebook到一定规模的时候才有平台，腾讯统治中国之后开始做平台，淘宝拥有大量流量之后开始平台。平台它需要一个产业链，凭空做平台的难度很大！

另一方面，鉴于我自己的工作经验，还有许多需要学习和提高锻炼！

但是，同时我觉得从技术上至少它是可行的，因此我决定将它开源出来。一方面将一些技术和思想和大家分享，另一方面它也可以在小范围内供一些用户使用，因为对于用户来讲它还是有一定的价值！有了这样一个平台，我们随时可以发布一个小应用，而不需要考虑存储空间和托管，并且你的应用还可以被其他人很方便的使用。

艺街开源团队期待你的加入

我花费了很多精力在这个平台上，所以即使开源也不是简单的贡献源代码，我希望把它做好！

所以我会组织线下的讨论具体的开发细节和分工，不会仅仅在网上沟通，我觉得那样没有效率。

4月份，我打算在北京组织一次技术沙龙，到时候会留出一部分时间讨论这个开源项目：

加入艺街团队，你将会学习和使用到：

Windows Azure相关技术
Silverlight
ASP.NET MVC
开源协议OpenID和OAuth
RESTful API
等等

REST会让你更了解Web架构，你会更加了解Web之间的交互和通信。你会更明白HTTP传输协议，这是整个Web开发的基础和最核心的部分。

当然，你也会结识一些朋友，互相学习交流，我希望将它做好，也希望其中有你的贡献！

如果你感兴趣，请加QQ群：51825601（北京.NET技术沙龙），我们正在策划4月份的一次技术沙龙，到时候会有部分时间讨论开源计划。具体安排会在群内通知，这个群打算定期举行沙龙活动！欢迎加入，^_^

本文链接

博客园_快乐的博客

《Windows Fun 7》四：修改ListBox的模板，视觉状态，及状态过渡

《Windows Fun 7》三：Metro风格的图标按钮

《Windows Fun 7》 二：Windows Phone怎样实现一个水平切换Page的Transition

《Windows fun 7》一：MVVM for Windows Phone 7

快乐技术沙龙 for Windows Phone 7

5月29号,望京微软,北京快乐技术沙龙,Blend设计示例提前看(Silverlight)

【5月29号】北京快乐技术沙龙第二期活动【微软站】

北京快乐技术沙龙5月8号活动介绍

托管可扩展框架MEF高清视频下载+在线Silverlight流式播放+源代码+PPT

艺街开放平台开源计划

《Windows Fun 7》二：Windows Phone怎样实现一个水平切换Page的Transition