Join Jesse Freeman for an in-depth discussion in this video Styling sliders, part of Unity 5: UI.
- Let's take a look at how we can restyle our slider…and make it look like a health bar.…The first thing we're going to do…is select our slider's Background.…Let's change the color to red.…Next, we're going to change the Source Image…to "none."…And now, let's change the Anchor Preset…by holding down Option on the Mac…or Alt on the PC to fill its entire parent.…Next, let's select the Fill Area's Fill.…
In here, we're going to change the color to green.…We'll also remove its Source Image and set this to "none."…Next, let's remove the padding from the Left…and the Right, by setting these to zero…and also in the Fill Area…by setting the Left to zero and the Right to zero.…Then, we'll also want to change the Anchor Position…and have it fill its parent, too.…
Next, we're going to delete the entire Handle Slide Area.…With this deleted, it already looks like a regular…health bar.…The slider is smart enough to know…that there is no handle.…So if we look at the Slider and we scroll down,…we'll see that the Handle Rect is missing…
- Adding new components to the Canvas
- Working with RectTransforms
- Nesting UI elements
- Adding rich text and effects to the UI
- Creating images
- Styling UI buttons
- Handling input
- Creating sliders
- Controlling the layout of the screen
- Adding toggles and dropdowns
Skill Level Intermediate
1. The Canvas
2. Working with the RectTransform
3. Working with Text
4. Working with Images
5. Working with Buttons
6. Handling UI Input
7. Working with a Slider
8. Controlling Layout
9. Toggles, Dropdowns, and the Input Field
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.