需要帮助创建一个自定义TabHost

Question

我想创建一个标签（可能使用TabHost）的活动，看起来是这样的：

这种布局也有一些按钮，复选框和一个gridview，但我最感兴趣的找出我怎么会有我的标签是这样的，因为默认情况下，他们是这个样子：

我的问题是，我不知道如何做到这一点，我之前已经为一些UI组件绘制了drawable，但我认为这是不同的。

Answer 1

经过相当一段时间，我已经想通过尝试很多不同的方式来制作标签，我终于找到了使用带有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> 

的MainActivity.java：

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

TabLayout1（TabL ayout2是相同的，但使用shape2）

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

形状仅仅是红色和蓝色的矩形，和片段默认 空片段用相同的颜色作为背景的形状。