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

我是该组件的作者。这是一个众所周知的问题，我花了相当多的时间来纠正它，但不幸的是我还没有找到一个稳定的解决方案。最常见的建议来自一个博客，建议将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

您上面粘贴的代码是一种适用于某些人的解决方法，但同样，我的测试并没有表明它足够稳定以便包含在内。只要我能为此确定一个合适的解决方案，我一定会把它推给所有用户。

Answer 2

将VideoPlayer置于一个Frame中，然后将其置于StackLayout中设置为CenterAndExpand for VerticalOptions应该可以解决问题。适用于Android的完美工作虽然您可能希望使其与平台相关，但它将在iOS中使用容器大小（视频看起来很好，但如果没有此修复，控制器看起来会更好）。

Xamarin视频播放器组件可在Android上播放视频

2 个答案: