4.6 UI ScrollBar force handle size to be fixed

Using the new UI with a ScrollBar is there a way to respect the aspect ratio / size of the handle?

If I use an image that I want to stay the same size, or at least scale with the UI on resolution change, but not shrink and grow to fill the slider area if the content of the scroll panel changes.

What I’m trying to do is use an image for the handle but that image doesn’t scale well, quite happy for the button to have to travel the full length of the bar just to move the content slightly if that happens.

Even happy to have a wrapper script that uses a transparent ScrollBar and sends the value to it based on a value 0 to 1 depending on the size of a panel it sits on and the hadles position. Which is what I’m going to script if I can’t find a better solution.

Hi,

I have a super small solution:

Put the Scroll bar object in ScrollRect OnValueChanged event and then select there Scrollbar.size and set the atribute to 0:

39706-screenshot-2015-01-28-184826.png

Then you still need to set the scrollbar.size to 0 at the start of your game. I did a small script for that:

public class FakeScrollBar : MonoBehaviour {
    void Awake() {
        transform.GetComponent<Scrollbar>().size = 0;
    }
}

The answer is that you shouldn’t be using a scrollbar. As far as Unity is concerned, that scaling is by definition part of Scrollbar behavior.

What you want is to use their Slider widget instead.

http://docs.unity3d.com/Manual/script-Slider.html

replace base class of sroll rect

using UnityEngine.UI;

public class ScrollRect_fix : ScrollRect {
	
	override protected void LateUpdate() {

		base.LateUpdate();

		if (this.horizontalScrollbar) {

			this.horizontalScrollbar.size=0;
		}
	}
	
	override public void Rebuild(CanvasUpdate executing) {

		base.Rebuild(executing);

		if (this.horizontalScrollbar) {

			this.horizontalScrollbar.size=0;
		}
	}
}

In Scroll Rect (Script) Component

Set Movement Type = Clamped

On Value Changed (Single) add new, Drag Scrollbar (Script), Set Scrollbar\float size, set value = 0

OK got it sorted but it’s messy.

Left a real scrollbar with a CanvasGroup on it and set Alpha to 0, untick Interactable and Blocksraycast and tick Ignore Parent Group.

Set the Scroll Rect script to use this ScrollBar.

Then put a Slider on the scene and fill in with whatever images you want to use. This is visible but I put a CanvasGroup on it so I can vanish it if the ScrollBar.size < 0.99f.

Then added this script onto it:

using UnityEngine;
using UnityEngine.UI;
using System.Collections;

public class FakeScrollBar : MonoBehaviour {

	public Scrollbar RealScrollBar;

	public void PassThrough(float scrollValue)
	{
		//Debug.Log (scrollValue);
		RealScrollBar.value = scrollValue;
	}
}

Dragged the script onto the Slider and drag the invisible ScrollBar onto the public ScrollBar slot in the script.

Click + in the Sliders OnValueChanged and drag the Slider with the script onto the new slot that appears. From the dropdown select FakeScrollBar → PassThrough.

It works but still interested if anyone has a better idea.

EDIT

What a massive idiot, RTFM @Mmmpies RTFM!

OK delete the hidden ScrollBar and change the the script to this:

using UnityEngine;
using UnityEngine.UI;
using System.Collections;

public class FakeScrollBar : MonoBehaviour {
	
	public ScrollRect MyScrollRect;

	public void PassThrough(float scrollValue)
	{
		MyScrollRect.verticalNormalizedPosition = scrollValue;
	}
}

if working in the horizontal change the verticalNormaizedPosition to horizontalNormalizedPosition and a Slider now works as a ScrollBar, just drag the ScrollRect onto the public slot in the script.

Ah the benefits of a nights sleep and a really nice cup of tea.

using UnityEngine;
using UnityEngine.UI;

public class UIScrollbarHandleSize : MonoBehaviour
{
public Scrollbar scrollbar;
public float size = 0.2f;

public void OnValueChangeSize()
{
    scrollbar.size = size;
}

private void LateUpdate()
{
    enabled = false;
    OnValueChangeSize();
}

}

on my case tkoknordic (current best answer) worked without the need of any script, I did set up a size on the scroll rect as he suggests (0.25 on my situation, not 0) and it now keeps the same size, always