关于用UI制作主题的一些建议....(适合新手)

以下内容搬运自原DOSPY论坛｀幾小米的帖子

-----------------------------------------------------------------------------------------------------


首先声明下,我也是业余玩的,并不是什么高手,而这篇文章在于给新手一些指引,抛砖引玉而已.......



~PNG还是SVG?~

大家可以发现,打开UI做图的时候里面很多图象素材都是SVG格式的....这是一种矢量图,就是放大或者缩小都不会影响图的质量的一种格式,而PNG格式的图你一放大,它就会损失图像的清晰度,缩小的话还好一点,这是一种标量图.大家肯定用过PiZero的主题,他的主题上图标基本上是SVG格式的,放大或者缩小都是一样清晰,而一些制作主题的业余爱好者则PNG格式的图标,我想这也就是我们这些业余爱好者和大师的最大差距之所在吧(大师们Create SVG icons,而我们是Choose PNG icons).制作矢量的图标是需要一些美术功底的.....


~不会制作SVG格式的图标,只有选择网上一些好看的PNG格式图标,怎样做才能使效果最好?~

我刚才说过,PNG格式的图标放大后(在原本的大小上放大),会损失图标的质量,而缩小的话会好点,我们应该怎么做呢?有些图标你在UI里面做的话,有几个地方要用到,比如信息那个图标,你进功能表时有那个图标,注意,那个图标是49X49大小的,而你进入信息这个选项之后,你会看见左上方也有个信息图标,注意这个图标是60X60大小的,我们应该怎么做?对了,就是把图标缩小成60X60的最好了,如果你把图标缩小到49X49的话,那么60X60那里也会使用你做的49X49的图标,那效果....被模糊了,而如果你做的是60X60大小的话,在功能表里是被从60X60缩小到49X49的,效果还不会很差....


~必须用到SVG格式的地方~







List highlight,Grid Highlight
这两个分别是选项框和功能表里的矩形选项框,它们在N的地方都被缩小和放大,所以你制作成PNG格式的话肯定在有些地方会发生形变的,而如果你用AI(或者其他矢量软件)做,就不会发生形变了...





~最需要注意的几个地方~

时钟:这个东东就在待机画面的地方,不求做得精美,只要能中规中矩就行了,这个推荐用AI或者其他矢量软件做成SVG格式的,或者直接用UI里自带的时钟元素,换成和待机画面配套的颜色就行...
主色:大家可能发现PiZero的主题里基本上都是以白色为主色调的,为什么?因为白色是最亮的一种色,我们做主题的一个最基本要求是什么?对了,就是能看清屏幕上的字,即使不做成白色的也要和背景分清界限,对比强烈一点就行了,有些花哨的主题,看起来漂亮,可是用起来.....
Pop-up Windows(弹出的窗口):这个嘛,弹出的主窗口会在很多地方出现,而且不是按照比例来缩小放大的,所以你在这些地方用图案就是很不明智的选择了,推荐用一些放大和缩小都不会太明显的纹理来做弹出窗口,这个地方在做的时候应该多多琢磨,因为这个元素真的很常用,很重要
Lines(虚线):虚线在有些时候看起来画蛇添足的感觉,如果你想去掉,载入透明的PNG格式就行了
Waiting/Progress bar Indicators(进度条):这是动态的,需要注意
Call Handling Windows(拔号框):原来带的就很漂亮了,可换也可不换.这个地方支持透明的PNG


~有蓝条去不掉怎么办?~







Navi Pane和Idle Navi Pane:这些地方只要你新建个图层(默认是透明的),再把原来的Clear就行了
Thin Status Pane:这地方稍微复杂点,需要把240X320的待机画面(Active Backgroud)最顶上的240x27的图载入就可以了


~不支持透明效果?~

Pop-up Windows(弹出窗口),Notepad(记事本),Calculator(计算器的主界面):注意这些地方,即使你做成透明的在UI里显示也是支持的,但是....实际上不支持,所以做成透明的再出来显示效果很糟糕


~怎样选择图标?~

首先不要和自己的背景冲突了,比如的待机画面很黑,然后再选择有黑边的图标,那样效果就会很不好,还有不要看到好看的就要那个,需要保持图标风格的统一性,图标风格乱七八糟,还不如没图标....


~没有矢量软件的基础,只会PS怎么办?~

那就只在一些非得用SVG图像的地方用SVG吧,比如List highlight,你只需要在AI或者其他矢量软件里做个圆角矩形框,之后保存为SVG格式的就行了,效果也不差,还有一种简约的美感,需要你做成SVG格式的地方有: List Highlight(列表选择框),Grid Highlight(功能表选择框),Input Highlight(输入框)


~图标像被压扁了?~

注意S60V3里面有些图标长宽是不一样的,在属性栏里有显示,如果你采用长宽相等的图标显示出来的效果就像被压扁了,比如你用49X49的图标,但是它属性栏里显示这个图标应该是53X49的,所以这时你的图标被不等比例的放大,看起来就形变了,遇到这个问题,怎么办?我的做法是做个53X49的画布,里面的图标是49X49的(PNG图),或者53X49的透明图(填充为透明,描边也为透明的矩形),里面的图标是49X49(SVG)

谢谢分享！

谢谢分享！我就是来看看！顺便支持楼主发帖！楼主您发帖辛苦了！

楼主你用的是ecplise 开发的吗?