naoki 发表于 2003-3-4 19:31:54

How to : Skin CM4 ... Part I

Skinning is one of the great new features of Champman 4, and who better than Ter to give you a closer look at how to create your own skin. Due to the amount of changes and enhancements between the beta demo and the final version we would recommend that any skins you create are test skins (as they are likely not to be compatible)

Over the course of this week we'll eventually show you how to make a skin based on another skin but allow you to make subtle changes .. keep reading!!

Ter's Quick (but not so quick) Guide to making skin graphics!

Most images in CM4 are made up of three parts. Either left, middle, right or top, middle, bottom.

This allows the images to be stretched to any size, without a loss of quality. This is done by drawing the left image and the right image, and filling in the rest using the middle image. So if you have an button which is 40 pixels in length in CM4, you will have three images for the button in it's default state. button_left, button_middle and button_right.

If button_left and button_right are both 10 pixels in length and button_middle is 2 pixels in length then CM4 will draw button_left (10 pixels) then button_middle (2 pixels) 10 times and then finally button_right (10 pixels). This would give your button a length of 40 pixels.

Component States

Each component can also have different states. Most states for objects in CM4 are

* - This is the state of the object when you place the mouse over the object
* - This is the state of the object when you click it
* - This is the state of the object when it is disabled

Your files are named accordingly. A default button will just be called button.png . For your button the file would be named button_over_left.png for the left side. The same applies to both the middle and right sections of the button. (So you would have button_over_middle.png and button_over_right.png too)

The same is used for clicked and disabled so you would have a total of 12 files for the button component. These are listed below.

Button component - list of files

* button_left
* button_middle -
* button_right

* button_over_left
* button_over_middle -
* button_over_right

* button_clicked_left
* button_clicked_middle -
* button_clicked_right

* button_disabled_left
* button_disabled_middle -
* button_disabled_right

In order to be consistent, you should try (whenever possible) to keep all the file dimensions the same... for example, if button_left is 10 pixels in width and 22 pixels in height... then button_over_left, button_clicked_left and button_disabled_left should also be these dimensions. I would also recommend having the button_right sections these dimensions too as it could cause alignment problems. (especially with the popup menu component)

TOMORROW : WHAT ARE ALL THOSE DIRECTORIES ABOUT

Wing_ask 发表于 2003-3-5 00:41:04

看了,但是不懂~!

里挖耳朵 发表于 2003-3-5 09:25:50

懂了
才怪

xiaocl 发表于 2003-3-5 12:18:44

我也就想换换背景图片,按钮什么的就不用自己做了

刀狂剑痴 发表于 2003-3-8 08:34:53

我也就想换换背景图片,按钮什么的就不用自己做了
同意

PK_FOREVER 发表于 2003-3-9 09:30:03

找我们的英语老师看看

Mendwang 发表于 2003-4-5 20:30:49

hehe

要懂。。。。


真的很难啊         呵呵         :)

里挖耳朵 发表于 2003-4-5 22:13:06

懂了,呵呵

iEE_r2d2 发表于 2003-5-9 12:34:41

谁给翻翻……

tandy21 发表于 2003-7-9 20:33:07

真的看不懂吖!

[ Last edited by tandy21 on 2003-7-9 at 08:35 PM ]
页: [1] 2
查看完整版本: How to : Skin CM4 ... Part I