Titanium

[TIMOB-1727] button backgroundColor does not work

GitHub Issuen/a
TypeBug
PriorityLow
StatusClosed
ResolutionInvalid
Resolution Date2011-04-15T03:00:42.000+0000
Affected Version/sn/a
Fix Version/sRelease 1.7.0, Sprint 2011-14
ComponentsiOS
Labelsbackgroundcolor, button, ios, klist, release-1.7.0
ReporterRobby
AssigneeBlain Hamon
Created2011-04-15T03:00:39.000+0000
Updated2017-03-28T20:53:22.000+0000

Description

This has been a thorn in the side for many (myself included) for awhile: See http://developer.appcelerator.com/questions/search/button%20backgroundcolor"> http://developer.appcelerator.com/questions/search/button%20backgro...

Here's a testcase to reproduce. It doesn't work both if the button is on the navBar and if it is just in the window. In the window..the color is set on the edges around the button (which is not what 99.9% of people want I'd think :)

var win = Ti.UI.currentWindow;

var btn1 = Titanium.UI.createButton({
    title:"Test",
    backgroundColor:'#0d8d00',
    width:70,
});
win.rightNavButton = btn1;

var btn2 = Titanium.UI.createButton({
    title:"Test",
    backgroundColor:'#0d8d00',
    width:70,
    height:120
});
win.add(btn2);

Blain: I'm not sure of the ticket triage procedure at Appcelerator, so I assigned it to you as it is an iphone related bug. If this isn't right, sorry about that. (I just didn't want it to langish around.)

Attachments

FileDateSize
screen-shot-2011-04-04-at-1110.png2011-04-15T03:00:39.000+0000122328

Comments

  1. Robby 2011-04-15

    Oh, one more thing. This was tested with 1.4.0, and with the 9/2/2010 nightly.

  2. Robby 2011-04-15

    And setting backgroundImage: 'none' fixed the main window button, but not the navbar button. In any case, it's a hack. :)

  3. Stephen Tramer 2011-04-15

    Ticket is still valid. Test in bugtests.

  4. Brian 2011-04-15

    Seriously. How has this not been fixed yet? It still doesn't work in 1.6 or the latest nightly 1.6.1

  5. Norm 2011-04-15

    Bump for this also - rather silly this doesn't just "work" - rather core to the way buttons behave.

  6. Blain Hamon 2011-04-15

    Trying to clarify here: do you mean a rounded rectangle button, and how background color defines the corners behind the rounded rectangle, and not the rectangle itself? If so, that actually is Apple's design. Included (And hopefully Lighthouse will actually keep it) is an example outside of Titanium, in Apple's own Interface Builder.

    In order to have a custom look to a button, you'll have to use a background image. Take a look at the button example in Kitchen Sink, namely the section that goes Titanium.UI.createButton({backgroundImage:'../images/BUTT_grn_off.png', backgroundSelectedImage:'../images/BUTT_grn_on.png', backgroundDisabledImage: '../images/BUTT_drk_off.png'}) .

    With regards to the nav bar, the class behind that (when no custom background image is used) is UIBarButtonItem. As per http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UIBarButtonItem_Class/Reference/Reference.html%23//apple_ref/doc/uid/TP40007519"> http://developer.apple.com/library/ios/#documentation/UIKit/Referen... , there's only three styles for a barButtonItem:

    Plain: In the nav bar, this is treated as bordered.
    Bordered: The background color is determined by the tint of the navbar containing it. This is not editable.
    Done: The background color is blue, like a Done button. This color is not editable.

    Again, for a custom button style, use a backgroundImage.

  7. Reggie Seagraves 2011-04-15

    Marking as invalid. Blain has explained how to the client can implement custom button UI.

  8. dit k 2011-12-06 setting Image, color etc.. is very buggy and still not fixed :(
  9. Lee Morris 2017-03-28 Closing ticket as invalid.

JSON Source