Displaying large textures

Adding large textures such as backgrounds to the atlas isn't a good idea; you'll waste space on your atlas and won't gain performance since backgrounds aren't usually used very often.

A simple way to display large textures is to use the UITexture component.

The UITexture component

Let's use the UITexture component to display a background for our menu:

  1. Select our UI Root GameObject.
    • Hit Alt + Shift + N to create a new empty child GameObject.
  2. Select UI Root | GameObject., which is empty and new.
    • Rename it to Background.
  3. Click the Add Component button in the Inspector view.
  4. Type texture with your keyboard to search for components.
  5. Select NGUI Texture and hit Enter or click on it with your mouse.

We've attached the UITexture component to our Background GameObject. We can now review its parameters before we configure it.

Parameters

The newly added UITexture component has the following eight parameters:

  1. Texture: This is the texture file to display.
  2. Material: This is the material to use to render the texture.
  3. Shader: This is the shader to use for material rendering.
  4. UV Rect: UV coordinates for the textures: X and Y offsets, Width and Height cropping or tiling values, depending on the selected Type (6).
  5. Fixed Aspect: Check this to force the displayed texture to keep the source file's aspect ratio.
  6. Type: Just like the UISprite component, you can define if it's a Normal, Sliced, Tiled, Filled, or Advanced sprite.
  7. Flip: Display normally, flip horizontally, vertically, or both.
  8. Color Tint: The texture's color tint.
Parameters

Ok, we can now configure it to display a background for our UI.

Configuration

We'll configure the UITexture component to display a large texture as the UI background:

  1. Select our UI Root | Background GameObject.
  2. Drag Resources/Textures/Poly_Background in the Texture field.
  3. Leave its sprite Type to Simple.
  4. Change its widget Depth to -5.
  5. Set Size to 1920 x 1080.

Great. You should now have the polygon background image displayed as the background for our entire UI, as shown in the following screenshot:

Configuration

Ok, good! The menu looks good. Now, let's summarize what you've learned in this chapter.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.188.37.136