Any way to wrap a native view in a component?

Ionic Framework
1

Hello, this question pertains to Ionic 4 with the Angular framework.

I am building an app which uses advertising for its primary monetization method. We need to integrate ad placements (banner / MREC / etc) within a scrollable ion-list component.

My current solution for this is only to use advertisers which support a JavaScript-based API, but this isn’t feasible for all advertising partners. For example, using Google’s JS-based AdSense API for a mobile app is against their terms of service (it’s intended for web sites) and they require you to use AdMob instead for mobile apps. There are AdMob plug-ins for Ionic of course, but they only support static ad placements which do not scroll with the web view’s content, or full-screen interstitials.

If I am willing to write my own plugin to integrate an abritrary advertising SDK which generates a View-derived Java class on Android and a UIView-derived Swift class on iOS, is it possible to wrap those objects with an Angular component which can be rendered in the Ionic WebView and passes input events back to the native layer? If so, how might you suggest I approach it? Is there another solution I am missing?

Thanks for your input!

2

I dont have the knowledge of native elements to know if it is possible to render them in a webview. Best guess would be to generate media like png and serve, but then you lose Interaction.

Or maybe write assets like json and media to the assets folder dynamically?

Other way around I assume it is possible to pass a DOM element to native code and let the native code rerender and pass interaction url (click through) with it.

The latter strategy seems more plausible to me given the sandbox nature of webviews