henrychavez / nativescript-bottom-navigation

Nativescript plugin for Android & iOS to have the bottom navigation bar of Material Design
Apache License 2.0
58 stars 18 forks source link

Vue support #24

Closed reydajp closed 6 years ago

reydajp commented 6 years ago

I've made a new project. Tried adding a couple of plugins following instructions in docs, but in both cases the app throws TypeError: Cannot read property 'android' of null File: "file:///data/data/org.nativescript.application/files/app/app.js, line: 19943, column: 79.

Does this plugin support vue template ? I'm using the latest template and ^0.2.0 nativescript-vue-externals.

My code:

import Vue from 'nativescript-vue'
import Axios from 'axios'
import VueAxios from 'vue-axios'
import router from './router'
import store from './store'
import './styles.scss'

// Uncommment the following to see NativeScript-Vue output logs
// Vue.config.silent = false;
const sidedrawer = require('nativescript-ui-sidedrawer').RadSideDrawer
const dataform = require('nativescript-ui-dataform').RadDataForm
const bottomNavigation = require('nativescript-bottom-navigation').BottomNavigation
const bottomNavigationTab = require('nativescript-bottom-navigation').BottomNavigationTab
const onTabSelectedEventData = require('nativescript-bottom-navigation').OnTabSelectedEventData

Vue.registerElement('RadSideDrawer', () => sidedrawer)
Vue.registerElement('RadDataForm', () => dataform)
Vue.registerElement('BottomNavigation', () => bottomNavigation)
Vue.registerElement('BottomNavigationTab', () => bottomNavigationTab)
Vue.registerElement('OnTabSelectedEventData', () => onTabSelectedEventData)

Vue.use(VueAxios, Axios)

new Vue({
  router,
  store,
}).$start()
TypeError: Cannot read property 'android' of null
File: "file:///data/data/org.nativescript.application/files/app/app.js, line: 19943, column: 79

StackTrace: 
    Frame: function:'BottomNavigation.createTabs', file:'file:///data/data/org.nativescript.application/files/app/app.js', line: 19943, column: 80
    Frame: function:'BottomNavigation.(anonymous function)', file:'file:///data/data/org.nativescript.application/files/app/app.js', line: 19953, column: 14
    Frame: function:'applyAllNativeSetters', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/properties/properties.js', line: 961, column: 28
    Frame: function:'initNativeView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/properties/properties.js', line: 905, column: 9
    Frame: function:'ViewBase.onResumeNativeUpdates', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 555, column: 22
    Frame: function:'ViewBase._resumeNativeUpdates', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 223, column: 18
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 200, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 206, column: 19
    Frame: function:'LayoutBaseCommon.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/layouts/layout-base-common.js', line: 125, column: 26
    Frame: function:'ViewCommon.eachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view-common.js', line: 699, column: 14
    Frame: function:'ViewBase._loadEachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 205, column: 14
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 201, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 206, column: 19
    Frame: function:'ContentView.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/content-view/content-view.js', line: 70, column: 13
    Frame: function:'PageBase.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/page/page-common.js', line: 206, column: 40
    Frame: function:'ViewCommon.eachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view-common.js', line: 699, column: 14
    Frame: function:'ViewBase._loadEachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 205, column: 14
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 201, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'Page.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/page/page.js', line: 105, column: 35
    Frame: function:'ViewBase._addViewCore', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 360, column: 18
    Frame: function:'ViewBase._addView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 346, column: 14
    Frame: function:'FragmentCallbacksImplementation.onCreateView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/frame/frame.js', line: 504, column: 24
    Frame: function:'FragmentClass.onCreateView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/frame/fragment.js', line: 27, column: 38

    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2778)
    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2856)
    at android.app.ActivityThread.-wrap11(Unknown Source:0)
    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1589)
    at android.os.Handler.dispatchMessage(Handler.java:106)
    at android.os.Looper.loop(Looper.java:164)
    at android.app.ActivityThread.main(ActivityThread.java:6494)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:438)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:807)
Caused by: com.tns.NativeScriptException: 
Calling js method onCreateView failed

TypeError: Cannot read property 'android' of null
File: "file:///data/data/org.nativescript.application/files/app/app.js, line: 19943, column: 79

StackTrace: 
    Frame: function:'BottomNavigation.createTabs', file:'file:///data/data/org.nativescript.application/files/app/app.js', line: 19943, column: 80
    Frame: function:'BottomNavigation.(anonymous function)', file:'file:///data/data/org.nativescript.application/files/app/app.js', line: 19953, column: 14
    Frame: function:'applyAllNativeSetters', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/properties/properties.js', line: 961, column: 28
    Frame: function:'initNativeView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/properties/properties.js', line: 905, column: 9
    Frame: function:'ViewBase.onResumeNativeUpdates', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 555, column: 22
    Frame: function:'ViewBase._resumeNativeUpdates', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 223, column: 18
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 200, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 206, column: 19
    Frame: function:'LayoutBaseCommon.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/layouts/layout-base-common.js', line: 125, column: 26
    Frame: function:'ViewCommon.eachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view-common.js', line: 699, column: 14
    Frame: function:'ViewBase._loadEachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 205, column: 14
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 201, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 206, column: 19
    Frame: function:'ContentView.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/content-view/content-view.js', line: 70, column: 13
    Frame: function:'PageBase.eachChildView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/page/page-common.js', line: 206, column: 40
    Frame: function:'ViewCommon.eachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view-common.js', line: 699, column: 14
    Frame: function:'ViewBase._loadEachChild', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 205, column: 14
    Frame: function:'ViewBase.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 201, column: 14
    Frame: function:'View.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view/view.js', line: 62, column: 35
    Frame: function:'Page.onLoaded', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/page/page.js', line: 105, column: 35
    Frame: function:'ViewBase._addViewCore', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 360, column: 18
    Frame: function:'ViewBase._addView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js', line: 346, column: 14
    Frame: function:'FragmentCallbacksImplementation.onCreateView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/frame/frame.js', line: 504, column: 24
    Frame: function:'FragmentClass.onCreateView', file:'file:///data/data/org.nativescript.application/files/app/tns_modules/tns-core-modules/ui/frame/fragment.js', line: 27, column: 38

    at com.tns.Runtime.callJSMethodNative(Native Method)
    at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1088)
    at com.tns.Runtime.callJSMethodImpl(Runtime.java:970)
    at com.tns.Runtime.callJSMethod(Runtime.java:957)
    at com.tns.Runtime.callJSMethod(Runtime.java:941)
    at com.tns.Runtime.callJSMethod(Runtime.java:933)
    at com.tns.FragmentClass.onCreateView(FragmentClass.java:40)
    at android.app.Fragment.performCreateView(Fragment.java:2508)
    at android.app.FragmentManagerImpl.moveToState(FragmentManager.java:1279)
    at android.app.FragmentManagerImpl.addAddedFragments(FragmentManager.java:2407)
    at android.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:2186)
    at android.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:2142)
    at android.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:2043)
    at android.app.FragmentManagerImpl.dispatchMoveToState(FragmentManager.java:3032)
    at android.app.FragmentManagerImpl.dispatchStart(FragmentManager.java:2984)
    at android.app.FragmentController.dispatchStart(FragmentController.java:189)
    at android.app.Activity.performStart(Activity.java:7035)
    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2741)
henrychavez commented 6 years ago

Hi can you please check if u have the icons in your android and ios folders?

reydajp commented 6 years ago

@henrychavez No I don't have the icons. Is that mean I have to create a folder and put my icons with png format in ?

henrychavez commented 6 years ago

Yes, put ur icons inside the App_Resources folder for android and iOS check the demo app in the repo

henrychavez commented 6 years ago

@reydajp let me know if everything is ok

reydajp commented 6 years ago

@henrychavez it worked ! thanks By the way, font icons is still unsupported ?

henrychavez commented 6 years ago

Yes, but I'll find a way to support font icons soon