使用silverlight构建一个工作流设计器(十二)(附源代码下载、在线演示、视频教程)

源代码下载：http://www.shareidea.net/opensource.htm

在线演示：http://www.shareidea.net/workflow.htm

视频教程: http://www.shareidea.net/video/sharedesigner/sharedesigner.html

技术支持QQ群：85444465

本文系列索引： 

使用silverlight构建一个工作流设计器(一)

使用silverlight构建一个工作流设计器(二)

使用silverlight构建一个工作流设计器(三)

使用silverlight构建一个工作流设计器(四)

使用silverlight构建一个工作流设计器(五)

使用silverlight构建一个工作流设计器(六)

使用silverlight构建一个工作流设计器(七)

使用silverlight构建一个工作流设计器(八)

使用silverlight构建一个工作流设计器(九)

使用silverlight构建一个工作流设计器(十)  

使用silverlight构建一个工作流设计器(十一)  

使用silverlight构建一个工作流设计器(十二)  

本章包含以下内容： 

 

l         新的活动图形，图形更加清晰漂亮.

l         增加对上下左右键的支持(选中活动或者规则后，使用方向键进行移动，按住Ctrl时，每次移动的距离加大).不过有一个问题，无法捕获方向键的按下事件，却能捕获松开鼠标事件，不知为何

l         实现我们第十章讲到的变化皮肤的方法。 

 

本章上面的两点更新没有什么值的要说的，下面实现我们在第十章讲的变幻皮肤的方法，

如果您还不了解变幻皮肤的原理，请参考第十章的内容。

八、实现更换皮肤功能

我们对Activity.Xaml类来做试验，步骤如下： 

1.       首先我们把Activity.g.cs(位于obj"Debug"Designer文件夹下)中的类变量和InitializeComponent方法拷贝的Activity.xaml.cs文件中。这些代码如下所示：

 

internal System.Windows.Controls.Canvas container;
        internal System.Windows.Controls.ToolTip ttActivityTip;
        internal System.Windows.Shapes.Ellipse eiCenterEllipse;
        internal Shareidea.Web.UI.Control.Workflow.Designer.ActivityPictureContainer sdPicture;
        private bool _contentLoaded;
       [System.Diagnostics.DebuggerNonUserCodeAttribute()]
        public void InitializeComponent()
        {
            if (_contentLoaded)
            {
                return;
            }
            _contentLoaded = true; 
            System.Windows.Application.LoadComponent(this, new System.Uri("/ShareDesigner;component/Designer/Activity.xaml", System.UriKind.Relative));
            this.container = ((System.Windows.Controls.Canvas)(this.FindName("container")));
            this.ttActivityTip = ((System.Windows.Controls.ToolTip)(this.FindName("ttActivityTip")));
            this.eiCenterEllipse = ((System.Windows.Shapes.Ellipse)(this.FindName("eiCenterEllipse")));
            this.sdPicture = ((Shareidea.Web.UI.Control.Workflow.Designer.ActivityPictureContainer)(this.FindName("sdPicture")));
        }

 

2.       然后编译代码，这时候会发生错误，说已经存在了相同的变量和方法。这是因为在Activity.xaml.cs和Activity.g.cs文件中存在了相同的代码。我们把Activity.g.cs内容全部删除，再次编译，ok，通过了。

3.       虽然编译通过了，但是InitializeComponent代码却无法设置断点，原因是设置了属性

      [System.Diagnostics.DebuggerNonUserCodeAttribute()]

     这个属性用以表示标识不属于应用程序用户代码的类型或成员，这个属性告诉vs.net调试机制不会进入这一段代码。我们把这个属性注释掉，然后再运行就可以了。

4.       接下来创建一个新的activity皮肤文件。通过vs.net类浏览器，我们拷贝Activity.xaml文件，并且拷贝的新文件命名为Activity2.xaml.

5.       然后编译代码，发生错误，因为自动生成的Activity2.g.cs文件中包含了一些代码，我们把Activity2.g.cs清空，然后再编译。Ok，通过。

6.       修改一下Activity2.xaml的样式，以区别于Activity.xaml。

7.       修改Activity.xaml.cs文件中的 System.Windows.Application.LoadComponent(this, new System.Uri("/ShareDesigner;component/Designer/Activity.xaml", System.UriKind.Relative))方法，把/Activity.xaml修改为/Activity2.xaml，使得载入新的皮肤Activity2.xaml文件。

 

最后运行代码，可以看到，使用新的Activity2.xaml文件了。 

这样我们就可以通过改变System.Windows.Application.LoadComponent的第二个参数来动态的载入指定的皮肤。 

到此为止，我们已经完成了一个变幻皮肤的代码。不过还有一些可以深入思考的地方。

 

1、 如果有很多皮肤，那么不希望用户在第一次加载的时候就下载所有的皮肤文件，这样会增加用户等待时间，如果能动态从网络上下载xmal代码就好了，不过还没有找到这个方法。

2、 上面的方法并没有使得.xmal和xaml.cs文件失去关联，我们可以手工剪切xaml.cs文件到其它文件吧，而把皮肤文件(.xmal文件)放在单独的文件夹中，便于管理。

3、 自动生成的.g.cs文件能不能去掉呢？这个文件是在编译时候自动生成的，位于obj"Debug"Designer文件夹下。