Add scroll delta multiplier

[wrong7]

As of now, the amount scrolled is only dependant of the pixelSize of the Root, but it would be nice to have a property to modify this amount.

Example usage

<Root pixelSize={0.002}>
  <Container overflow="scroll" scrollMultiplier={10}>
    {/* Content */}
  </Container>
</Root>

would equal

<Root pixelSize={0.02}>
  <Container overflow="scroll">
    {/* Content */}
  </Container>
</Root>

[bbohlender]

Can you make a case where scrollMultiplier is needed? And how is this particular case solved in HTML. Should this parameter be also applied to scrolling by dragging?

[wrong7]

Basically I have multiple elements with the same pixelSize (0.02) which I find comfortable to work with in terms of size numbers, but then I have an scrollable element which is too slow when scrolling with this pixelSize, so I need to set the scrollable element to a pixelSize of 0.2 to make it look good when scrolling, and this breaks the scale of some shared components I use inside these elements.

I think it should not be applied to the scroll by dragging, only with wheel

[bbohlender]

I would argue that pixelSize should always be a number where scrolling feels good without any multiplier. Since UIs in 3D can be arbitrarily sized, the UIs sizing should adhere to some defaults so that components from different sources are similarly sized. Not being able to modify a scroll multiplier leads to more similarly sized components and, therefore, an ecosystem of interchangeable components, in my opinion.

[bbohlender]

Can be now achieved using

<Container overflow="scroll" onScroll={(newX, newY, scrollPosition) => {
  const [oldX, oldY] = scrollPosition.value
  scrollPosition.value = [oldX + (newX - oldX) * 10, oldY + (newY - oldY) * 10]
  //to cancel the default scroll
  return false
}} >
...
</Container>