Titanium JIRA Archive
Appcelerator Community (AC)

[AC-1578] iOS: Button border will not toggled

GitHub Issuen/a
TypeBug
Priorityn/a
StatusClosed
ResolutionNeeds more info
Resolution Date2015-08-12T06:59:45.000+0000
Affected Version/sn/a
Fix Version/sn/a
Componentsn/a
Labelsn/a
ReporterEthan Chen
AssigneeAmimul Hossain
Created2015-06-29T02:44:41.000+0000
Updated2016-03-08T07:38:02.000+0000

Description

I want to toggle two different style of Button in between normal status or selected status with color, borderColor and backgroundColor, but I got a problem in switching borderColor on iOS, please check it out: TSS:
".normal": {
    color: '#FFFFFF',
    borderColor: '#8BD8D2',
    backgroundColor: '#000000'
}

".selected": {
    color: '#37A9AA',
    borderColor: '#FFFFFF',
    backgroundColor: '#FFFFFF'
}

JS:
if (selected) {
    $.resetClass(view, 'normal');
} else {
    $.resetClass(view, 'selected');
}
On iOS, changing the color and backgroundColor works fine but borderColor seems disappear. On Android, everything works fine.

Comments

  1. Amimul Hossain 2015-06-30

    Hello [~ethancfchen], The code you provided above has errors. For both "backgroundColor" and "borderColor" the value is same. So the color will be same in selected condition. Change the "borderColor" value to a different one in selected condition.

    SAMPLE

       var self = Ti.UI.createWindow();
       
       var button = Titanium.UI.createButton({
       	title : 'Hello',
       	top : 100,
       	width : 400,
       	height : 200,
       	borderRadius: 40,
       	borderWidth : 10,
       	color : '#34847D',
       	borderColor : '#8D5F4B',
       	backgroundColor : '#818D4B'
       });
       
       button.addEventListener('click', function(e) {
       	button.color= '#000000';
           button.borderColor = '#D74E13';
           button.backgroundColor= '#FFFFFF';
       
       });
       self.add(button);
       self.open();
       
    Thanks.
  2. Ethan Chen 2015-06-30

    I think it's not the problem, and I found it. If I set borderWidth to '2dp', the border will display on both styles.
  3. Ethan Chen 2015-07-02

    Any update here?
  4. Amimul Hossain 2015-07-11

    Hello, [~ethancfchen], Did you followed my instruction? I have checked with "borderWidth" to '2dp', It's the same result. If you are still facing the problem please follow my previous response. Provide "backgroundColor" and "borderColor" different value in selected condition. Also provide screenshots of the problem you view. Thanks.

JSON Source