ScrollContainer HTML5 incostistency

pozirk

Hey Josh.
I'm trying to use ScrollContainer to scroll things horizontally but the same HTML5 app works differently in desktop and mobile browsers.
While on mobile everything works as expected, I can drag left/right, on desktop dragging is not working at all, mouse wheel scrolls only vertically an the only way to scroll content is to drag scrollbar.
My code looks something like this:

content.fixedScrollBars = false;
content.autoHideScrollBars = true;
content.scrollPolicyY = ScrollPolicy.OFF;
content.width = [WIDTH];
content.height = [HEIGHT];
content.scrollRect = new Rectangle(0, 0, [WIDTH], [HEIGHT]);

How can I make content to drag with the mouse horizontally on desktop?
How to scroll horizontally with mousewheel?
Are there anything I'm missing?

I'm using OpenFL and Feathers UI 1,0,0-beta,4.
Thank you!

joshtynjala

Feathers UI tries to behave like native desktop apps when running on desktop, so by default, you can't use your mouse to drag and scroll a container. In other words, dragging to scroll only works with touches specifically. However, the simulateTouch property of a Scroller may be used to make it treat the mouse like a touch point.

To change the direction that the mouse wheel scrolls, use the mouseWheelYScrollsX property of the Scroller.

container.scrollerFactory = () -> {
	var scroller = new Scroller();
	scroller.simulateTouch = true;
	scroller.mouseWheelYScrollsX = true;
	return scroller;
};

pozirk

Wow, thank you, that did the trick!