Change button image when Toggle Switch selection changes?

filharvey

Does anyone know of a way to change the button image when the state of the toggle switch moves from on to off? I can't see a way of doing it? only changing the text when on or off.

Thanks

Phil

huise4

extends theme and then do this：
toggleSwitch.customOnTrackName = "customOnName";
toggle.customOffTrackName = "customOffName"；

joshtynjala

You may have one or two tracks. If you have only one track, it's always the onTrack. If you have two tracks, one appears on each side of the thumb. There's no way to show one track at a time and switch based on the state.

maivankhanh

Hi Josh, I know you're working on 2.0 now.
But I found a bug (yes, pretty sure it's a bug) with version 1.3, it makes me annoyed.

When I set the value of trackLayoutMode is ToggleSwitch.TRACK_LAYOUT_MODE_ON_OFF, the toggle switch also have ONLY on track (!?), and it not have off track.

My code:

togglebtn = new ToggleSwitch();
				togglebtn.trackLayoutMode = ToggleSwitch.TRACK_LAYOUT_MODE_ON_OFF;

				togglebtn.customOnTrackName = "customOnTrackName";
				togglebtn.customOffTrackName = "customOffTrackName";

My extended theme:

this.setInitializerForClass(Button, customOnTrackName, "customOnTrackName");
			this.setInitializerForClass(Button, customOffTrackName, "customOffTrackName");

Would you please check about this issue?

And I have one more question, can I also change the thumb skin based on the state ON or OFF?

joshtynjala

It seems to be working correctly in Feathers 2.0, which will be released very soon. I don't recall any issues in 1.3.

However, you mentioned that you're extending a theme. This code may have an issue in that situation:

togglebtn = new ToggleSwitch();
togglebtn.trackLayoutMode = ToggleSwitch.TRACK_LAYOUT_MODE_ON_OFF;

It's quite possible that the original theme is setting trackLayoutMode too, which will override the value that you have set here.

I recommend an initializer for ToggleSwitch:

togglebtn = new ToggleSwitch();
togglebtn.nameList.add("customToggleSwitchName");

this.setInitializerForClass(ToggleSwitch, customToggleSwitchName, "customToggleSwitchName");

joshtynjala

And I have one more question, can I also change the thumb skin based on the state ON or OFF?

Feathers 2.0 adds a toggleThumbSelection property to ToggleSwitch. If the thumb is a ToggleButton, its isSelected property will be changed to match the ToggleSwitch's isSelected property. Then, you can skin the ToggleButton using properties like defaultSelectedSkin.

ToggleButton is a new class in Feathers 2.0. Basically, I took all of the toggle functionality out of Button to make it lighter, and I moved it into a separate subclass.

pol2095

@joshtynjala, it's possible to change the thumb texture on or off (toggleThumbSelection) but it's possible to change the track texture (toggleTrackSelection) ? thanks

joshtynjala

pol2095 No, there isn't anything like that in the Feathers ToggleSwitch.

pol2095

Thanks, I will use TrackLayoutMode.SPLIT