@cdev38399/nativescript-youtubeplayer v4.0.1

NativeScript YoutubePlayer

Installation

NativeScript 4x

• tns plugin add nativescript-youtubeplayer

NativeScript 3x

• tns plugin add nativescript-youtubeplayer@2.2.6

Configuration

Android

Api key follow ➡ link to get your api key

Usage

XML

IMPORTANT: Make sure you include xmlns:ui="nativescript-youtubeplayer" on the Page element

<ui:YoutubePlayer id="player" apiKey="AIzaSyCDH3BGQZT2ebUfSE8D3I8NLqaCPu4FRh0" src="{{src}}" height="250" width="100%" backgroundColor="gray" />

Angular

import { YoutubePlayerModule } from 'nativescript-youtubeplayer/angular';

@NgModule({
    imports: [
    YoutubePlayerModule
    ],
    declarations: [
        AppComponent
    ],
    bootstrap: [AppComponent]
})

<YoutubePlayer id="player" apiKey="AIzaSyCDH3BGQZT2ebUfSE8D3I8NLqaCPu4FRh0" src="{{src}}" height="250" width="100%" backgroundColor="gray"></YoutubePlayer>

Vue

Register the plugin in app.js (or depending on your app's setup: app.ts, or main.js, etc):

import Vue from 'nativescript-vue'
Vue.registerElement('YoutubePlayer', () => require('nativescript-youtubeplayer').YoutubePlayer)

<template>
  <Page class="page">
    <ActionBar class="action-bar">
      <Label class="action-bar-title" text="Home"></Label>
    </ActionBar>

    <StackLayout>
      <YoutubePlayer src="wH_0_pijbZY" apiKey="your-api-key"/>
    </StackLayout>
  </Page>
</template>

Api

Properties

Example Image

IOS	Android

TODO

• IOS
• toggleFullscreen IOS