Bug [SOLVED] ScrollView does not render well out of the box

When you add a scroll view using defaults you get the following:

Code (CSharp):

1.  
2. .thumbnails {
3.     flex-grow: 1;
4.     flex-direction: row;
5.     flex-wrap: wrap;
6. }

Code (CSharp):

1.   <engine:ScrollView name="ScrollView">
2.     <engine:VisualElement name="Thumbnails" class="thumbnails">
3.       <engine:Box style="width:128; height: 128" />
4.       <engine:Box style="width:128; height: 128" />
5.       <engine:Box style="width:128; height: 128" />
6.       <engine:Box style="width:128; height: 128" />
7.       <engine:Box style="width:128; height: 128" />
8.       <engine:Box style="width:128; height: 128" />
9.       <engine:Box style="width:128; height: 128" />
10.     </engine:VisualElement>
11.   </engine:ScrollView>

It's only when you hack it with the following that you finally get something correct:

Code (CSharp):

1.             var view = tree.Q<ScrollView>("ScrollView");
2.             var scroller = view.verticalScroller;
3.             var scrollerSlider = scroller.slider;
4.             scrollerSlider.style.width = 15;
5.             scrollerSlider[0][1].style.left = -5;

Somehow the initial width is 70 which is definitely the problem.

Now while it looks correct there's a huge problem, if you don't leave your mouse precisely within the slider it stops scrolling; I guess this value of 70 is intentional for good UX but somehow it's not working out of the box.

Are you aware of the problem ?

 

Here's another approach that really fixes the problem, now you don't have to be precisely inside the scroller to scroll .

Code (CSharp):

1.             var view = tree.Q<ScrollView>("ScrollView");
2.             view.style.marginRight = -55;
3.             view.verticalScroller.slider.style.paddingLeft = 0;
4.             view.verticalScroller.slider.style.unitySliceLeft = 14;

 

Using 2019.1.0b1 and non experimental controls, going to report it but actually I'm having really weird issues and trying to find the cause, even the simplest example exhibits that behavior:



Note, it was working fine then suddenly the slider changed to this .

 

Well ... going to update ASAP ... in the mean time I've fixed it, something really dumb from me, I was overriding Slider style directly in the USS, lesson learned .

 

I was already going to blame Unity !