NGUI 3.5 Tutorials (iv) Atlas and Sprite (make Picture button)

Tribute to the original http://blog.csdn.net/chenggong2dm/article/details/25594059

Atlas is a collection of Ngui. My understanding is that Atlas combines some of your scattered images into a single picture. The advantage of this is that draw call can be lowered. I do not understand its underlying operating mechanism, I guess it should also travel dxt such as texture compression, so, it is best to set the size of the Atlas, also made of 128, 256,512,1024 and the like size, to facilitate its compression format.

Concept:

Atlas: a collection of images. Give the artwork to you, and use the NGUI Atlas Maker tool to synthesize a picture (and, to be exact, create a prefab, mat).

Sprite: elf. Since Atlas has already synthesized one of your images, how do you call them separately? is to use a sprite.

1. Prepare the material

Create a new folder named Uitexture. In the project panel, right---"Create" and "Folder", and then name.

Copy the following two images (Start.png and pause.png) to the Uitexture folder. Note that both of these small plots are 128*128 pixels.

2, create Atlas

In the project panel, go to the Uitexture folder, select the two pictures, then right-click "NGUI" and "Atlas Maker" and you will see the interface of Atlas Maker:

In the Atlas Maker interface, click the "Create" button.

Then call this Atlas Myatlas.prefab and click "Save".

* *, preview Atlas and Sprite

Once saved, the new atlas is created. You can click on "View Sprites" to preview the created sprite.

Take a look at this new atlas, and you can see that it's automatically turned into a 256*512 figure (you know, every little picture we have is 128*128). In this way, it has a lot of blank space. My understanding of this is:

The length-to-width ratio of Atlas is measured in exponential power of 2, such as 128 256 1024 2048. The purpose of doing this should be to use some kind of texture compression format instead of casting.

4, use Atlas and Sprite to make a picture button

Next, let's continue with the example of the Button in the previous article. First, delete the Label of the simple button.

Then, in the View panel, in the UI Script component, click the "Atlas" option:

In the pop-up select an Atlas panel, click "Show all" to see all of the projects in Atlas and select the Myatlas we just created. Such as:

In the View panel, in the UI Script component, click the Sprite option:

In the Select a sprite panel that pops up, select the Start icon (that is, the sprite).

When checked, if you look in the game view, we'll see that the button has become a picture button, but it's badly deformed. So, we're going to set it according to the original size of the picture: Find the Dimensions option and click the "Snap" button that follows. or manually adjust the values.

OK, in the game view, you can see the picture button, as we expected!

NGUI 3.5 Tutorials (iv) Atlas and Sprite (make Picture button)