Ability to apply background color for UI Switch in "off" state in IOS

[NickIliev]

@M-kothakapu commented on Sat Mar 30 2019

Environment

• NativeScript-Angular

Describe the bug
I'm working on Nativescript Switch component. I found an issue while applying background colors when the switch state is ON/OFF (i.e, checked or unchecked).
Based on checked property, The background color of Switch should change.

Expected behavior

  Background Color should change when checked property is false (off state).

Current behavior

 Background color is not applied to OFF state (unchecked) behavior of Switch.  

Sample project
https://play.nativescript.org/?template=play-ng&id=8DLLBY&v=14�

[NickIliev]

@M-kothakapu
In your code you trying to access the checked property via

(checkedChange)="switchChanged(sw.checked)"

However, you are not declaring the sw anywhere. To resolve simply add the id to the switch element

<Switch #sw checked="false" (checkedChange)="switchChanged(sw.checked)"></Switch>

Here is a Playground demo showing the above.

[M-kothakapu]

@Nicklliev thank you for updating the id to the switch element. However, I verified this output. I’m posting a .gif file please verify. Somehow the issue is not resolved. Please observe the following steps:

1. When the switch is turned on it changes to yellow color. Works fine.
2. When the switch is turned off it changes to white background color as set by the IOS. But this should change to gray color instead which I’m exactly looking for.
3. When you try to slowly hard press the thumb/knob of the switch you will observe the background changes to gray color and disappears. This is the issue I wanted to mention.

End result to achieve: on state = turns yellow color.
Off state = turns gray color.

[M-kothakapu]

[NickIliev]

@M-kothakapu I see what you mean - indeed this looks like a bug in applying the background-color (different color work as expected). Reopening the issue and marking this one as a bug.

[NickIliev]

Reproducible in NativeScript Core as well - using this playground app for testing the issue (working as expected on Android)