More Documentation for creating Capcitor Plugins

Is there any documentation or tutorial on creating advanced capcitor plugins.
For example: GitHub - capacitor-community/camera-preview: Capacitor plugin that allows camera interaction from HTML code

Case 1

Most exciting part of camera-preview plugin is that it streams native camera to ionic.
Therefore I can create my ui in html and just point to html element where camera-preview can stream camera.

Case 2

Another exmaple I want to create inline vidoe player using underlaying native platform libraries

  • for iOS → AVKit
  • for Android → ExoPlayer

P.S: I need to play h265 videos.


Is there any tutorial or documentation that shows:

  • How to build capacitor plugin that can host native elements to ionic view?
  • How we stream native view to ionic (iOS, Android)?

So far I found these reserouces for creating capcitors pluings

There aren’t really “advanced” tutorials similar to what you’ve described. When making plugins the only Capacitor-specific step you need is to use the plugin API to send data back and forth from web <–> native. Making a native video player using Exoplayer or AVKit is doable, but does require a lot of knowledge of native APIs for programmatically displaying the video containers. Your best bet right now is to look at how existing Capacitor plugins work and read the docs for both AVKit and Exoplayer.

That being said, the team is planning on making more docs and tutorials on how to make plugins; but a lot of what you’re describing is more knowledge of Android/iOS APIs and not really related to Capacitor APIs.

Thank you for your response.
I solved my problem “Displaying native vidoe player inline”

My task was to play HEVC/H265 video inline.

Existing ionic/capacitor video players play in full screen mode only.
Some ionic/capacitor plugins were old and can not even play HEVC videos.

Ionic documentation only shows how to do native calls but does not show how to display native element on top of Ionic web view.

But finally I was able to play HEVC/H265 video inline here is the demo.

It’s only Proof Of Concept and can be developed further if needed.

Actually Playing High-efficiency video format (h265) problem is harder than it seems.
If you look at "HEVC" | Can I use... Support tables for HTML5, CSS3, etc Safari can play HEVC/H265 videos natively and Chrome can not that’s why on Android version of capture-lite HEVC/H265 videos only play sound.

Also according to chrome team discussion they will not add support for HEVC/H265 videos in Chrome soon. Even Chrome version released in Feb 2022 does not support HEVC/H265. But Safari can play HEVC/H265 videos since Sep 2019.

@thomasvidas I would be glad to contribute back to ionic documentations if needed so others can go through this path easier.

I use ExoPlayer to play video inline.