How to call dat.GUI function to instead the default UI?

Questions
,
1

image

If I have a UI control like the image above, it is not friendly on mobile. Therefore, how can I call the related function on the other method? I want to create a slide button to call it.

Thanks

1 Like
2

My problem also.

3

Can you please explain this sentence in more detail? I’m not sure it’s clear what you are looking for.

4

I mean, I mean how can I do this style

5

In this case I would not use dat.gui at all and develop a custom UI. The idea of using something like dat.gui is to use it out-of-the-box without performing modifications.

1 Like
6

It’s possible to apply styles to its elements though: Styling Dat.GUI (Layer Example).
But I perfectly agree with @Mugen87

1 Like
7

Such as:

	gui.add( params, 'maxScale', 1, 30 ).name( 'Decal Size' ).onChange( updateDecalSize );

image

image
image922×83 49.9 KB

It is friendly on PC to use mousemove(slide) to change the size. However, it is not friendly on Mobile. Mobile cannot use mousemove(slide), only can be changed by click.

8

By using CSS is just change the UI style. What I want to do is for mobile-friendly usage.