title: ViewPager shows views on top of each other
body: <p>I am trying to implement a ViewPager, but currently it renders all the views on one screen, and when moving to the next it is empty it contains all the content. I have a feeling it has to do with the Fragment within Fragment or so, but I cannot figure it out. </p>
  
  <p>In the screenshot below you can kind of see it:</p>
  
  <p><img src="https://i.stack.imgur.com/K1Lsb.png" alt="enter image description here"></p>
  
  <p>This is (part) of the code. (ArticlePagerAdapter is just an implementation of the proto to look up that specific object type).</p>
  
  <pre><code>public abstract class PrototypePagerActivity&lt;T extends GenericModel&gt; extends BaseActivity {
  
      PrototypePagerAdapter mAdapter;
      ViewPager mPager;
  
      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          setContentView(R.layout.activity_proto_pager);
  
          long categoryId = -1;
          int articlePos = 0;
  
          Bundle extras = getIntent().getExtras();
          if (extras != null) {
              //if (extras.containsKey("articleId")) articleId = extras.getInt("articleId");
              if (extras.containsKey("position")) articlePos = extras.getInt("position");
              if (extras.containsKey("categoryId")) categoryId = extras.getLong("categoryId");
          }
          mAdapter = new ArticlePagerAdapter(categoryId,getSupportFragmentManager());
          mPager = (ViewPager) findViewById(R.id.protoPager);
          mPager.setAdapter(mAdapter);
  
          mPager.setCurrentItem(articlePos);
      }
  
  }
  
  public abstract class PrototypePagerAdapter&lt;T extends GenericModel&gt; extends FragmentPagerAdapter {
  
      @Override
      public Fragment getItem(int position) {
          try {
              T object = getObjectForPosition(position);
  
              ArticleFragment articleFragment = new ArticleFragment();
              Bundle args = new Bundle();
              args.putLong("articleId", object.getId());
              articleFragment.setArguments(args);
              return articleFragment;
          } catch (Exception e) {
              Log.w(iDomsAndroidApp.TAG, "Problem getting the object instance for pages", e);
              return null;
          }
      }
  
      public abstract T getObjectForPosition(int position) throws Exception;
  
      @Override
      public int getCount() {
          return requestObjectCount();
      }
  
      public abstract int requestObjectCount();
  
  }
  
  public class ArticleFragment extends Fragment {   
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container,
                               Bundle savedInstanceState) {
          View view = inflater.inflate(R.layout.fragment_article, container, false);
  
          if (savedInstanceState == null) {
              getFragmentManager().beginTransaction()
                      .add(R.id.content_fragment, new PlaceholderFragment())
                      .commit();
          }
  
          ArticleHeaderFragment articleHeaderFragment = new ArticleHeaderFragment();
          articleHeaderFragment.setArguments(getArguments());
          getFragmentManager().beginTransaction().add(R.id.header_fragment, articleHeaderFragment).commit();
  
          ArticleContentFragment articleContentFragment = ArticleContentFragment.newInstance();
          articleContentFragment.setArguments(getArguments());
          getFragmentManager().beginTransaction().add(R.id.content_fragment, articleContentFragment).commit();
  
          return view;
      }    
  }
  </code></pre>
  
  <p>activity_proto_pager.xml:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:orientation="vertical"
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;android.support.v4.view.ViewPager
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:id="@+id/protoPager" /&gt;
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p>fragment_article.xml:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  
  &lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"&gt;
  
      &lt;ImageView
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:id="@+id/imageView"
          android:src="@drawable/background"
          android:scaleType="centerCrop"
          android:contentDescription="@string/background_image"
          android:alpha="0.6" /&gt;
  
      &lt;ScrollView
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:scrollbars="vertical"&gt;
  
          &lt;LinearLayout
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content"&gt;
  
              &lt;FrameLayout
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:id="@+id/audio_control_fragment" /&gt;
  
              &lt;FrameLayout
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:id="@+id/header_fragment" /&gt;
  
              &lt;FrameLayout
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:id="@+id/content_fragment" /&gt;
          &lt;/LinearLayout&gt;
      &lt;/ScrollView&gt;
  
  
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>fragment_article_header.xml</p>
  
  <pre><code>&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:orientation="vertical"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:background="@color/list_background_overlay"
      android:layout_centerInParent="true"
      tools:context="org.idoms.iDomsAndroid.fragments.ArticleHeaderFragment"&gt;
  
      &lt;org.idoms.iDomsAndroid.views.ResizableImageView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:maxHeight="200dp"
          android:id="@+id/article_imageView"
          android:layout_gravity="center_horizontal"
          android:scaleType="centerCrop" /&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>