Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android multiple issues: too many steps, disabling removes minimumTrackTintColor, extra space #634

Open
Chriko2502 opened this issue Sep 8, 2024 · 2 comments · May be fixed by #649
Open
Assignees
Labels
bug report Something isn't working platform: Android Issue related to Android platform

Comments

@Chriko2502
Copy link

Hi together,

I came across multiple issues when using the silder on different platforms. While it works great on iOS and web, I am encountering following issues on android only:

  1. too many steps
    There is one extra tick/step added to the right/maximum end of the slider without any value change ?!

  2. disabling removes minimumTrackTintColor
    When disabling the slider the minimumTrackTintColor is removed/ignored ?!

  3. extra space before and after the trackbar
    There is extra space before and after the trackbar added. But I managed to apply the following workaround:
    style={{marginHorizontal: (Platform.OS != 'android') ? 0 : -15}}

All issues can be reproduced/seen in:
https://snack.expo.dev/@chr1k0/slider-example

Any possibility to fix problem 1. and 2. or is there any known workaround?

Thanks in advance!

@Chriko2502 Chriko2502 added the bug report Something isn't working label Sep 8, 2024
@BartoszKlonowski
Copy link
Member

BartoszKlonowski commented Sep 9, 2024

Hello @Chriko2502, thanks for reaching out!
Let me address those concerns one by one:

  1. Too many steps
    Yes, this looks like a bug in how the values for the steps are calculated and compared. Thank you for noticing that!
  2. Disabling removes the minimumTrackTintColor
    This, unfortunately, is a default behavior of Slider and is not planned to be changed.
    This Slider package exposes the Slider and SeekBar of iOS and Android native implementation with all of their behaviors and system-specifics, including the design of disabled Slider.
  3. Extra space before and after the trackbar
    Yes, this is a known issue, tracked in Remove space before and after the slider bar #98

Workaround for the 1.
You asked for a solution or workaround for these, so for the 1. problem, before a fix is implemented, you can simply use values of integer, just like so:

      <Slider
        //style={{marginHorizontal: (Platform.OS != 'android') ? 0 : -15}} 
        disabled={false} //true
        minimumValue={80}
        maximumValue={120}
        step={5}
        value={100}
        onValueChange={(value) => {
          setFontSize(value/100)
        }}
        tapToSeek={true}
        thumbTintColor={'grey'}
        minimumTrackTintColor={'blue'}
        maximumTrackTintColor={'grey'}
      />

☝️ I checked this on the snack you sent, and using integers works as expected. The rest of the code is as you implemented.

@BartoszKlonowski BartoszKlonowski added the platform: Android Issue related to Android platform label Sep 9, 2024
@Chriko2502
Copy link
Author

Hi @BartoszKlonowski, thanks for your quick reply!

Regarding 1: Indeed changing from floats to integers solved the problem. Thanks for pointing out!

Regarding 2: Seems the default behaviour on iOS is the one, which I expected, the one from android seems not user friendly to me. Again thanks for clarification, I will create a workaround by disabling touch events on parent elements.

Regarding 3: yes saw the linked issue as well but since there was no update, just wanted to clarify if I might missed something.

My points are clarified and the issue can be closed. If you would like to keep it open to follow up on "Problem 1"....

Thanks!

@draggie draggie linked a pull request Sep 18, 2024 that will close this issue
@draggie draggie self-assigned this Sep 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug report Something isn't working platform: Android Issue related to Android platform
Projects
Status: In Progress
Development

Successfully merging a pull request may close this issue.

3 participants