自定义WindowsPhone7模拟器外观

声明:楼主只是看完了整篇文章,以自己的方式重新讲述,并非逐字逐句的纯翻译,有少部分来源于DD's Space的博客,更没有使用“各种娘”工具。由于该作者的博客在天朝被屏蔽了,所以思来想去,决定还是以原创发布,毕竟有90%以上都属于自己写的,原作者的博客地址是通过网页代理的方式进入的,所以当时没有记录,不知道上面的那个作者博客链接大家能否看到。

此文章针对于那些对有兴趣修改 WindowPhone7模拟器皮肤 的筒子们,转载请注明出处,谢谢:)


注意:如果你不关心修改皮肤的原理,而只是想直接用现成的模板修改,楼主给你一个连接,基本上包含了现在WP7的很多机型 Windows Phone 7 Emulator Skin Switcher

安装了之后直接运行WP7EmulatorSwitcher就可以了,上一张图:

·

粉红色很萌啊~


好吧,进入正题,如果你想知道“原理” 请仔细阅读下文


你可能已经注意到某目录中包含了模拟器的图片,“C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.1\Emulation” 。其实在这个目录下也存储了这些东西 , “C:\ProgramData\Microsoft\XDE\1.0″ ,其实这些都不重要,真正的模拟器所使用的地方在“C:\ProgramData\Microsoft\XDE\1.0″ .下!(原文:“this is the magic place”,当然翻译出来就木有味道了~不要说我崇洋媚外。。。)


你会注意到该目录下有一下这些文件:WM7_Skin.xml,WM7_Skin_Down.png ,WM7_Skin_Up.png,WM7_Skin_Mask.png

        

简单介绍一下吧:

        WM7_Skin.xml文件中包含的信息用于告诉模拟器如何对后面的三张图片作处理应用到模拟器上

        WM7_Skin_Up.png展示了模拟器默认的样子

        WM7_Skin_Down.png展示了各个按钮被按下时的样子

        WM7_Skin_Mask.png上面各种颜色块则表明出每个按钮的位置

图片需要注意的地方:

        WM7_Skin_Up.png 屏幕那一块必须保持和现在WP7仅有的唯一分辨率一致:400*800,

不知道你理解到是什么意思了没有?好吧,上个图解释一下

 

这样应该懂了吧?:)

原作者推荐使用Paint.NET(原文:“for this I will use Paint.NET is free and darn good, much simpler than

Photoshop.”)

不过楼主是用的PS,为了不失原文的意思,下面还是用原文的方法介绍吧

 

1,先打开图片(至少也要比400*800大吧,因为屏幕的大小都需要400*800),背景弄为透明(transparent

 background)

2,添加一个400*800的图层在上面,然后拉伸原始图层直到和图片上屏幕的部分重合为止。有图有真相:

   

 

筒子们应该知道楼主想表达的意思了吧?

好,下面我们来制作传说中的WM7_Skin_Mask.png

把上面做好的WM7_Skin_Up.png打开,然后新建一个图层然后在上面对应着按钮的地方弄上颜色方块

(楼主是先把图层弄个半透明,然后画好了之后再把透明度还原,楼主本来对PS就用得很菜,还请大神

们请教更好的办法--!),

大小和WM7_Skin_Up.png一样,背景最好是白色(待会儿好抠图)。好了,完毕之后大概是下面的样子:

选择魔棒工具,(之所以要是白色背景什么的,就体现在这里了),点一下这个图层基本就已经给你抠好了,

然后删除白色的部分(其实楼主直接按Delete就可以了~我也没找到在哪里删--!额。。~)好了,

原文没有截图,楼主给大家看一下以上操作完毕之后,在楼主的Paint.NET上显示的情况

 

 

好了,现在把背景那个钩钩取消掉,就只剩下三个颜色块了,另存为png,大功告成!

 

至于WM7_Skin_Down.png,就依据各位的喜好打开WM7_Skin_Up.png随便改了~

(这里楼主不是很确定改夸张了是什么效果--!)

好吧,让我们来看最后一步,就是那个XML 文件了。

原图没有截好,现在由于各种原因不能重新截了,所以只有给筒子们讲解一下了,

相信聪明的同学们肯定已经不需要看了,XML嘛,一看就懂,是吧?哈哈

		displayPosX="76"
		displayPosY="175"

这两个是当前图片上的屏幕区域相对于图片左上角的X与Y


mappingImage="Nokia_Lumia_800_Mask.png"
		normalImage="Nokia_Lumia_800_Up.png"
		downImage="Nokia_Lumia_800_Down.png">


这一段嘛,就更不消多说了,一一对应进去就可以了。好了!

赶快试试吧!:) 

 

 

 

 

 

 

 

        

 

        


        









 

你可能感兴趣的:(WindowsPhone7)