Change Android button background method

[bradmartin]

Change the button background styling from

      setBackground()

to

     setBackgroundTintList()


       btn.setBackgroundTintList(android.content.res.ColorStateList.valueOf(tColor.android));

I've done this programatically by creating a new android.widget.Button() and found no issues.

If this is possible without collision in other areas it would give the buttons their material design ripple effect, whereas setBackground removes the ripple effect. Will this open other issues. I didn't want to make a PR without knowing if there would be other issues or conflicts.

[x4080]

Good idea

[vakrilov]

Nice one @bradmartin - it is good to be able to change the color of the button without loosing the material design.

[enchev]

We can use simply:

var nativeColor = v.style._getValue(style.backgroundColorProperty).android;
nativeView.getBackground().setColorFilter(nativeColor, android.graphics.PorterDuff.Mode.SRC_IN);

if only backgroundColor is set. In this way we can preserve other styles.

[talvasconcelos]

Hi @enchev i'm sorry, how do i implement that code you showed. I have this issue where the button background-color is used as a tint, or has transparency... i want to remove that.

i pasted that snippet in my app.js and it fails to compile saying "v" is not defined... i missed a require somewhere.

[spstratis]

@enchev I have the same question as @talvasconcelos, what is the "v" object referencing here?

[bradmartin]

Think it's the view instance so the button. Not at computer to check the NativeScript view api but i think that's it

[spstratis]

@bradmartin Got it, that would make sense.

[spstratis]

In one of my views where I'm experiencing this problem I've tried the following:

exports.viewLoaded = function (args) {
    var page = args.object;
    var createBtn = page.getViewById('create-btn');
    var nativeColor = createBtn.style._getValue(style.backgroundColorProperty).android;    
    page.getBackground().setColorFilter(nativeColor, android.graphics.PorterDuff.Mode.SRC_IN);
    page.bindingContext = eulaViewModel;    
};

Yet when I load that view I get the following error:

TypeError: Cannot read property 'id' of undefined
File: "/data/data/org.nativescript.LibreLinkUp/files/app/tns_modules/ui/core/dependency-observable.js, line: 148, column: 50

Should I be referencing a different "view" when calling getBackground()? I have tried a couple different things but none of them are working out.

It seems if I set the border-width of the button with ID "create-btn" then that fixes the issue in Android 4.4 but then I lose the material design in all other versions.

[calebeaires]

@enchev - Is this issue still on NativeScript team radar?

[enchev]

Hey @calebeaires,

This was fixed long time ago. Right now if you only want to set the color we will not override the default drawable.

[calebeaires]

@enchev - Thanks for your help.

May you just me give some more info? If I choose to use border-width, I will loose ripple effect on Android 4.2 to Android 4.4?

[bradmartin]

Those android API versions don't have material/ripple :)

On Thu, Nov 10, 2016, 7:32 AM Calebe Aires notifications@github.com wrote:

Thanks for your help.

May you just me give some more info? If I choose to use border-width, I
will loose ripple effect on Android 4.2 to Android 4.4?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#1296 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFulhMpKg-nu3KAIgJfJUE6wcg6RVU17ks5q8xzrgaJpZM4G7fSb
.

[enchev]

Yep, @bradmartin is correct. You can only set the color if you want to keep the original drawable.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.