black screen flickers on page changed in android

Question

I am implementing a slider in android using ViewPager, I am having a VideoView in each slide and I am playing the video in onPageSelected event of ViewPager. And I'm receiving black screen flicker in VideoView when I slide. here's my activity_main.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:id="@+id/relativeLayout"
android:background="#3f444c">

<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/indicator"
    />

<SurfaceView
    android:layout_width="0px"
    android:layout_height="0px"
    android:visibility="gone"/>

and here's my page.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:background="#3f444c">


<VideoView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/mainVideo"

    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:visibility="visible"
    />



<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text="Your research on the go"
    android:id="@+id/txtTitle"
    android:textColor="#ffffff"
    android:layout_below="@+id/mainVideo"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="53dp" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceMedium"
    android:text="Create a complete research library with article PDFs and attachments"
    android:id="@+id/txtParagragh"
    android:textColor="#ffffff"
    android:layout_below="@+id/txtTitle"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:textAlignment="center" />

I've also applied the solutions in these links:Dummy SurfaceView solution, Placeholder framelayout solution

Nothing worked for me, please help.