Problems with Plugin: Telerik-UI for NativeScript

[Mobiledev1]

Hi,

we want to use Side-Drawer and the ListView component of the Telerik-UI for NativeScript package in our NativeScript-app, but I have some problems using this plugin in the Telerik AppBuilder.

When I install the plugin version 0.2.3, the build suceeds and the app is deployed on Android and iOS devices. But when I try to start the app on my iPhone 4S with iOS 9.2, the app crashes before loading the first page. Unfortunately, we have no test-devices with iOS 8, only iOS 7.1 and iOS 9.2 (but the plugin requires at least iOS 8).

The build fails for Android and iOS, when I install the plugin with version 0.2.4. I use the tns-core-modules with version 1.5.2.

Can you try to reproduce this issue? We have many ListViews in our app and we want to derive benefit from all the features, that this plugin contains.

 

Best regards,

Felix

[Dimitar Kerezov]

Hi Felix,

So far, I wasn't able to reproduce the issue you've described. I managed to successfully built and run a NativeScript application with tns-core-modules 1.5.2 and both nativescript-telerik-ui version 0.2.4 and 0.2.3. running this configuration on an iPhone 6 iOS 8.3 as well as on an iPhone 5S iOS 9.2.

Could you try installing nativescript-telerik-ui with version 0.2.4 and attach back the failing build log so that we can research the case further?

In addition, if it's not too much trouble we will need the .ipa file produced from a build with the plugin version 0.2.3 so we can investigate the app's crash.

Thank you in advance for your cooperation.

Regards,
Dimitar Kerezov
Telerik

 

 

[Mobiledev1]

Hi Dimitar,

I noticed, that the build fails only for Android, when nativescript-telerik-ui version 0.2.3 is installed, but the build succeeds for iOS. When I want to build for Android, the AppBuilder just shows the error 'Build failed with error code 127 - File: N/A'.

Now I created three ipa-files with Telerik AppBuilder: the first one is the app without the nativescript-telerik-ui plugin installed, the second one with version 0.2.3 and the third one with version 0.2.4. See the folIowing link to access the ipa-packages:

https://drive.google.com/folderview?id=0B5bzHSHv-whWUk1TMmhfWDhkYU0&usp=sharing

 

When I deploy the app package with nativescript-telerik-ui 0.2.3 or 0.2.4 on my iPhone 4S (iOS 9.2), the app crashes before showing the first page. Please tell me if you are able to reproduce this behaviour with the generated packages.

 

Best regards,

Felix

[Dimitar Kerezov]

Hi Felix,

I am afraid, I'm experiencing some issues while trying to resign the .ipa files you've sent so I can neither confirm nor reject the reproduction of the crash yet.

What I can suggest is another proposal - if you have either the NativeScript CLI or the AppBuilder CLI installed on your machine, could you try executing $ tns device log or $ appbuilder device log respectively on your machine? The respective CLI client will start printing logs on the console and we might be able to diagnose the crash better.

You can open a new support ticket and attach the files there.

In addition, could you send us the full build log when building for Android with nativescript-telerik-ui version 0.2.3, as I am still unable to reproduce the failing build. Adding nativescript-telerik-ui version 0.2.3 along with tns-core-modules version 1.5.2 build fine for Android as far as I can see.

Thank you again for your cooperation.

Regards,
Dimitar Kerezov
Telerik

 

 

[Mobiledev1]

Hi Dimitar,

I used to build the app via the Telerik AppBuilder Desktop-Client, because I prefer using a GUI to manage plugins and to switch between different versions of a plugin. But now for nesting, I built the App via AppBuilder CLI and this leads to the following result:

- the build succeeds for Android AND iOS using the nativescript-telerik-ui plugin version 0.2.3

- the build fails for Android (tested with 4.4.2 and 5.1.1) using the plugin version 0.2.4, but it succeeds for iOS (9.2)

You cann access the build log in the attachment (build_0-2-4-android.log).

When I try to run the app with nativescript-telerik-ui 0.2.3 or 0.2.4, the app crashes on iOS (9.2) and I also added the logs from appbuilder device log to the attachment (log_ios_crash_0-2-3.txt and log_ios_crash_0-2-3.txt).

I hope this information can help you to figure out what's going wrong here. Please tell me, if you need more details.

 

Best regards,

Felix

[Tina Stancheva]

Hi Felix,

I can confirm we have an issue with the latest version of the Telerik UI for NativeScript package for Android. The build fails due to the following error: com.android.dex.DexException: Multiple dex files define Lorg/nativescript/widgets/LayoutBase; The current runtime version of NativeScript in Telerik Platform contains a library that raises this error. We will fix this issue as soon as possible and in the meantime please continue using version 0.2.3 of the package.

Regarding the iOS crash, I can see there are some errors detected in the device log but as I cannot replicate them locally I cannot isolate the exact cause. I therefore attached a sample project which I prepared on my side - it demonstrates how you can add a SideDrawer in a NativeScript app built with Telerik Platform.

Please run this app on a device on your side and let me know if it works for you. If you can also modify it to replicate the issue you're facing, I will gladly take another look at what is going wrong.

Regards,
Tina Stancheva
Telerik

 

 

[Sathish]

I am using "nativescript-telerik-ui" for sidedrawer. This results in following error. However the same is not see in "nativescript-telerik-ui-pro". Will there be a fix for this issue in "nativescript-telerik-ui".

I tried the approach suggested above(bu Tina Stancheva ) no luck.

Exception details
The application crashed because of an uncaught exception. You can look at "stackTrace" or "nativeException" for more detailed information about the exception.
An uncaught Exception occurred on "main" thread.
java.lang.RuntimeException: Unable to start activity ComponentInfo{org.nativescript.SideDrawerApp/com.tns.NativeScriptActivity}: com.tns.NativeScriptException:
Calling js method onCreate failed
StackTrace:
Frame: function:'', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/builder/builder.js', line: 167, column: 21
Frame: function:'', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/xml/xml.js', line: 148, column: 13
Frame: function:'EasySAXParser.parse', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/js-libs/easysax/easysax.js', line: 751, column: 23
Frame: function:'XmlParser.parse', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/xml/xml.js', line: 195, column: 22
Frame: function:'XmlStringParser.parse', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/builder/builder.js', line: 173, column: 27
Frame: function:'parseInternal', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/builder/builder.js', line: 48, column: 11
Frame: function:'loadInternal', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/builder/builder.js', line: 125, column: 27
Frame: function:'load', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/builder/builder.js', line: 109, column: 27
Frame: function:'pageFromBuilder', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/frame/frame-common.js', line: 111, column: 27
Frame: function:'resolvePageFromEntry', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/frame/frame-common.js', line: 89, column: 20
Frame: function:'Frame.navigate', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/frame/frame-common.js', line: 165, column: 20
Frame: function:'ActivityCallbacksImplementation.onCreate', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/frame/frame.js', line: 690, column: 19
Frame: function:'NativeScriptActivity.onCreate', file:'/data/data/org.nativescript.SideDrawerApp/files/app/tns_modules/ui/frame/activity.js', line: 13, column: 25
at com.tns.Runtime.callJSMethodNative(Native Method)
at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1022)
at com.tns.Runtime.callJSMethodImpl(Runtime.java:907)
at com.tns.Runtime.callJSMethod(Runtime.java:895)
at com.tns.Runtime.callJSMethod(Runtime.java:879)
at com.tns.Runtime.callJSMethod(Runtime.java:871)
at com.tns.NativeScriptActivity.onCreate(android.app.Activity.java)
at android.app.Activity.performCreate(Activity.java:6664)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1118)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2599)

[Martin]

Hello Sathish,

If you are using "nativescript-telerik-ui" sidedrawer, make sure in the XML to include xmlns:sd="nativescript-telerik-ui/sidedrawer" (not xmlns:sd="nativescript-telerik-ui-pro/sidedrawer" which is for nativescript-telerik-ui-pro version as this will cause the app to crash).

Let me know if this was the case. If not, could you please send a sample project so that we can reproduce the error.

Regards,
Martin
Telerik by Progress

 

 

[Sathish]

I am using "nativescript-telerik-ui"

[Sathish]

Please see the attached files and help me put in finding the issue.

[Nikolay Tsonev]

Hello,
Thank you for your interest in UI for NativeScript.

 I reviewed your code and found that the problem has been caused due to missing  namespaces inside your XML code. You should add

xmlns:dpg="nativescript-telerik-ui/sidedrawer/drawerpage"
:drawer="--/"

in the open Page tag. For your I am attaching sample code, where has been  shown, how to set those namespaces. On that point, you should also use `drawer:RadSideDrawer.mainContent` tags, where you should set main screen content for the current SideDrawer instance.

main-page.xml

<Page  xmlns:dpg="nativescript-telerik-ui/sidedrawer/drawerpage"
    xmlns:drawer="nativescript-telerik-ui/sidedrawer" loaded="pageLoaded">
    <dpg:DrawerPage.sideDrawer>
        <drawer:RadSideDrawer id="sideDrawer">
        <drawer:RadSideDrawer.drawerContent>
            <StackLayout cssClass="drawerContent">
            <StackLayout cssClass="headerContent">
                <Label text="Navigation Menu"/>
            </StackLayout>
            <StackLayout cssClass="drawerMenuContent" backgroundColor="red">
                <Label text="Primary" cssClass="drawerSectionHeader" />
                <Label text="Social" cssClass="drawerSectionItem" />
                <Label text="Promotions" cssClass="drawerSectionItem" />
                <Label text="Labels" cssClass="drawerSectionHeader" />
                <Label text="Important" cssClass="drawerSectionItem" />
                <Label text="Starred" cssClass="drawerSectionItem" />
                <Label text="Sent Mail" cssClass="drawerSectionItem" />
                <Label text="Drafts" cssClass="drawerSectionItem" />
            </StackLayout>
            <Button text="Close Drawer" tap="{{ onCloseDrawerTap }}"/>

            </StackLayout>
        </drawer:RadSideDrawer.drawerContent>
        <drawer:RadSideDrawer.mainContent>
            <StackLayout >
                <Label text="{{ mainContentText }}" textWrap="true" cssClass="drawerContentText"/>

                <Button text="Open drawer" tap="{{ onOpenDrawerTap }}" cssClass="drawerContentButton"/>

            </StackLayout>
        </drawer:RadSideDrawer.mainContent>
        </drawer:RadSideDrawer>
    </dpg:DrawerPage.sideDrawer>
</Page>

Let me know, whether this helps or if I could assist you further.
Regards,
nikolay.tsonev
Telerik by Progress