feat(webview): adds iosAllowInlineMediaPlayback property (#10014)

This commit is contained in:
Dave Coffin
2022-10-07 11:41:38 -04:00
committed by GitHub
parent a162901f8c
commit 4a0e1c9aa1
6 changed files with 53 additions and 1 deletions

View File

@@ -19,6 +19,7 @@
<Button text="vector-image" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
<Button text="visibility-vs-hidden" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
<Button text="fs-helper" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
<Button text="webview" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
</StackLayout>
</ScrollView>
</StackLayout>

View File

@@ -0,0 +1,10 @@
import { Observable, EventData, Page, CoreTypes } from '@nativescript/core';
let page: Page;
export function navigatingTo(args: EventData) {
page = <Page>args.object;
page.bindingContext = new WebviewModel();
}
export class WebviewModel extends Observable {}

View File

@@ -0,0 +1,17 @@
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
<Page.actionBar>
<ActionBar title="WebView" class="action-bar">
</ActionBar>
</Page.actionBar>
<StackLayout class="p-10">
<Label text="iPhone by default plays media content in a webview in full screen, meaning it takes over your whole UI. You can toggle this on and off with a cool new property: iosAllowInlineMediaPlayback" textWrap="true" style="color: gray;" class="m-b-10 v-center text-center" />
<Label style="color: gray;" textWrap="true" class="m-b-5 text-center" text="This webview plays this youtube content inline." />
<WebView iosAllowInlineMediaPlayback="true" src="https://sphere.presonus.com/video/youtube/QnGX0xrv6Dw" height="200" />
<Label style="color: gray;" textWrap="true" class="m-b-5 m-t-20 text-center" text="This webview forces media content into fullscreen on iPhone." />
<WebView src="https://sphere.presonus.com/video/youtube/QnGX0xrv6Dw" height="200" />
</StackLayout>
</Page>