Xamarin 视频播放器组件在 Android 上拉伸视频

Question

我有一个 Xamarin 表单项目，我需要在网格内显示视频，所以我购买了这个视频播放器组件：Octane VideoPlayer

它在 IOS 上运行良好，但在 android 中它不尊重纵横比，很多视频都被拉伸了。

我为此视频播放器尝试了自定义渲染，但没有任何变化，当我设置断点时，我发现渲染代码永远不会到达。

我错过了什么吗？

示例

cs:

   public partial class VideoPlayer : ContentPage
{
    public VideoPlayerPage()
    {

        InitializeComponent();
        VideoPlayer.Source = "16/9_video.mp4";
    }
}

自定义渲染：

[assembly: ExportRenderer(typeof(Octane.Xam.VideoPlayer.VideoPlayer), typeof(Assayil.Droid.VideoPlayerExtRenderer))]

**

public  class VideoPlayerExtRenderer : VideoPlayerRenderer
{

    protected override void OnElementChanged(ElementChangedEventArgs<VideoPlayer> e)
    {
        base.OnElementChanged(e);

        if (e.NewElement != null)
        {
            Control.Started += (s2, e2) =>
            {
                UpdateVideoSize();
                Control.Player.VideoSizeChanged += (s3, e3) => UpdateVideoSize();
            };
        }
    }

    protected override void OnLayout(bool changed, int l, int t, int r, int b)
    {
        base.OnLayout(changed, l, t, r, b);

        UpdateVideoSize();
    }

    private void UpdateVideoSize()
    {
        if (Element.FillMode == FillMode.Resize)
        {
            Control.Layout(0, 0, Width, Height);
            return;
        }

        // assume video size = view size if the player has not been loaded yet
        var videoWidth = Control.Player?.VideoWidth ?? Width;
        var videoHeight = Control.Player?.VideoHeight ?? Height;

        var scaleWidth = (double)Width / (double)videoWidth;
        var scaleHeight = (double)Height / (double)videoHeight;

        double scale;
        switch (Element.FillMode)
        {
            case FillMode.ResizeAspect:
                scale = Math.Min(scaleWidth, scaleHeight);
                break;
            case FillMode.ResizeAspectFill:
                scale = Math.Max(scaleWidth, scaleHeight);
                break;
            default:
                // should not happen
                scale = 1;
                break;
        }

        var scaledWidth = (int)Math.Round(videoWidth * scale);
        var scaledHeight = (int)Math.Round(videoHeight * scale);

        // center the video
        var l = (Width - scaledWidth) / 2;
        var t = (Height - scaledHeight) / 2;
        var r = l + scaledWidth;
        var b = t + scaledHeight;
        Control.Layout(l, t, r, b);
    }
}

Answer 1

将 VideoPlayer 放置在 Frame 中，然后将其放置在 StackLayout 中，为 VerticalOptions 设置为 CenterAndExpand 应该可以解决问题。完美适用于 Android，尽管您可能希望使其依赖于平台，它将在 iOS 中以容器大小播放（视频看起来不错，但如果没有此修复，控制器看起来会更好）。

Answer 2

我是组件的作者。这是一个众所周知的问题，我花了相当多的时间试图纠正它，但不幸的是我还没有找到一个稳定的解决方案。最常见的建议来自一个博客，该博客建议将 VideoView 包装在 RelativeLayout 中，如下所示，但这样做在我的测试期间没有任何改进。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <VideoView android:id="@+id/videoViewRelative"
         android:layout_alignParentTop="true"
         android:layout_alignParentBottom="true"
         android:layout_alignParentLeft="true"
         android:layout_alignParentRight="true"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent">
    </VideoView>

</RelativeLayout>

来源：http://blog.kasenlam.com/2012/02/android-how-to-stretch-video-to-fill.html

您在上面粘贴的代码是一种解决方法，对某些人来说效果很好，但我的测试再次表明它不够稳定，无法包含在内。一旦我能找到一个合适的解决方案，我一定会把它推给所有用户。