question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Switch component. thumbColor and trackColor do not work.

See original GitHub issue

🐛 Bug Report

Switch component. New options thumbColor and trackColor do not work.

To Reproduce

According to documentation I use trackColor and thumbColor

            <Switch
              value={true}
              trackColor={'green'}
              thumbColor={'gray'}
            />

This removes warnings but does nothing with colors.

Okay, when I put deprecated option onTintColor and thumbTintColor back:

            <Switch
              value={true}
              onTintColor={'green'}
              thumbTintColor={'gray'}
            />

there are warnings, but colors are changed.

Expected Behavior

I expect code works well according to the docs: https://facebook.github.io/react-native/docs/switch#thumbcolor

Code Example

            <Switch
              value={true}
              trackColor={'green'}
              thumbColor={'gray'}
            />

Environment

React Native Environment Info: System: OS: macOS 10.14.3 CPU: (8) x64 Intel® Core™ i7-3615QM CPU @ 2.30GHz Memory: 2.66 GB / 12.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 11.2.0 - /usr/local/bin/node Yarn: 1.12.3 - /usr/local/bin/yarn npm: 6.4.1 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3 Android SDK: API Levels: 23, 25, 26, 27, 28 Build Tools: 23.0.1, 23.0.2, 25.0.2, 25.0.3, 26.0.2, 26.0.3, 27.0.0, 27.0.1, 27.0.3, 28.0.0, 28.0.2, 28.0.3 System Images: android-28 | Google APIs Intel x86 Atom IDEs: Android Studio: 3.2 AI-181.5540.7.32.5056338 Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild npmPackages: react: 16.6.3 => 16.6.3 react-native: 0.57.8 => 0.57.8 npmGlobalPackages: react-native-cli: 2.0.1

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

github_iconTop Results From Across the Web

Change color of Switch while turning OFF react-native
It's wild that Switch allows independent on/off colors for the trackColor , but not for the thumbColor , even though the thumb will...
Read more >
Switch - React Native
Switch. Renders a boolean input. This is a controlled component that requires an onValueChange callback that updates the value prop in order ...
Read more >
Switch | NativeBase
NativeBase 3.0 lets you build consistently across android, iOS & web. It is inspired by the Styled System and is accessible, highly themeable, ......
Read more >
Switch - Themeable components for React & React Native
State of the switch. Can be any color in the palette. switchProps { thumbColor?: ColorValue; trackColor?: { false: ColorValue; true: ColorValue }; disabled?:...
Read more >
Switch Row - the Draftbit Docs!
To alter the name of the component. The name is reflected in the Layout tree. Defaults to Switch Row. Inactive Track Color, Set...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found