appceleratorappcelerator-titaniumtitanium-androidappcelerator-android

Titanium - Android button "native" behavior upon styling

I've created 2 buttons:

<Button title="TEST"></Button>
<Button title="TEST" backgroundColor="red"></Button>

The first is a really simple default button. And the second I just added a red background color. The result is this:

enter image description here

As you can see from the picture, just adding a different background color changes the button a lot from it's "native" appearance. What I would expect is that the button will remain the same, just with a red background.

  1. The "styled" button is bigger (and as you can see I did not set up any dimensions).
  2. The "styled" button corners are no longer round.
  3. Most bothering - the "styled" button no longer has the android button ripple effect upon clicking.

Why is that? Can it be fixed?

Solution

  • The native button (AppCompatButton) is a bit more complex and is not using the backgroundColor to show the actual color. I think it is using a 9-patch in the background so if you set a backgroundColor it will remove that and you end up with the box and the color.

    Try using the tintColor to change the background color or you can fake it using: