Creating Widgets | NGUI for Unity

Sprites

We have created our first sprite and understood how to move, rotate, and change its dimensions. We actually scaled it up massively compared to its original size. But this 15 x 15 sprite has something special.

If you select the Sprite (Dark) GameObject, you will see it has four dotted lines inside the Preview window in the Inspector view. This means it's a sliced sprite:

Sliced sprites

A sliced sprite is an image divided in nine sections, making it resizable while conserving its corners' proportions. Sliced sprites may be scaled as you wish—they still look beautiful.

Since Sprite (Dark) is a 9-slice sprite, we must tell our UISprite component to treat it as such. Perform the following steps to do so:

Select the Sprite (Dark) GameObject.
Click on the drop-down menu next to its Sprite Type field.
Select Sliced.

Notice how the sprite looks good now—it's not stretched anymore!

Note

The Fill Center parameter allows you to only show the sprite's borders and leave only transparency inside.

Even though...

Tech Concepts

Programming languages

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

NGUI for Unity

By : Charles Bernardoff (EURO)

NGUI for Unity

By: Charles Bernardoff (EURO)

Overview of this book

Sprites

Sliced sprites

Note

NGUI for Unity

By : Charles Bernardoff (EURO)

NGUI for Unity

By: Charles Bernardoff (EURO)

Overview of this book

Sprites

Sliced sprites

Note

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access