本节我将为大家讲解如何在Silverlight平台上实现上一节中的纸娃娃系统,即WPF->Silverlight的移植。
众所周知Silverlight是WPF的子集,Silverlight对像素位图的处理是在3.0版本之后才开始支持,本节我将大量的用到它: WriteableBitmap – 传说中神话的代言人。
移植过程分两步。
首先移植表现层xaml,大家需要特别注意的是Silverlight中ComboBoxItem中的IsSelected和Content与WPF中的有明显书写区别,不清楚为什么微软不对此进行一致化以便可以轻松移植。
接着移值逻辑代码:
首先创建绘图用对象WriteableBitmap writeableBitmap = new WriteableBitmap(200, 200);
接着定义平移对象TranslateTransform translateTransform = new TranslateTransform();
该对象将用于实现上一节中的x,y偏移处理。
然后同样的首先以绘制武器为例:
Image image = new Image();
image.Source = GetImage(
string.Format("/Image/Weapon_{0}.png",
(comboBox1.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 18; translateTransform.Y = 18;
writeableBitmap.Render(image, translateTransform);
大家不妨与上一节的代码进行比较,就会发现非常之相似,只是用了不同的类工具替换罢了。
那么后面是同样的,逐层绘制其他部位:
//绘制身体
image.Source = GetImage(
string.Format("/Image/Body_{0}.png",
(comboBox2.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 50; translateTransform.Y = 50;
writeableBitmap.Render(image, translateTransform);
//绘制左手
image.Source = GetImage(
string.Format("/Image/LeftHand_{0}.png",
(comboBox3.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 72; translateTransform.Y = 52;
writeableBitmap.Render(image, translateTransform);
//绘制右手
image.Source = GetImage(
string.Format("/Image/RightHand_{0}.png",
(comboBox4.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 98; translateTransform.Y = 59;
writeableBitmap.Render(image, translateTransform);
//绘制头部
image.Source = GetImage(
string.Format("/Image/Head_{0}.png",
(comboBox5.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 86; translateTransform.Y = 38;
writeableBitmap.Render(image, translateTransform);
//绘制坐骑
image.Source = GetImage(
string.Format("/Image/Horse_{0}.png",
(comboBox6.SelectedItem as ComboBoxItem).Content)
);
translateTransform.X = 63; translateTransform.Y = 71;
writeableBitmap.Render(image, translateTransform);
全部绘制完后别忘记了将之提交writeableBitmap.Invalidate();
并将最终的合成图象赋值给精灵:
Spirit.Source = writeableBitmap;
是不是很神奇~原来移植可以这么简单的,更重要的,WriteableBitmap使我们能够在Silverlight中对像素位图进行处理,这难道不是伟大的历史时刻吗?
演示Demo:
出处:http://alamiye010.cnblogs.com/
本系列目录及源码下载:点击进入(欢迎加入WPF/Silverlight小组 WPF/Silverlight博客团队)
本文版权归作者和博客园共有,欢迎转载。但未经作者同意必须保留此段声明,且在文章页面显著位置给出原文连接,否则保留追究法律责任的权利。