SliderBase is not using padding based on pixel ratio

REPRODUCIBILITY: 100%
OS VERSION: 5.0.0.x and previous
HARDWARE: any
UI LANGUAGE: any
REGRESSION: no

DESCRIPTION:

SliderBase is using following values as a value for left and right padding

    property real leftMargin: Math.round(Screen.width/8)
    property real rightMargin: Math.round(Screen.width/8)

If alarm is not going off in your head right now you’re either not a developer or… anyway. This does not relay on any pixel ratio value like Theme.paddingLarge, meaning, on device like a tablet its absolutely freaking massive, its kilometers long.

PRECONDITIONS:

Use Slider in app

STEPS TO REPRODUCE:

Slider {}

EXPECTED RESULT:

It should use value based on value thats using pixel ratio like Theme.paddingLarge or Theme.horizontalPageMargin which scale according to pixel ratio

ACTUAL RESULT:

It doesn’t, its massive

MODIFICATIONS:

ADDITIONAL INFORMATION:

I would make a PR but its part of private API so I’m yelling in frustration here. FIX IT. Or I’ll fix it myself by getting rid of silica.

Also in case you even dare to think “ah its just magister with his imaginary issue”. Same app. Tablet vs phone


Now imagine just for a second, imagine we used thing that actually scales with pixel ratio like Theme.paddingLarge*3


Wow! They both look good now! How could it be! Magic!

3 Likes

Offtopic: Yay for StezStix Fix!!, stupid Slider!

2 Likes

So I guess you’re talking about the vertical slider on top right corner? Suppose that’s the Slider with some rotation?

Anyhow, I think the biggest problem with Slider is maybe lack of documentation for leftMargin and rightMargin. Should be up to the app developer to set if the defaults are not good. One size will not fit all.

Also the defaults here would be also dangerous to adjust as that would affect all the places where a Slider is used. Commonly it’s probably quite fine already.

1 Like

% of the screen pixels should never be used. Pixel ratio should ALWAYS be used. So i quite disagree that its fine, it’s not fine.

1 Like

You may disagree but I’m not changing the default now. And even if that was changed, a pixel ratio based value would be still something big by default, somewhere around what it’s effectively now, so your application case would be just as broken.

So just set the leftMargin and rightMargin to something that fits your case better. It’s two lines of code.

I’ll anyhow add some more documentation here.

1 Like

No it would not, as I’ve shown in examples. I used big padding and it looks right on both devices.

You can even see that the padding looks exactly the same.

You fundamentally don’t understand how pixel ratio works and why is it important to use it in ui elements.

You should change it to Theme.paddingLarge*3 it will look exactly the same and it will look proper.

1 Like

I don’t have any technical knowledge to share with this topic, but wouldn’t it make sense to check if @Mister_Magister is right? As he demonstrated in his report, with his suggestion problem should be fixed. If we can get from mostly ok, to very good with low effort, sounds like low hanging fruit where everyone wins. Devs have one less thing to worry about, users get nicer user experience and Jolla gets point for fixing known problem :slight_smile:

1 Like

If Silica is not going to be changed to your liking how about you make your own custom slider component and submit it to Opal?

That way others could reuse it as well and ‘everybody wins’. Kinda.

1 Like

not really, no point making opal component just to change two properties and system and 99% of apps will still be incorrect on every single tablet in existance