This example app demonstrates the following:
- Angular Ionic app built with Capacitor
- Usage of @nativescript/capacitor to help solve real world issues
- Native iOS/Android UI with Web Dom interactions
- How to build a native video streaming player yourself with NativeScript for Capacitor
- How to handle battery level change system notifications for iOS and Android using NativeScript for Capacitor
The Musical video clips used herein are only samples from recorded musical productions for free fairplay use and not intended to be high quality reproductions of those musicals in anyway.
nativeflix.mp4
Run this after cloning:
npm run clean
NOTE: If you get prompted about installing webpack you can choose 'y'. This may prompt when using npm 7+.
It will set things up.
Now build it and prepare:
npm run build:mobile
npx cap sync
You can now run on either iOS or Android:
npx cap open ios
// or...
npx cap open android
- If you see a build/run issue related to 'node', for example like this:
> Task :capacitor-android:compileDebugLibraryResources
> Task :app:runSbg FAILED
Error executing Static Binding Generator: java.io.IOException: Cannot run program "node": error=2, No such file or directory
This means Android Studio could not find node. Close and open Android Studio via Terminal as follows which will help:
open -a "Android Studio"
- If you see an issue like this in the build log:
Caused by: java.lang.ClassNotFoundException: Didn't find class "io.nstudio.ngconf2021.CustomActivity" on path: DexPathList
This usually means a good project clean is needed. Try doing a full 'Project Clean' in Android Studio and build/run. If you still see the issue, try running once more - usually related to a clean/build cycle with Android Studio.
Picture-in-Picture mode works only on a real device. You can plug an iPhone in and launch on your phone from Xcode to experience the PIP mode.