Android 需要创建自定义TabHost的帮助吗

我想创建一个带有选项卡的活动（可能使用TabHost），如下所示：

这个布局也有一些按钮、复选框和gridview，但我最感兴趣的是了解我的选项卡是什么样子的，因为默认情况下它们看起来像这样：

---

我的问题是，我不知道该怎么做，我以前为一些UI组件制作过绘图，但我认为这是不同的。

经过一段时间，我找到了如何得到我想要的东西，通过尝试许多不同的方式来制作标签，我最终使用了带有ViewPager的TabLayout

我做了一个概念证明，它看起来是这样的：

如果有人对代码感兴趣，这就是主要活动的布局

<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:weightSum="10">

    <View
        android:layout_width="0dp"
        android:layout_height="1dp"
        android:layout_weight="0.2"/>

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="4"
        app:tabMode="fixed"
        app:tabGravity="fill"
        app:tabPaddingStart="2dp"
        app:tabPaddingEnd="2dp"
        app:tabPaddingTop="2dp"/>

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="5.8"/>

</LinearLayout>

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

TabLayout1（TabLayout2相同，但使用shape2）

形状只是一个红色和蓝色的矩形，片段是默认的 与形状具有相同颜色背景的空碎片

import android.graphics.Color;
import android.net.Uri;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements FirstTabFragment.OnFragmentInteractionListener, SecondTabFragment.OnFragmentInteractionListener {

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

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
    ViewPager viewPager = (ViewPager) findViewById(R.id.pager);

    tabLayout.setSelectedTabIndicatorColor(Color.TRANSPARENT);

    viewPager.setAdapter(new SectionPagerAdapter(getSupportFragmentManager()));
    tabLayout.setupWithViewPager(viewPager);

    TabLayout.Tab tab = tabLayout.getTabAt(0);
    RelativeLayout relativeLayout = (RelativeLayout) LayoutInflater.from(this).inflate(R.layout.tab_layout_file1, tabLayout, false);
    TextView tabTextView = (TextView) relativeLayout.findViewById(R.id.tab_title);
    tabTextView.setText(tab.getText());
    tab.setCustomView(relativeLayout);

    TabLayout.Tab tab2 = tabLayout.getTabAt(1);
    RelativeLayout relativeLayout2 = (RelativeLayout) LayoutInflater.from(this).inflate(R.layout.tab_layout_file2, tabLayout, false);
    TextView tabTextView2 = (TextView) relativeLayout2.findViewById(R.id.tab_title);
    tabTextView2.setText(tab2.getText());
    tab2.setCustomView(relativeLayout2);

    tab.select();

}

@Override
public void onFragmentInteraction(Uri uri) {

}

public class SectionPagerAdapter extends FragmentPagerAdapter {

    public SectionPagerAdapter(FragmentManager fm) {
        super(fm);
    }

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

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

    @Override
    public CharSequence getPageTitle(int position) {
        switch (position) {
            case 0:
                return "First Tab";
            case 1:
            default:
                return "Second Tab";
        }
    }
}
}

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

<TextView
    android:id="@+id/tab_title"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="@drawable/shape1"
    android:textColor="@android:color/white"/>

</RelativeLayout>