feat(android): add title support to Ti.UI.Switch slider style

Fixes TIMOB-28370
tidev · Jun 10, 2021 · 1c41606 · 1c41606
1 parent 2a32030
commit 1c41606
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 18 deletions.
diff --git a/android/modules/ui/src/java/ti/modules/titanium/ui/widget/TiUISwitch.java b/android/modules/ui/src/java/ti/modules/titanium/ui/widget/TiUISwitch.java
@@ -71,7 +71,7 @@ public void processProperties(KrollDict d)
 	protected void updateButton(CompoundButton cb, KrollDict d)
 	{
 		if (d.containsKey(TiC.PROPERTY_TITLE)) {
-			if ((cb instanceof MaterialCheckBox) || (cb instanceof Chip)) {
+			if ((cb instanceof MaterialCheckBox) || (cb instanceof Chip) || (cb instanceof SwitchMaterial)) {
 				cb.setText(TiConvert.toString(d, TiC.PROPERTY_TITLE));
 			}
 		}
@@ -120,7 +120,7 @@ public void propertyChanged(String key, Object oldValue, Object newValue, KrollP
 		if (key.equals(TiC.PROPERTY_STYLE) && newValue != null) {
 			setStyle(TiConvert.toInt(newValue));
 		} else if (key.equals(TiC.PROPERTY_TITLE)) {
-			if ((cb instanceof MaterialCheckBox) || (cb instanceof Chip)) {
+			if ((cb instanceof MaterialCheckBox) || (cb instanceof Chip) || (cb instanceof SwitchMaterial)) {
 				cb.setText(TiConvert.toString(newValue));
 			}
 		} else if (key.equals(TiC.PROPERTY_TITLE_OFF)) {

diff --git a/apidoc/Titanium/UI/Switch.yml b/apidoc/Titanium/UI/Switch.yml
@@ -57,7 +57,7 @@ properties:
     summary: Style of the switch.
     description: |
         For Titanium versions older than 10.0.0, this is an Android only property and must be assigned
-        a `SWITCH_STYLE_*` constant from the <Titanium.UI.Android> module.
+        a `SWITCH_STYLE_*` constant from the <Titanium.UI> module.
     type: Number
     constants: Titanium.UI.SWITCH_STYLE_*
     platforms: [android, iphone, ipad, macos]
@@ -68,25 +68,29 @@ properties:
     summary: |
         Horizontal text alignment of the switch title.
     description: |
-        On Android, when the switch [style](Titanium.UI.Switch.style) property is set to
-        <Titanium.UI.Android.SWITCH_STYLE_CHECKBOX>, this property is only effective if the
-        [width](Titanium.UI.Switch.width) property is set to a value greater than the width of the
-        [title](Titanium.UI.Switch.title) contents.
+        This property is only applicable when the switch [style](Titanium.UI.Switch.style) is set to
+        [SWITCH_STYLE_CHECKBOX](Titanium.UI.SWITCH_STYLE_CHECKBOX),
+        [SWITCH_STYLE_SLIDER](Titanium.UI.SWITCH_STYLE_SLIDER), or
+        [SWITCH_STYLE_TOGGLE_BUTTON](Titanium.UI.SWITCH_STYLE_TOGGLE_BUTTON),
+
+        This property is only effective if the [width](Titanium.UI.Switch.width) property is set to a
+        value greater than the width of the [title](Titanium.UI.Switch.title) contents.
     type: [String, Number]
     constants: Titanium.UI.TEXT_ALIGNMENT_*
     default: |
         <Titanium.UI.TEXT_ALIGNMENT_CENTER> (toggle button, Android),
+        <Titanium.UI.TEXT_ALIGNMENT_LEFT> (slider, Android),
         <Titanium.UI.TEXT_ALIGNMENT_LEFT> (checkbox, Android)
     platforms: [android]
 
   - name: title
-    summary: Text to display next to the switch, when the checkbox style is in use.
+    summary: Text to display next to the switch, when the checkbox or slider style is in use.
     description: |
-        This property is only effective when the <Titanium.UI.Switch.style> property is set to
-        <Titanium.UI.Android.SWITCH_STYLE_CHECKBOX>.
+        This property is only effective when the [style](Titanium.UI.Switch.style) property is set to
+        [SWITCH_STYLE_CHECKBOX](Titanium.UI.SWITCH_STYLE_CHECKBOX) or
+        [SWITCH_STYLE_SLIDER](Titanium.UI.SWITCH_STYLE_SLIDER).
 
-        Use the [textAlign](Titanium.UI.Switch.textAlign) property to align this text within the
-        switch.
+        Use the [textAlign](Titanium.UI.Switch.textAlign) property to align this text within the switch.
     type: String
     platforms: [android]
 
@@ -224,7 +228,7 @@ examples:
         });
 
         var basicSwitch = Ti.UI.createSwitch({
-          style: Ti.UI.Android.SWITCH_STYLE_TOGGLEBUTTON,
+          style: Ti.UI.SWITCH_STYLE_TOGGLE_BUTTON,
           titleOn:'Notifications Enabled',
           titleOff:'Notifications Disabled',
           value:true,
@@ -249,7 +253,7 @@ examples:
         });
 
         var basicSwitch = Ti.UI.createSwitch({
-          style: Ti.UI.Android.SWITCH_STYLE_CHECKBOX,
+          style: Ti.UI.SWITCH_STYLE_CHECKBOX,
           textAlign:Ti.UI.TEXT_ALIGNMENT_CENTER,
           title:'Notifications',
           value:true,

diff --git a/tests/Resources/ti.ui.switch.test.js b/tests/Resources/ti.ui.switch.test.js
@@ -33,16 +33,70 @@ describe('Titanium.UI.Switch', function () {
 
 		// Validate switch value
 		Ti.API.info('Switch value : ' + switch_ctrl.value);
-		should(switch_ctrl.value).be.be.true();
+		should(switch_ctrl.value).be.true();
 		switch_ctrl.value = false;
-		should(switch_ctrl.value).be.be.false();
+		should(switch_ctrl.value).be.false();
 	});
 
 	it('.value', function () {
 		const switch_ctrl = Ti.UI.createSwitch();
-		should(switch_ctrl.value).be.be.false();
+		should(switch_ctrl.value).be.false();
 		switch_ctrl.value = true;
-		should(switch_ctrl.value).be.be.true();
+		should(switch_ctrl.value).be.true();
 	});
 
+	describe.android('.style', () => {
+		it('checkbox', () => {
+			const switch_ctrl = Ti.UI.createSwitch({
+				style: Ti.UI.SWITCH_STYLE_CHECKBOX,
+				title: 'Foo',
+				value: true
+			});
+			should(switch_ctrl.title).eql('Foo');
+			switch_ctrl.title = 'Bar';
+			should(switch_ctrl.title).eql('Bar');
+			switch_ctrl.value = false;
+			should(switch_ctrl.value).be.false();
+		});
+
+		it('chip', () => {
+			const switch_ctrl = Ti.UI.createSwitch({
+				style: Ti.UI.SWITCH_STYLE_CHIP,
+				title: 'Foo',
+				value: true
+			});
+			should(switch_ctrl.title).eql('Foo');
+			switch_ctrl.title = 'Bar';
+			should(switch_ctrl.title).eql('Bar');
+			switch_ctrl.value = false;
+			should(switch_ctrl.value).be.false();
+		});
+
+		it('slider', () => {
+			const switch_ctrl = Ti.UI.createSwitch({
+				style: Ti.UI.SWITCH_STYLE_SLIDER,
+				title: 'Foo',
+				value: true
+			});
+			should(switch_ctrl.title).eql('Foo');
+			switch_ctrl.title = 'Bar';
+			should(switch_ctrl.title).eql('Bar');
+			switch_ctrl.value = false;
+			should(switch_ctrl.value).be.false();
+		});
+
+		it('toggle button', () => {
+			const switch_ctrl = Ti.UI.createSwitch({
+				style: Ti.UI.SWITCH_STYLE_TOGGLE_BUTTON,
+				titleOn: 'ON',
+				titleOff: 'OFF',
+				value: true
+			});
+			should(switch_ctrl.titleOn).eql('ON');
+			should(switch_ctrl.titleOff).eql('OFF');
+			should(switch_ctrl.value).be.true();
+			switch_ctrl.value = false;
+			should(switch_ctrl.value).be.false();
+		});
+	});
 });