用Photoshop/Fireworks创建9PNG图像

写这篇帖子是突然觉得自己土啊,没做透彻,引以为戒。

如果9PNG的制作者不是DEV,而是UE,就不需要draw9patch.jar这个工具。
UI设计过程中的Photoshop/Fireworks,即可精确且高效地导出9PNG。

关键点:

1.元素四周设置边框为1px的全透明背景(看起来跟在draw9path一样)。
2.可以填充的内容规则:不透明纯黑色的线条、点、2个分开的点。
3.左右透明区域控制拉伸,上下透明区域控制内容。
4.后缀更名为.9.png。

范例:

mdongorg9png
(图像点击可放大)

个人倒是不建议把9PNG的控制权给DEV,通常他们不能通过draw9path.jar控制图像的质量,以及精确地了解图像伸缩与内容显示的区域。

最起初引发重新学习的过程是碰到draw9path.jar在MAC系统中不能运行是缘由所在路径中包含中文。

12 Thoughts on “用Photoshop/Fireworks创建9PNG图像

  1. 我也不建议RD去做9png

  2. landryshuai on 24 June, 2013 at 18:38 said:

    你的意思是,draw9patch.jar 也仅仅是加个一个像素的透明边框。并在边框加了纯黑线条和点?

    • landryshuai on 24 June, 2013 at 18:39 said:

      我以为它加了exif信息来做到的。

    • 是的。。draw9path的好处是能知道拉伸的效果,这个是最主要的。
      exif是不体现在图像外观的。

      • landryshuai on 2 July, 2013 at 12:32 said:

        我的意思是,jar包在exif里添加信息,然后,android系统在渲染图片的时候,根据exif里的信息知道哪些像素可以伸缩。
        从目前来看,那它知道拉伸区域是靠分析图像的最外一层的像素来取得的。
        但这就有个很明显的问题,那就是,如果有个人,它就希望它的图片是最外一层透明,然后,点缀了些纯黑的点和线条,并且不希望图片拉伸,这该怎么办?
        呵呵,估计也没这么奇葩的人吧。

        • 获知哪些像素可以伸缩固定的途径可以有很多,图形化应该是最直观的最容易操作的,从编辑/review的角度。exif如果要定义伸缩,要去产生坐标值与属性,HOW?后面这个问题好解决,命名不是.9.png就好了嘛· – -

  3. 为什么有纯黑线条??

  4. Pingback: 用Photoshop/Fireworks创建9PNG图像 - 开发者

  5. Pingback: 用Photoshop/Fireworks创建9PNG图像 - 移动端设计与开发 - 开发者问答

  6. 不是很明白,???求详细

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Post Navigation