Bluetooth

Bluetooth

Bluetooth Starter App for Web and Native

$10.00

Not yet rated
Juergen Kienhoefer

Juergen Kienhoefer

Member since 2015

Details

Version:
1.2
Size:
4mb
Ionic:
3.x
Platforms:
iOS, Android
View ID:
496531ad
Released:
4 years ago
Updated:
4 years ago
Category:
Starters
Tags:
Bluetooth, Serial, GATT, spp-over-gatt

Ionic 3 Hybrid Bluetooth Starter App

This is a hybrid Bluetooth starter app, written for Ionic 3 to run on Chrome (Web Bluetooth) and natively on iOS and Android. Both APIs are used to create a single source application.

SPP-over-GATT, Implementing Serial Port Profile

As an example we implemented high speed data transfer, using the GATT protocol. It is called SPP-over-GATT, Serial Port Profile over GATT. Basically one characteristic acts as a notifier for incoming data and can be written to for transfer.

In addition we added a security protocol, similar to the standard Bluetooth PIN code. For information about the Serial-to-Bluetooth hardware find the AIRcable MiniMesh here.

Javascript Library xterm.js

A terminal screen lets the user type commands (just characters) to send data and see data from the serial port.

We used the Javascript library xterm.js to display data in a simple terminal.

Make It Your Own

Take that source code and modify the way the data is displayed to create your own hybrid Bluetooth application. Mainly, the Web Bluetooth code is in the ble provider implementation, while the DevicePage has the native Bluetooth implementation. Both files have to match, implementing the Bluetooth functionality of the hardware you connect to. Unfortunately both APIs are so different that it is separate in two different locations. We check using the Platform object if Cordova is present. This switches between the two implementations. See tab.ts.

You are welcome to contribute to the project. No everything is perfect yet. For example please help to get the xterm.js better integrated. Some style things are a bit weird, e.g. the use of which makes it look good, but does not exist. Also additional features contributions are welcome.

With the Ionic CLI:

Make sure you have Node.js and Ionic installed:

$ sudo npm install -g cordova ionic

Then just cd into the SPP-over-GATT directory and run:

$ ionic serve -lc

Building for iOS and compile the icon/splash screen:

$ ionic cordova build ios --prod
$ ionic cordova resources

Then you can use Xcode to compile the app and run on device. Two hints: first change the TEAM and change the BUILD setting to use only the Developer credentials automatically.

Testing on iOS

Configure your iPhone to allow Safari's Web Inispector. Then run Safari on OSX and use the developer tools to see debug messages from the Ionic app running on the iOS device.

iTune Store

The app has bee accepted by Apple to the iTune Store for iOS devices. You need to provide icons and splash screen, which are included here as Photoshop files and then a number of screenshorts are the required resolution. Install if from here.

Progressive Web App

Build the app as a PWA to install on your web server. Copy the www directory to your server. There is a starter preview.html file there, that makes the screen look like an iPhone, similar to the ionic serve command.

$ ionic build browser --prod

Hey there! You'll need to log in before you can leave a comment here.

Ree Wang

Ree Wang   ·   4 years ago

I have purchased this app. Is it applied for Android mobile? Could you please add how to run it in Android. I conducted as below to run it in my android phone, but it has build error... $ ionic cordova run Please help!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Ree Wang

Ree Wang   ·   4 years ago

I have purchased this app. Is it applied for Android mobile? Could you please add how to run it in Android. I conducted as below to run it in my android phone, but it has build error... $ ionic cordova run Please help!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

  ·   just now

{{ comment.comment }}

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

  ·   just now

{{ comment.comment }}

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Ree Wang

Ree Wang   ·   4 years ago

I have purchased this app. Is it applied for Android mobile? Could you please add how to run it in Android. I conducted as below to run it in my android phone, but it has build error... $ ionic cordova run Please help!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Ree Wang

Ree Wang   ·   4 years ago

I have purchased this app. Is it applied for Android mobile? Could you please add how to run it in Android. I conducted as below to run it in my android phone, but it has build error... $ ionic cordova run Please help!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Hey there! You'll need to log in and purchase the add-on before you can leave a rating here.

There are no ratings for this starter yet

  ·     ·   just now

{{ rating.comment }}

  ·     ·   just now

{{ rating.comment }}