我正在尝试在我的 TabLayout 中设置两个选项卡。第一个选项卡用于显示配置文件,第二个选项卡用于显示 Activity 。我有 TabLayout 和 ViewPager 设置。我还创建了所需的适配器以将两个 fragment 链接到表格布局中。当我在手机上运行它时,确实会显示两个屏幕和选项卡,但它们不会显示在选项卡区域内 - 它们会掩盖实际的选项卡。我正在使用设计支持库 (v23.1.1)
我有一个带有 fragment 区域的主 Activity 文件,该 fragment 区域根据用户想要执行的操作更改 View 。
如何使选项卡内容显示在选项卡内部而不是显示在选项卡顶部?这是我的代码:
编辑:这是 profile_fragment.xml 文件(这是我希望出现标签的地方):
<RelativeLayout 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"
tools:context="Fragments.ProfileFragment">
<!-- TODO: Update blank fragment layout -->
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id = "@+id/ProfileTabLayout"
android:background="@color/colorPrimary"
app:tabGravity="fill"
app:tabMode="fixed"
app:tabTextColor="@color/colorIcons"
>
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id = "@+id/ProfilePager"
></android.support.v4.view.ViewPager>
user_profile_tab_layout.xml
<?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="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryLight"
android:layout_alignParentTop="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/person_profile"
android:layout_margin="5dp"/>
<TextView
style="@style/TextViewStyle"
android:id = "@+id/userTitleTextView"
android:textSize="24sp"
android:textStyle="bold"
android:text = "@string/sample_profile_nameSurname"
/>
<TextView
style="@style/TextViewStyle"
android:id = "@+id/UserTypeTextView"
android:text="@string/sample_user_type"
android:textStyle="bold|italic"
android:textSize="18dp"/>
<TextView
style="@style/EditTexStyle"
android:id = "@+id/profileDeatilsHead"
android:background="@color/colorPrimaryDark"
android:text="@string/sample_profile_details"
android:textColor="@color/colorIcons"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/club_reg_string"
android:id = "@+id/clubNameLabel"
android:layout_alignParentLeft="true"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/sample_club_string"
android:id = "@+id/clubNameText"
android:layout_toRightOf="@id/clubNameLabel"
android:layout_alignBaseline="@id/clubNameLabel"
android:layout_alignParentRight="true"
android:layout_margin="5dp"/>
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
ProfileFragment - 此 fragment 用于显示两个选项卡。
public class ProfileFragment extends Fragment {
private TabLayout profileTabLayout;
private ViewPager profileViewPager;
private ProfileViewPageAdapter profileViewPageAdapter;
public ProfileFragment() {
// Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View myView = inflater.inflate(R.layout.fragment_profile, container, false);
profileTabLayout = (TabLayout) myView.findViewById(R.id.ProfileTabLayout);
profileViewPager = (ViewPager) myView.findViewById(R.id.ProfilePager);
profileViewPageAdapter = new ProfileViewPageAdapter(getFragmentManager());
profileViewPageAdapter.addFragmentWithTitle(new UserProfileTabFragment(), "My Profile");
profileViewPageAdapter.addFragmentWithTitle(new UserActivityTabFragment(), "My Activity");
profileViewPager.setAdapter(profileViewPageAdapter);
profileTabLayout.setupWithViewPager(profileViewPager);
return myView;
}}
UserProfileTabLayout
public class UserProfileTabFragment extends Fragment {
public UserProfileTabFragment()
{
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View myView = inflater.inflate(R.layout.user_profile_tab_layout, container, false);
return myView;
}}
最佳答案
RelativeLayout 允许其子项重叠。 ViewPager 是第二个 child ,因此如果重叠,它将在顶部。它的高度没有任何限制,因此它占据了整个屏幕高度,因此它覆盖了 TabLayout。
最简单的解决方法是将 RelativeLayout 更改为 LinerLayout:
<LinearLayout
android:orientation="vertical"
... >
<TabLayout
android:layout_height="wrap_content"
... />
<ViewPager
android:layout_height="0dp"
android:layout_weight="1"
... />
</LinearLayout>
如果你想继续使用 RelativeLayout,你可以这样做:
<RelativeLayout ... >
<TabLayout
android:id="@+id/ProfileTabLayout"
android:layout_height="wrap_content"
... />
<ViewPager
android:layout_height="0dp"
android:layout_alignParentBottom="true"
android:layout_below="@+id/ProfileTabLayout"
... />
</RelativeLayout>
关于Android ViewPager 在 TabLayout 之上显示 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36366706/