2017-08-01 48 views
1

我目前正在Xamarin.Android中處理應用程序。 在這個應用程序中,我使用了幾個ViewPagers,並且從昨天開始我從來沒有任何問題。Xamarin.Android - ViewPager內部視頻邊上的垂直黑條

在我的應用程序開始時,我得到了一種動畫之旅,這是一個包含ViewPager的簡單活動,它使用4個片段(每個片段都有一個視頻),因此我們可以水平滾動以進一步在巡演中。下面你可以看到它的截圖: enter image description here

但我有一個問題發生在所有Android設備上不在Android 7(Android 4和以前不支持,所以我的問題只發生在Android 5和6 )。當我在此ViewPager上水平滾動時,每個視頻的左側和右側會出現一些黑條。我想這不會發生在Android 7上,因爲操作系統可以更好地管理視頻。下面你有一個例子:

enter image description here

這裏我的視頻佔用屏幕空間的100%,但它發生也當視頻是小,我減少了他們中的一個的大小來告訴你:

enter image description here

那些黑網吧不是固定的,我的意思是,他們隨機樣的在屏幕上移動,而我水平滾動。我把幾乎所有東西的背景顏色都改爲白色,但沒有任何效果。我真的認爲這是Android在移動屏幕上的視頻時遇到困難,而此視頻仍在播放。但是這非常難看,它提供了糟糕的用戶體驗,這對我和我的團隊來說能夠解決這個問題非常重要。

在這裏你的代碼,如果它可以幫助你:

animated_tour.axml(該axml的活動)

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/vp_animated_tour" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/white" /> 

AnimatedTourActivity.cs(Activity類)

[Activity(Label = "AnimatedTourActivity", Theme = "@style/AppTheme")] 
public class AnimatedTourActivity : AppCompatActivity 
{ 

    public AnimatedTourViewModel Vm 
    { 
     get 
     { 
      return App.Locator.AnimatedTour; 
     } 
    } 

    private ViewPager _viewPager; 

    public ViewPager ViewPager 
    { 
     get 
     { 
      return this._viewPager ?? (this._viewPager = this.FindViewById<ViewPager>(Resource.Id.vp_animated_tour)); 
     } 
    } 

    protected override void OnCreate(Bundle savedInstanceState) 
    { 
     SetContentView(Resource.Layout.animated_tour); 
     base.OnCreate(savedInstanceState); 

     Window.SetFlags(Android.Views.WindowManagerFlags.Fullscreen, Android.Views.WindowManagerFlags.Fullscreen); 

     // On bloque en mode portrait 
     RequestedOrientation = Android.Content.PM.ScreenOrientation.Portrait; 
     this.ViewPager.Adapter = new AnimatedTourAdapter(this.SupportFragmentManager); 

     if (Android.OS.Build.VERSION.SdkInt <= BuildVersionCodes.Lollipop) 
      this.ViewPager.OffscreenPageLimit = 1; 
     else 
      this.ViewPager.OffscreenPageLimit = 3; 
    } 
} 

用於片四個AXML文件的一個包含視頻

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/white"> 
    <FrameLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
     <FrameLayout 
      android:id="@+id/placeholder" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:background="@color/white" /> 
     <VideoView 
      android:id="@+id/vv_animated_tour_2" 
      android:layout_gravity="center" 
      android:layout_height="match_parent" 
      android:layout_width="match_parent" /> 
    </FrameLayout> 
    <LinearLayout 
     android:id="@+id/ll_animated_tour_description" 
     android:layout_marginTop="350dp" 
     android:orientation="vertical" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:gravity="center"> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:textSize="23dp" 
      android:fontFamily="fonts/AvenirLTStd-Book.otf" 
      android:textColor="@color/general_text_color_grey" 
      android:text="@string/animated_tour_family_management" /> 
     <TextView 
      android:layout_marginTop="15dp" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:paddingRight="33dp" 
      android:paddingLeft="33dp" 
      android:textSize="19.5dp" 
      android:fontFamily="fonts/AvenirLTStd-Book.otf" 
      android:textColor="@color/animated_tour_description" 
      android:text="@string/animated_tour_family_management_description" /> 
    </LinearLayout> 
    <ImageView 
     android:layout_alignParentBottom="true" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="100dp" 
     android:background="@drawable/DOTS_2" /> 
</RelativeLayout> 

AnimatedTourFragment.cs(常見的片段類)

public class AnimatedTourFragment : SupportV4.Fragment 
{ 
    static AnimatedTourFragment fragment; 

    private const string TEMPLATED_ANIMATED_TOUR_RESOURCE_ID = "resource_id"; 
    private const string TEMPLATED_ANIMATED_TOUR_VIDEO_RESOURCE_ID = "video_resource_id"; 
    private const string TEMPLATED_ANIMATED_TOUR_NUMBER = "number"; 


    public AnimatedTourFragment() 
    { 

    } 

    public static AnimatedTourFragment NewInstance(int number, int resourceId, int videoResourceId) 
    { 
     fragment = new AnimatedTourFragment(); 
     Bundle args = new Bundle(); 

     args.PutInt(TEMPLATED_ANIMATED_TOUR_RESOURCE_ID, resourceId); 
     args.PutInt(TEMPLATED_ANIMATED_TOUR_NUMBER, number); 
     args.PutInt(TEMPLATED_ANIMATED_TOUR_VIDEO_RESOURCE_ID, videoResourceId); 


     fragment.Arguments = args; 

     return fragment; 
    } 


    public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) 
    { 
     //return base.OnCreateView(inflater, container, savedInstanceState); 
     var resourceId = Arguments.GetInt(TEMPLATED_ANIMATED_TOUR_RESOURCE_ID, 0); 
     var number = Arguments.GetInt(TEMPLATED_ANIMATED_TOUR_NUMBER, 1); 
     var videoResourceId = Arguments.GetInt(TEMPLATED_ANIMATED_TOUR_VIDEO_RESOURCE_ID, 0); 

     var view = inflater.Inflate(resourceId, container, false); 

     var videoViewId = this.Activity.Resources.GetIdentifier(string.Format("vv_animated_tour_{0}", number), "id", this.Activity.PackageName); 

     var videoView = view.FindViewById<VideoView>(videoViewId); 
     videoView.SetOnPreparedListener(new VideoLoop()); 
     videoView.SetVideoURI(Android.Net.Uri.Parse("android.resource://" + this.Activity.PackageName + "/" + videoResourceId)); 
     videoView.Start(); 

     var goButton = view.FindViewById<Button>(Resource.Id.bt_animated_tour_go); 
     goButton?.SetCommand("Click", (this.Activity as AnimatedTourActivity).Vm.NavigateToHomeCommand); 

     return view; 
    } 

} 


public class VideoLoop : Java.Lang.Object, Android.Media.MediaPlayer.IOnPreparedListener 
{ 
    public void OnPrepared(MediaPlayer mp) 
    { 
     mp.Looping = true; 
    } 

} 

感謝您的幫助!

回答

1

VideoView延伸SurfaceViewSurfaceView的主要限制是它不是理想的翻譯,動畫和移動,這可能會導致您的問題。

你需要的是一個基於TextureView的視頻播放器。您可以嘗試搜索第三方庫。

或者你可以嘗試着自己來創建這樣的一個,這裏是你可以參考一些Java的資源:

Playing video on TextureView

TextureVideoView.java

+0

非常感謝!我使用了你放入答案的第一個鏈接,並將代碼從Java轉換爲C#。現在一切都很好! –