Scrollbar Foreground image scaling

[itszander]

Hi all,
I'm having a very strange problem. I'm using a custom foreground png for the scrollbar widget. When I play the game with the scrollbar on, the size of the foreground png scales to 14x120 px.

When I stop the game I can manually resize the scrollbar foreground to its correct size (42x42 px) but then it jumps back to 14x120 on play.

thoughts?

-zander

[itszander]

Just found a great workaround for this!

1. make a scrollbar. Make the width of the background the size of the foreground sprite. 
2. adjust the size of the sprite in the UIScrollbar script. This will make the foreground sprite look the way it's supposed to.
3. make a copy of the background as JUST a sprite, outside the hierarchy and place this in the correct location.
4. move the scrollbar to the correct location and turn off the background in the inspector.

tada!

-Z

[Nicki]

Scrollbar foreground is supposed to scale to fit the content of your drag panel. This is intended behavior. Look at the example, I think you're looking for the "thumb" object, not foreground.

[itszander]

Hi Nicky,
thanks for the response.

I've attached a screenshot of the issue. I sort of fixed it but then when I hooked it up into the GUI the problems still exist.

Is there a way to make the image square? Am I missing something in terms of implementation?

-zander

[itszander]

update: I just looked at the nGUI example 6 (scroll view) which has a scroll bar in it, but didn't see a "thumb" component, game object, etc.

I do see foreground and background for the scroll bar tho.

[Nicki]

Ah ok, I remembered it wrong.

I think you're thinking of scrollbars like a windows user, not an iOS user.

Foreground is not supposed to be click/draggable. It resizes to the size of the content in your dragpanel, while background is the full size of the content.

On UI Slider (the script on the progress bar you can insert with the widget tool) there's a reference to a transform that's "Thumb". This is what you need to use. You insert a new Sprite under the progress bar as a child of that game object, and you drag the gameobject to thumb. Now you can drag the thumb around and it will move your content.


It can also be set in code if you prefer. This won't change size and always stays like you want it to.

Does that make sense?

[Phong]

I looked at the code for UI scrollbar and noticed that the foreground is scaled to fit inside the "center" slice of the background sliced sprite. So if your scrollbar is vertical and it is a sliced sprite with borders specified for the left and right. The foreground image will be squashed horizontally to fit in the center slice. One solution is to set the left and right borders to zero for the background for a vertical scrollbar and set the top and bottom borders to zero for the background for a horizontal scrollbar.

[jeldrez]

There's no way Draggable Panel supports UISliders? I want to use a thumb for moving the panel.

[agentsmith666]

I'm running into this issue as well.  I have a scrollbar that scrolls a dynamic list of item names and want to use a fixed size scroll bar.  I notice there's no option to do this through UIScrollbar (like a check box or something...).  Any other ideas besides having a script override the foreground/thumb size?

Update:

I added a bool to UIDraggablePanel.cs called isScrollbarFixedSize defaulted to false.  Then I added the checks where UIDraggablePanel.cs adjusts the size of the scrollbar's foreground/thumb.  It seems to be working well.  UIScrollBar's inspector's slider bars still work and can be used to set the size of the foreground/thumb like normal.

1. ...
2. if ( !isScrollbarFixedSize )
3.                                     horizontalScrollBar.barSize = 1f - sum;
4. ...
5. ...
6. ...
7. if ( !isScrollbarFixedSize )
8.                                     verticalScrollBar.barSize = 1f - sum;
9.  

[Fireball14]

Thx a LOT! This is really what i need! I wish this was standard feature of NGUI!