ViewPager顯示彼此之間的視圖

Question

我試圖實現一個ViewPager，但目前它呈現所有的視圖在一個屏幕上，當移動到下一個它是空的它包含所有的內容。我有一種感覺，它與Fragment內的片段有關，但我無法弄清楚。

在下面你的截圖可以種看到它：

這是代碼的（部分）。 （ArticlePagerAdapter只是proto的實現來查找特定的對象類型）。

public abstract class PrototypePagerActivity<T extends GenericModel> 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<T extends GenericModel> 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; 
    }  
} 

activity_proto_pager.xml：

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.v4.view.ViewPager 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:id="@+id/protoPager" /> 
</LinearLayout> 

fragment_article.xml：

<?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"> 

    <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" /> 

    <ScrollView 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:scrollbars="vertical"> 

     <LinearLayout 
      android:orientation="vertical" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content"> 

      <FrameLayout 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/audio_control_fragment" /> 

      <FrameLayout 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/header_fragment" /> 

      <FrameLayout 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/content_fragment" /> 
     </LinearLayout> 
    </ScrollView> 


</RelativeLayout> 

fragment_article_header.xml

<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"> 

    <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" /> 

</LinearLayout> 

Answer 1

，就應該替換片段而不是相加的。

所以，與其.add(...)使用.replace(....)

更新：

你是在兩個更多的地方加入片段。請按照articleHeaderFragment和articleContentFragment的步驟操作。你可以（如果按照你的邏輯）加在其他部分代碼第二部分

更新2

你應該重新審視你的邏輯。像下面的代碼一樣，您要在​​中添加兩個片段。替換可以在這裏幫助，但你的代碼將是多餘的

if (savedInstanceState == null) { 
    getFragmentManager().beginTransaction() 
    .add(R.id.content_fragment, new PlaceholderFragment()) 
    .commit(); 
} 

ArticleContentFragment articleContentFragment = ArticleContentFragment.newInstance(); 
articleContentFragment.setArguments(getArguments()); 
getFragmentManager().beginTransaction().add(R.id.content_fragment, articleContentFragment).commit();