Xamarin Forms: Native Embedding Android and iOS Video Player - xamarin

I've been working on this Xamarin Forms mobile application and I've been loving it but it's a media player application and the native embedding for the platform specific video player doesn't work. After much debugging I was able to get the audio playing but no video would show up. I think this has to do with the views just not being swapped out appropriately. Unfortunately there isn't much material on how to effectively switch from a Xamarin Forms view to a native view (to see the video) through Xamarin Forms. Any help is appreciated thank you !
I was able to get iOS videos working by using the Xamarin Forms messaging service to Appdelegate class and built the AVPlayer class there. Works great.
playVideo.Clicked += (sender, e) =>
MessagingCenter.Send(this, "ShowVideoPlayer", new
ShowVideoPlayerArguments(videoUrl));
Appdelegate.cs
MessagingCenter.Subscribe<VideoDetailPage,
ShowVideoPlayerArguments>(this, "ShowVideoPlayer",
HandleShowVideoPlayerMessage);
//messaging center class
private void HandleShowVideoPlayerMessage(Page page,
ShowVideoPlayerArguments arguments)
{
var presentingViewController = GetMostPresentedViewController();
var url = NSUrl.FromString(arguments.Url);
var avp = new AVPlayer(url);
var avpvc = new AVPlayerViewController();
avpvc.Player = avp;
avp.Play();
presentingViewController.PresentViewController(avpvc, animated: true,
completionHandler: null);
}
private UIViewController GetMostPresentedViewController()
{
var viewController =
UIApplication.SharedApplication.KeyWindow.RootViewController;
while (viewController.PresentedViewController != null){
viewController = viewController.PresentedViewController;
}
return viewController;
}
However.. Getting this to work with Android is a whole different animal since I have to have deal with .axml layouts I believe.. Any help with this would be greatly appreciate.. Thanks so much guys.

So I figured out an implementation using Native Views, an alternative to Custom Renderers. Such a more stream lined process.

Related

iOS Native to Forms navigation

I have been working on an application that uses both forms and native in Xamarin. The app starts with the form and switch to native to open the camera. My problem is once the image is clicked I want to go back to Forms application but I am unable to find enough documentation on it.
I have tried Navigation.PushAsync in iOS but it doesnt work.
var videoConnection = stillImageOutput.ConnectionFromMediaType(AVMediaType.Video);
var sampleBuffer = await stillImageOutput.CaptureStillImageTaskAsync(videoConnection);
var jpegImage = AVCaptureStillImageOutput.JpegStillToNSData(sampleBuffer);
var photo = new UIImage(jpegImage);
byte[] data;
NSData imageData = photo.AsJPEG();
data = new byte[imageData.Length];
EnrollImageDisplay.ImageData = data;
Where EnrollImageDisplay is my content page in forms. Not I have to call this page but I am unable to do so. Any solution with this?
EDIT: Solved it using Xamarin.Forms.Application.Current.MainPage.Navigation.PushAsync(new Page());

Xamarin ios map circle overlay click

I'm following the maps example https://developer.xamarin.com/samples/xamarin-forms/customrenderers/map/circle/ to create custom renderer to overlay circles. It seems to be working fine for all 3 platforms except I am unable to find any click event for iOS.
I am building a xamarin forms app and able to find out the click event on both Android and UWP but iOS seems to be far fetched.
Is there any way to do it?
iOS doesn't provide the API which detects the click event.
As a alternative workaround, we can add UITapGestureRecognizer on the mapview and judge if the tap point locates inside the circle.
Solution
//xxx
nativeMap.AddOverlay(circleOverlay);
nativeMap.AddGestureRecognizer(new UITapGestureRecognizer(TapHandle));
void TapHandle(UITapGestureRecognizer tap)
{
MKMapView mapView = tap.View as MKMapView;
CGPoint tapPoint = tap.LocationInView(mapView);
CLLocationCoordinate2D tapCoordinate = mapView.ConvertPoint(tapPoint, tap.View);
MKMapPoint point = MKMapPoint.FromCoordinate(tapCoordinate);
foreach(IMKOverlay overlay in mapView.Overlays)
{
MKCircleRenderer render = GetOverlayRenderer(mapView, overlay) as MKCircleRenderer;
CGPoint datPoint = render.PointForMapPoint(point);
render.InvalidatePath();
if (render.Path.ContainsPoint(datPoint,false))
{
break;
}
}
}

add web page in xamarin form

I'm very very new to using Xamarin forms. So new in fact I have just watched the "microsoft xamarin forms for absolute beginners".
I'm trying to include a webpage into the Xamarin form but the only info I can find is
var browser = new WebView {
Source = "http://xamarin.com"
};
This might sound silly but has anyone got a full tutorial on how to include one?
thanks
just create a WebView and assign it to a ContentPage. Then you can either make this page the main page of your app (in the App class) or you can navigate to it from another page.
ContentPage page = new ContentPage {
Content = new WebView { Source = "http://xamarin.com" }
};
To display a website from the internet, set the WebView's Source property to a string URL:
var browser = new WebView
{
Source = "http://xamarin.com"
};
see this:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/webview?tabs=windows#performance

How to handle screen rotation/orientation in Xamarin Forms?

Is there a (half) generic way to handle rotation/orientation in Xamarin Forms for different views and platforms (Android, iOS, WinPhone)?
The UI does rotate, and that is nice enough, though it wreaks havoc to my layout (absolute layout right now). I suppose with a Stacklayout I could make it a litte more flexible, but would then hit a road block somewhere else when the layout is more intricate.
Can I somehow display different views for portrait and landscape, with the same ViewModel? (I am using XLABs based MVVM.)
Possible solutions I have found:
http://blog.rthand.com/post/2014/07/24/Different-XAML-layouts-for-different-device-orienations-in-XamarinForms.aspx is lacking iOS and I wonder if it will handle MVVM too well, seems good though and I am investigating it right now
http://www.jimbobbennett.io/orientation-with-xamarin-forms/ sounds promising but the sample is iOS only, the linked GIT repository has no documentation at all, it just says "Xamarin Helpers"
http://www.sellsbrothers.com/posts/Details/13740 might also be a possibility for programmatically created views. Though in my tests I did not get a size changed event (though I listened at a different code place) for ios simulator when rotating. (The solution is based on size changed to detect rotation.)
If you are already using XLabs then you could use IXFormsApp and property 'Orientation' and event handler 'Rotation'. You would have to add the native observers per platform and set IXFormsApp's 'Orientation' there which would cause the event handler to invoke.
For example on iOS:
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
var xapp = new XFormsAppiOS();
xapp.Init(this);
var resolverContainer = new SimpleContainer();
resolverContainer.Register<IXFormsApp>(xapp);
Resolver.SetResolver(resolverContainer.GetResolver());
var a = new App();
LoadApplication(a);
UIDevice.Notifications.ObserveOrientationDidChange((s, e) =>
{
xapp.Orientation = ... // set orientation here
});
Now you can monitor orientation changes by resolving IXFormsApp:
xapp = Resolver.Resolve<IXFormsApp>();
if (xapp.Orientation == Orientation.Landscape) { ... } else { ... }
xapp.Rotation += (sender, args) =>
{
switch (args.Value)
{
case Orientation.LandscapeLeft:
break;
default:
// etc.
break;
}
};
As for layouts I would imagine RelativeLayout would be the most convenient choice as you could put the orientation inside the Constraint's. On rotation make the layout refresh itself.

Capture touch events in Xamarin.Forms for Android

I am creating an app that allows the user to drag and drop to put one image on top of another using Xamarin.Forms.
On iOS I managed to hack together a workable gesture recognizer renderer by creating a custom ContentView and a custom renderer for it, which then attaches native gesture recognizers to itself based on the GestureRecognizers elements. To do that I disable the default EventTracker and implement my own, with overridden GetNativeRecognizer method
in the custom renderer:
public InteractiveContentViewRenderer () : base ()
{
AutoTrack = false;
events = new InteractiveEventTracker (this);
}
in the custom event tracker:
public InteractiveEventTracker (IVisualElementRenderer renderer) : base (renderer)
{
this.Renderer = renderer;
}
protected override MonoTouch.UIKit.UIGestureRecognizer GetNativeRecognizer (Xamarin.Forms.IGestureRecognizer recognizer)
{
var gestureRecognizer = base.GetNativeRecognizer (recognizer);
if (gestureRecognizer == null) {
// here I find my own native recognizer and return it
}
}
On Android, however, so far I haven't figured out how to achieve the same thing. There's no EventTracker in Android, I think I'll have to implement some Android View for this to work but I haven't figured it out so far.
Has anyone managed to hack together touch events in Xamarin.Forms for Android? I'd like to know at least the basic structure of the hack?
Read this: http://blog.twintechs.com/cross-platform-compositional-gesture-advanced-xamarin-forms-techniques-for-flexible-and-performant-cross-platform-apps-part-4
There's a lot about custom gestures in Xamarin.Forms
The source is here: https://github.com/twintechs/TwinTechsFormsLib/tree/master/TwinTechsForms/TwinTechsForms.Droid/TwinTechs/Gestures

Resources