Using the device Phone and SMS with NativeScript

Brad Martin
InstructorBrad Martin
Share this video with your friends

Social Share Links

Send Tweet
Published 8 years ago
Updated 6 years ago

We will use the nativescript-phone plugin which provides a simple API to access the device's default phone and SMS applications. This allows us to dial phone numbers from our app using the device's phone capabilities as well as pre filling SMS messages for your app's users.

[00:00] Start by adding the plugin using the TNS plugin add command. The name of the plugin is NativeScript Phone. With the plugin installed, on your main dash page XML, just add a stack layout. Inside of the stack layout, we will add a button.

[00:25] We're going to use the button's tap event to execute our function. We'll call it callHome. Now that we have a button on our page, we're going to the main dash page TS file, which is the code behind for the main dash page XML.

[00:41] First thing, we're going to import the entire module. It is NativeScript Phone, the name of the plugin. We need to create the function that we declared on the button's tap event. We called it callHome. Inside of the event, let's go ahead and grab the phone that we're importing. We're going to use the dial function.

[01:08] It accepts a number as a string, so we'll then put a fake number here. The second argument is a Boolean to confirm the dial action. We'll run it as true this time. Now, when we tap the button, we should be prompted to dial the phone number.

[01:27] There's the phone number we entered. We are prompted. We can go ahead and tap that, and the phone starts dialing. Go ahead and cancel that. The NativeScript Phone plugin also provides access to the use the device SMS.

[01:43] We'll go ahead, and we're just going to reuse the callHome function that's on the tap event of the button. We'll go phone.sms as the method. The first argument is an array of strings for the phone numbers. We'll create our array.

[02:02] We're just going to use one number this time, and the message is the second argument. Then we'll say, "Hello Egghead." The SMS method does return a promise, so we'll go ahead and define that, and we'll just log out the result.

[02:27] Now, when we tap the button, we should be presented with the SMS application on the phone, and the message should be prefilled with the message argument, "Hello Egghead." There is the number that we passed in the array for the recipients, and there is the message, "Hello Egghead," prefilled in the message.

[02:47] To show off the additional capabilities of passing the array, let's just define one more number. Now, when we run this, we should have two numbers prefilled in the SMS message. There are the two numbers, and there is the message, "Hello Egghead."