Nativescript-vue registerBroadcastReceiver doesnt work

android

#1

I wanna get device charge level like in example. But after im calling registerBroadcastReceiver function nothing happens. After quick research i noticed that new broadcast receivers are located in _pendingReceiverRegistration property of application.android object. And after application init them shuld be registered completely, but as i found in nativescript-vue sources, application.init function is called in nativescript-vue $start function. So i dont understand why broadcast recievers are dont register properly.
I use vue-cli-template without vue-router and NS 4.1.2.

here is my main.js

import Vue from 'nativescript-vue';
import store from './store';
import './styles.scss';

// Uncommment the following to see NativeScript-Vue output logs
//Vue.config.silent = false;

import MainPage from '@/components/pages/MainPage';

const application = require('tns-core-modules/application');

application.android.registerBroadcastReceiver(android.content.Intent.ACTION_BATTERY_CHANGED, (context, intent) => {
    const level = intent.getIntExtra(android.os.BatteryManager.EXTRA_LEVEL, -1);
    const scale = intent.getIntExtra(android.os.BatteryManager.EXTRA_SCALE, -1);
    const percent = (level / scale) * 100.0;
    console.log('battery:', percent.toString());
});

new Vue({
    store,
    render: h => h(MainPage)
}).$start();

and here is MainPage.vue component

<template>
    <Page class="page">
        <ActionBar class="action-bar" :title="'test'">
            <ActionItem
                    @tap="goToSettings"
                    android.systemIcon="ic_menu_preferences" android.position="actionBar"/>
        </ActionBar>

        <StackLayout class="layout">
            <button @tap="setReceiver">Test</button>
            <label :text="battery"/>
            <label :text="message" />
        </StackLayout>

    </Page>
</template>

<script>
    const permissions = require('nativescript-permissions');
    const application = require('tns-core-modules/application');

    import SettingsPage from './Settings';

    export default {
        name: "main-page",
        data() {
            return {
                test: '',
                message: '',
                battery: 0
            }
        },

        methods: {
            goToSettings() {
                this.$navigateTo(SettingsPage);
            },
            setReceiver() {
                application.android.registerBroadcastReceiver(android.content.Intent.ACTION_BATTERY_CHANGED, (context, intent) => {
                    const level = intent.getIntExtra(android.os.BatteryManager.EXTRA_LEVEL, -1);
                    const scale = intent.getIntExtra(android.os.BatteryManager.EXTRA_SCALE, -1);
                    const percent = (level / scale) * 100.0;
                    console.log('battery:', percent.toString());
                });

                        
                console.log(application.android);
            }
        }
    }
</script>

As you see i tried to register broadcast reciever before and after start of NS and ns-vue, but both of them are located in application.android._pendingReceiverRegistration when i calling console.log in setReceiver method.


#2

Was it a typo - setReceiver vs setReciever?

<button @tap="setReciever">Test</button>
setReceiver() {
                application.android.registerBroadcastReceiver(android.content.Intent.ACTION_BATTERY_CHANGED, (context, intent) => {
                    const level = intent.getIntExtra(android.os.BatteryManager.EXTRA_LEVEL, -1);
                    const scale = intent.getIntExtra(android.os.BatteryManager.EXTRA_SCALE, -1);
                    const percent = (level / scale) * 100.0;
                    console.log('battery:', percent.toString());
                });

                        
                console.log(application.android);
            }

#3

Nah thats not it, i changed method name while typing this post becouse it was sendSms xd
Sorry for this mistake.


#4

It seems to work on my end.


#5

Your code works great with nativescript-vue-template but still the same problem on vue-cli-template