如何在ViewPager中切换布局

时间:2015-10-05 14:12:28

标签: java android android-layout android-viewpager

我正在研究Android应用程序,我想在具有不同内容的页面之间进行滑动。为此我使用ViewPager。这对我来说是新的,所以我以 Documentation为例。我的问题是我不知道如何将内容放在不同的页面上。简单地说 - 我如何在第一页上制作一些文字,在另一张图像上,以及在第三页上制作一个按钮? 它是通过不同的布局或其他方式实现的吗?

以下是我使用的代码:

SampleTabsStyled.java

public class SampleTabsStyled extends FragmentActivity {
private static final String[] CONTENT = new String[] { "Recent", "Artists", "Albums", "Songs", "Playlists", "Genres" };

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.simple_tabs);

    FragmentPagerAdapter adapter = new GoogleMusicAdapter(getSupportFragmentManager());

    ViewPager pager = (ViewPager)findViewById(R.id.pager);
    pager.setAdapter(adapter);

    TabPageIndicator indicator = (TabPageIndicator)findViewById(R.id.indicator);
    indicator.setViewPager(pager);
}

class GoogleMusicAdapter extends FragmentPagerAdapter {
    public GoogleMusicAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return TestFragment.newInstance(CONTENT[position % CONTENT.length]);
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return CONTENT[position % CONTENT.length].toUpperCase();
    }

    @Override
    public int getCount() {
        return CONTENT.length;
    }


  }
}

simple_tabs.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <com.viewpagerindicator.TabPageIndicator
        android:id="@+id/indicator"
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        />
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        />

</LinearLayout>

[UPDATE]

我编写了简单的TestFragment.java,它应该显示不同的布局。 问题在于行return TestFragment.newInstance();,我收到此错误

The method newInstance() is undefined for the type TestFragment

TestFragment.java

public class TestFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.activity_sideview, null);       
    } 
}

这是MainActivity.java

public class MainActivity extends FragmentActivity {
    private static final String[] CONTENT = new String[] { "Recent", "Artists", "Albums", "Songs", "Playlists", "Genres" };

    TestFragment TestFragment;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        TestFragment = new TestFragment();


        FragmentPagerAdapter adapter = new GoogleMusicAdapter(getSupportFragmentManager());

        ViewPager pager = (ViewPager)findViewById(R.id.pager);
        pager.setAdapter(adapter);

        TabPageIndicator indicator = (TabPageIndicator)findViewById(R.id.indicator);
        indicator.setViewPager(pager);
    }

    class GoogleMusicAdapter extends FragmentPagerAdapter {
        public GoogleMusicAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
            switch(position) {
            case 0:
                return TestFragment.newInstance();
            case 1:

            /*case 1:
                return ImageFragment.newInstance();
            case 2:
                return ButtonFragment.newInstance(); */
        }
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return CONTENT[position % CONTENT.length].toUpperCase();
        }

        @Override
        public int getCount() {
            return CONTENT.length;
        }
    }
}

3 个答案:

答案 0 :(得分:1)

你应该创建一个从fragment扩展的类。 然后重写返回视图的oncreateview方法。 在那里,你可以膨胀一个自定义,例如,首先你膨胀布局,其中有文字在第二,你膨胀有图像和....的布局。

要知道哪个布局应该膨胀,你可以将位置传递给新的实例方法。

并且在fragment类中你可以有一个显示页面位置的字段。你在新实例中实例化它并在oncreateview中使用它

在适配器的每个getItem中,您可以创建片段类的新实例,并且可以使用片段的位置对其进行自定义。

希望它有用

已编辑:

这是你的片段类

public class MyFragment extends android.support.v4.app.Fragment {

public int position;

public static MyFragment newInstance(int position){
    MyFragment myFragment = new MyFragment();
    myFragment.setPosition(position);
    return new MyFragment();
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View fView;
    if(position == 0){
        fView = inflater.inflate(R.layout.text_layout);
    }else if(position == 1){
        fView = inflater.inflate(R.layout.image_layout);
    }else{
        fView = inflater.inflate(R.layout.button_layout);
        Button b = fView.findViewById(R.id.button)
    }
    return fView;
}

public void setPosition(int position) {
    this.position = position;
}
}

现在调用像这样的新实例MyFragment.newInstance(positoin);

答案 1 :(得分:1)

解决问题的关键是findall方法,每个页面使用相同的片段(logo = Label(..., text = AA_title[0], ...) ):

getItem(int position)

您可以为每个页面使用分隔的片段(例如,带文本的片段,带图像的片段等),而不是这种方法。

您的TestFragment方法应如下所示:

@Override
public Fragment getItem(int position) {
    return TestFragment.newInstance(CONTENT[position % CONTENT.length]);
}

答案 2 :(得分:0)

getItem应该返回指定位置的Fragment(这是一个页面)。我不确定您的代码的目的是什么?

@Override
public Fragment getItem(int position) {
    return TestFragment.newInstance(CONTENT[position % CONTENT.length]);
}

您应该为每个页面创建一个片段,并将其分配到一个位置,例如:

@Override
public Fragment getItem(int position) {
    switch(position)
    {
        case 0:
            return new MyFragment();
        case 1:
            return new MyFragment1();
        case 2:
            return new MyFragment2();
        //...
    }
}