Error after update to NS 3.1.3 about nativescript-floatingactionbutton

[marcelomiranda90]

Hello, I was able to change the background color by changing the value of the ns_accent item in app/ app_Resources/values-21/colors.xml

Example:

<?xml version="1.0" encoding="utf-8"?> <resources> <color name="ns_accent">#757575</color> </resources>

I hope it works for you too! ;)

[hshristov]

Fixed with NativeScript/NativeScript#4959

[tigrenok00]

I also have installed 3.2 today and the problem still exists

[tigrenok00]

@bradmartin We've shared the project with you at [email protected], would you please take a look?
Thank you!

[hshristov]

So it seems Android team is doing the same mistake like us. The newInstance method is not implemented by all Drawables so it throws an exception internally. I guess the only solution we have is to wrap it in a try/catch block.

[bradmartin]

Absolutely, I don't have the time currently to help on it but once a solution is found if it requires updating the plugin I'll make sure it happens.

[sudhanshu-15]

Updated to 3.2 and facing same issues on Android. iOS seems to work fine.

[tigrenok00]

Unfortunately, those steps did not help for me :(

[sudhanshu-15]

@bradmartin I too followed the steps right now, nuked the node_modules, removed tns-core-modules, removed platforms, updated and reran the application. Still gives me the same error.

tns info gives me:

┌──────────────────┬─────────────────┬────────────────┬─────────────┐
│ Component        │ Current version │ Latest version │ Information │
│ nativescript     │ 3.2.0           │ 3.2.0          │ Up to date  │
│ tns-core-modules │ 3.2.0           │ 3.2.0          │ Up to date  │
│ tns-android      │ 3.2.0           │ 3.2.0          │ Up to date  │
│ tns-ios          │ 3.2.0           │ 3.2.0          │ Up to date  │
└──────────────────┴─────────────────┴────────────────┴─────────────┘

Interestingly enough once I removed the background color from the css it started working fine. The moment I added the background color it started throwing the error.

[sudhanshu-15]

@marcelomiranda90 the trick did the job. @bradmartin I tried using backgroundColor in the CSS and it threw an error.

[andreacappadona17]

I'm having the same problem, but only when I set a background-color in the css class for the button.
With no background-color property, it works just fine.

[SP1966]

I believe that the same issue is affecting nativescript-cardview:
nstudio/nativescript-cardview#64

In both cases, cardview and floatingactionbutton if the background-color is set in CSS the app crashes. Remove the CSS and all is well, except the background-color is wrong! :)

[sagar1911]

Hi @andreacappadona17 ,
then how can I change the bg color of FAB button ?? Is there any alternative ??

[sagar1911]

Hey @andreacappadona17 ,
and it is moving according to the scroll I want it to be fixed even the user scrolls the page. How can I do that ??

[bradmartin]

Try using a previous version of the core-modules and see if it doesn't crash with the background color. I have core-modules 3.1.0 with ios runtime 3.1.0 and android runtime 3.1.1 and I can change the background color of the FAB just fine and have pushed two apps in the previous week. Haven't looked into the issue much because I haven't had this issue myself. @sagar1911 as far as it moving when you scroll, just dont set the hideOnSwipeOfView or animation for that and it shouldn't move. I don't move it in my app and I use the same code on the README with no issue. Hope that helps.

[sagar1911]

Thank you sir, BTW I have done it without plugin and it's working fine. Rodda SagarUX Engineer M [phone] E [email protected]

…

On Fri, Aug 18, 2017 at 7:47 PM, Brad Martin ***@***.***> wrote: Try using a previous version of the core-modules and see if it doesn't crash with the background color. I have core-modules 3.1.0 with ios runtime 3.1.0 and android runtime 3.1.1 and I can change the background color of the FAB just fine and have pushed two apps in the previous week. Haven't looked into the issue much because I haven't had this issue myself. @sagar1911 <https://github.com/sagar1911> as far as it moving when you scroll, just dont set the hideOnSwipeOfView or animation for that and it shouldn't move. I don't move it in my app and I use the same code on the README with no issue. Hope that helps. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#57 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AdFDnPyV7hjWXLnYdlF1mZVjFkWODr6lks5sZZ0VgaJpZM4OxArq> .

[Acanguven]

Removing background-color solves the problem. A fix for this would be great.

[bradmartin]

NativeScript/NativeScript#4728 (comment)

[SP1966]

I just installed 3.2 and unless I've done something wrong the problem persists.

[bradmartin]

Has anyone nuked their node_modules, cleaned the platform folder, updated runtimes, core-modules and then performed a full rebuild and install? I've just updated an app to 3.2.0 and I don't have any issue.

    <FAB row="0" rowSpan="2" col="0" (tap)="takePhoto() " icon="res://ic_photo_camera_white" rippleColor="#f1f1f1" class="take-picture-fab-button"></FAB>

.take-picture-fab-button {
  background-color: #ff4081;
  vertical-align: bottom;
  horizontal-align: right;
  height: 60;
  width: 60;
  margin: 10 15 5% 10;
}

I've navigated to and from multiple pages with the FAB on them. I've changed the background-color and let livesync run and it never throws the error.

If an uninstall, nuke, rebuild, & run doesn't fix this for those still experiencing the issue we might need to get a simple demo app to send to the core team. I wish I had an error but in my apps all seems fine, sorry everyone still having issues. Hopefully the steps mentioned here will help.

[tigrenok00]

@bradmartin We think we have a working project that reproduces the issue, can you please give an email to share it with on Google Drive?

[bradmartin]

First thing I noticed in that project, you're on core-modules 3.1.1 - I'm about to build it and run it, so will update soon. @tigrenok00

[bradmartin]

It works as expected with 3.2.0 core-modules which contains the fix for the issue in 3.1 core-modules. @tigrenok00 - so delete node_modules and set the core-modules to 3.2.0 in the package.json, then tns run android and it will install the 3.2 core-modules and it should work.

Let me know how it goes 😄

[tigrenok00]

Do you receive an error about Drawable in the console? We do

[bradmartin]

With resource icon on the FAB ^^^.

Yes, there is some drawable exception in the console that seems to be printing. I'm not sure what's causing that but at least the FAB will render. Figuring out that exception will take more time to debug and I currently don't have extra time to look into it, sorry. Would be happy if someone else has any time to debug it and see where it's thrown from.

[tigrenok00]

In our original project we have a crush with the error shown on the original post screenshot. In the example project there is no crush but the error is seen in the console.
What would you suggest us do? We cannot upload the original project as is right now...

[tigrenok00]

Sorry, just saw your comment about tns-core-modules. In the original project it is 3.2.0 already (the one with the crash), we just updated the example one and it behaves as said - no crash, but error in console. I'm not sure why the original project is different.

[bradmartin]

Can you share screenshot of your appresources folder with one android directory and the icon you are putting on the Fab

…

On Tue, Sep 12, 2017, 10:19 AM Sudhanshu Siddh ***@***.***> wrote: @bradmartin <https://github.com/bradmartin> I too followed the steps right now, nuked the node_modules, removed tns-core-modules, removed platforms, updated and reran the application. Still gives me the same error. tns info gives me: ┌──────────────────┬─────────────────┬────────────────┬─────────────┐ │ Component │ Current version │ Latest version │ Information │ │ nativescript │ 3.2.0 │ 3.2.0 │ Up to date │ │ tns-core-modules │ 3.2.0 │ 3.2.0 │ Up to date │ │ tns-android │ 3.2.0 │ 3.2.0 │ Up to date │ │ tns-ios │ 3.2.0 │ 3.2.0 │ Up to date │ └──────────────────┴─────────────────┴────────────────┴─────────────┘ [image: tns-nativescriptactivity-09122017104551] <https://user-images.githubusercontent.com/883233/30332136-9905fac0-97a7-11e7-994b-f4fba6eeedf1.png> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#57 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFulhDAMA4LbN1Ox1mZqO9tnLZ9M8Idxks5shpppgaJpZM4OxArq> .

[sudhanshu-15]

Here you go

This was taken from https://material.io/icons/#ic_add

[bradmartin]

Yep all good there. What is the color value in your css? I use hex values and it doesn't throw that exception. Also, can you try on various android APIs and see if you can isolate maybe a specific API? First thing I'd try is to clone the repo and run the demo app. If the demo app runs then you can start isolating your issue to something in your application. So lets try that first and let me know how it goes please 😄

[tigrenok00]

Did anyone manage to solve the problem?

[sudhanshu-15]

@bradmartin the color value is #7D110C. I am trying to check with the different android APIs and get back to you. I will also try to clone the demo app and try. Sorry for the delay, I had been away from a day.

[sudhanshu-15]

UPDATE: Tried running the demo app and it gave me the same error.
Removing background-color from css fixes it.

[tigrenok00]

Hi @bradmartin , do you have any advice for us?

[bradmartin]

Hi @tigrenok00 - I currently don't. I did meet @sudhanshu-15 at the developer day conference and discussed it. I'll probably take a look at this later this week or early next.

[sudhanshu-15]

@bradmartin I ran the demo app on my personal device and it seems to be working fine. I am going to send you the demo app zip from my work system in a day or two.

On Tue, Sep 19, 2017 at 3:39 PM Brad Martin ***@***.***> wrote: Hi @tigrenok00 <https://github.com/tigrenok00> - I currently don't. I did meet @sudhanshu-15 <https://github.com/sudhanshu-15> at the developer day conference and discussed it. I'll probably take a look at this later this week or early next. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#57 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AA16IQB1Ba1bt66sxtpsb8ayfp9e3tGWks5skBhTgaJpZM4OxArq> .

-- Sudhanshu

[jukkaisosomppi]

It seems to be problem at least on android 6 version. 3.2 core-modules fixed it on android 7 and 4.4.4 at least. Removing background-color from .fab-button fixes it and it takes color from ns_primary or ns_accent from manifest

[sudhanshu-15]

@bradmartin @jukkaisosomppi I can confirm @jukkaisosomppi hypothesis of the problem being on Android 6. I deployed on my Android 7 device and emulator and it seems to be working fine, while it crashes on my other device running android 6.

[bradmartin]

Good to know. I only tested on 7 I think. This should help tracking down the issue.

…

On Fri, Sep 22, 2017, 9:44 AM Sudhanshu Siddh ***@***.***> wrote: @bradmartin <https://github.com/bradmartin> @jukkaisosomppi <https://github.com/jukkaisosomppi> I can confirm @jukkaisosomppi <https://github.com/jukkaisosomppi> hypothesis of the problem being on Android 6. I deployed on my Android 7 device and emulator and it seems to be working fine, while it crashes on my other device running android 6. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#57 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFulhLjRyu_YrnH2q3lj0L0xfJMx9bSYks5sk8e2gaJpZM4OxArq> .

[hshristov]

@jukkaisosomppi @sudhanshu-15 If anyone could attach a project that reproduce it or at least steps to repro please do so. I will take a look.

[jukkaisosomppi]

Hi, here is example app.

android6_problem.zip

[tigrenok00]

@bradmartin Hi, if the problem is found, any chance for an update to fix this on android 6? Thanks!

[tigrenok00]

I hoped to set the color we need in ns_primary or ns_accent until the fix, but it has no impact... (I'm using a theme, and it looks like regardless of which theme it is, the default FAB color is the same)

[adolfos94]

Hello guys, I have the same issue. Actually my app is published. The problem here is in some devices on Android, the background-color works perfectly on other devices doesn't work. Any idea how to fix it ?

[bradmartin]

For now the best approach across all android APIs IMO is to use the ns_accent color which will be used by the android theme for FAB buttons in the support design library. This will allow you not to code a backgroundColor on the FAB for now to avoid the crash.

Has anyone confirmed on Android 6 if using backgroundColor in the markup works or does that still cause the exception to throw?

[adolfos94]

Thanks @marcelomiranda90 your fix worked like a charm.

[bradmartin]

Confirmed the fix is good, thanks @hshristov