Android标签位于布局中间

时间:2015-07-14 20:57:10

标签: android android-layout android-tabhost android-tabs

在我的布局中间,我希望有2个标签可供选择,在屏幕的后半部分查看2个不同的列表。我怎么能这样做?

这是一张图片,展示了我希望实现的目标。此图像在屏幕中间有一个问题选项卡和一个答案选项卡。根据您选择的选项卡,它会显示不同的列表视图:

TabExample

我希望达到同样的目的。

我尝试使用TabHost小部件,但是对于我的生活我无法摆脱标题栏(我尝试选择没有标题栏的主题,尝试将清单中的主题设置为无标题栏一个)

我也尝试过制作操作栏标签,但这些标签位于屏幕顶部....

如何在屏幕中间创建标签,如图像中所示?

2 个答案:

答案 0 :(得分:3)

今天我必须这样做!我尝试使用PagerTabStrip,因为我认为如果TabLayout没有使用Toolbar,则无法使用TabLayout。事实证明我错了,甚至在Google iosched中使用了它。因此,您可以在任意位置添加ViewPager + TabLayout

我知道您想要制作一些非常自定义的标签,如果它们是按钮,则会更容易自定义,但在我看来,使用ViewPager + <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin"> <LinearLayout android:id="@+id/top_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" android:orientation="horizontal"></LinearLayout> <RelativeLayout android:id="@+id/bottom_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/top_layout" android:layout_weight="1"> <android.support.design.widget.TabLayout android:id="@+id/pager_header" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:minHeight="60dp" app:tabGravity="fill" app:tabIndicatorColor="@color/colorAccentSecondary" app:tabMode="fixed" app:tabSelectedTextColor="@color/colorAccentSecondary" app:tabTextAppearance="@style/TournamentWaitingTimerTabTextAppearance" /> <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/pager_header"></android.support.v4.view.ViewPager> </RelativeLayout> </LinearLayout> 会更好它使事情更具可扩展性。

activity_main.xml中

public class MainActivity extends AppCompatActivity {

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

        // Locate the viewpager in activity_main.xml
        ViewPager viewPager = (ViewPager) findViewById(R.id.pager);

        // Set the ViewPagerAdapter into ViewPager
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        adapter.addFrag(new LeftFragment(), "Players");
        adapter.addFrag(new RightFragment(), "Prizes");

        viewPager.setAdapter(adapter);

        TabLayout mTabLayout = (TabLayout) findViewById(R.id.pager_header);
        mTabLayout.setupWithViewPager(viewPager);
    }

    class ViewPagerAdapter extends FragmentStatePagerAdapter {
        private final List<Fragment> mFragmentList = new ArrayList<>();
        private final List<String> mFragmentTitleList = new ArrayList<>();

        public ViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }

        @Override
        public Fragment getItem(int position) {
            return mFragmentList.get(position);
        }

        @Override
        public int getCount() {
            return mFragmentList.size();
        }

        public void addFrag(Fragment fragment, String title) {
            mFragmentList.add(fragment);
            mFragmentTitleList.add(title);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mFragmentTitleList.get(position);
        }
    }
}

MainActivity类:

 *** Error in `./BasicTimersTest': corrupted double-linked list: 0xb2808cf8 ***

您可以更改您使用的适配器,但这并不重要。

要自定义标签,我要查看this amazing tutorial

答案 1 :(得分:0)

您可以尝试将ViewPagerPagerTabStrip

一起使用

您可以通过实施FragmentPagerAdapter

将片段添加为页面标签

在布局xml文件中,您应该能够像在大多数其他组件中一样将ViewPager移动到布局中的任何位置。我没有尝试过居中,但我把它放在它上面和下面,它的行为与你期望的一样。

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
                                   android:id="@+id/pager"
                                   android:layout_width="match_parent"
                                   android:layout_height="match_parent" >

    <android.support.v4.view.PagerTabStrip
        android:id="@+id/pager_header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"


</android.support.v4.view.ViewPager>

FragmentPagerAdapter示例

 public class FragmentPagerAdapter extends android.support.v4.app.FragmentPagerAdapter
{
    final int PAGE_COUNT = 2;

    private final String[] PAGE_TITLES =
            {
                    "Fragment1",
                    "Fragment2"
            };

    public FragmentPagerAdapter()
    {
        super(getSupportFragmentManager());
    }

    @Override
    public int getCount()
    {
        return PAGE_COUNT;
    }

    @Override
    public CharSequence getPageTitle(int position)
    {
        return PAGE_TITLES[position];
    }

    @Override
    public Fragment getItem(int position)
    {
        switch(position)
        {
            case 0:
                return new Fragment1();
            case 1:
                return new Fragment2();
            default:
                return null;
        }

    }
}

并在您的主要活动中:

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

...    
        mCustomPagerAdapter = new FragmentPagerAdapter();
        mViewPager = (ViewPager) findViewById(R.id.pager);
        mViewPager.setAdapter(mCustomPagerAdapter);

...
    }