Editing User Interface and Buttons

I'm messing around with a UI map again, and I'm trying to create my own buttons. Using Zeph's tutorial:

Quote:

---

- Open a new canvas that is 256x64 pixels in size.
- For simplicity, fill it with black.
- Put the the text onto the black.
>>>Note<<< The text can literally be whatever you want. It could even be a picture of a penguin if you want it to be. For the simple purposes of this tutorial, I suggest making it be something like multiplayer, quit, or settings... >>>/Note<<<
- Select all and copy.
- Add one pixel to the width on the right side and fill it with pure blue.
- Add 256 more pixels to the right side of the canvas and paste what is now the left side.
- Select the text on the right side and brighten it.
- Increase canvas size by one pixel on all four sides and fill with pure blue.

---

In the end this makes an image 516x66. This doesn't agree with the power of two rules, so how can I follow this? Also is it correct that when you have the un-hover image on the left and hover image on the right and it will work work properly ingame?

The power of two rule can be ignored if in the .bitmap tag you change the type to 'interface bitmaps'. That tutorial does run by the power of two rule, the pure blue border isn't counted, so the dimensions of the box inside the blue border is looked at when compiling.

And yes, you have the unselected image on the left, and the selected one on the right.

Theres a tutorial on it? Can you give me a link to it? :)

Sure:
Zeph's Tutorial

What exactly is pure blue? The RGB values...

Quote:

---

Originally Posted by Gamerkd16

Sure:
Zeph's Tutorial

What exactly is pure blue? The RGB values...

---

Firstly, by working out numbers, I got.

514 x 65

(256 + 1) + 256 + 1 = 514

64 + 1 = 65 :)

Secondly, pure blue means go to the RGB layers, go to blue layer and fill the 1 pixel strip with pure with on this layer, then go back to RGB layer and it will be pure blue :)

You'd need to have 515x66 to split the two images in the middle, and to have a blue border around the whole bitmap (top, bottom, left and right).

Yea I realize my math mistake. Anyway I got it working correctly but now I get this error in tool:

### ERROR interface/linear bitmap cannot be DXT-compressed

lol, months later, Timo is helping me again...

Try changing the format to explicit alpha. If that doesn't work, use 32-bit colour.

Quote:

---

Originally Posted by Timo

Try changing the format to explicit alpha. If that doesn't work, use 32-bit colour.

---

Using 32 bit color gives me this error is compilation:

==> !!WARNING!! failed to open TIFF: unsupported bits per sample (32) or sample count (4) <==


EDIT:
Problem solved. I just used an 8-bit color in photoshop, then in the bitmap tag set the format as 32-bit color.

Ok, I got the buttons ingame, but I'm noticing that they are stretched in height and don't look like they do in Photoshop size-wise. Is there some option enabled somewhere that could be causing this deformation?

You need to change the bounds values, located here in the widget tag:
http://xs218.xs.to/xs218/07344/ijhkjhlkhkljh.gif
Change them to the width and height of one of the buttons in the bitmap
(so to the pixel height and width of your unselected bitmap, for instance)

Actually, those are switched. And this crops the image, it doesn't shrink it.

Ingame:
http://img524.imageshack.us/img524/3108/inagemig9.jpg

Photoshop Version:
http://img519.imageshack.us/img519/212/photfc4.jpg