无法将选项卡标题设置到顶部
Could not set the tab titles into the top
我用 ViewPager
创建了标签页。但是选项卡的标题出现在屏幕中央。我想将标题保留在屏幕顶部。请检查我的以下 xml 代码和 java 文件。请告诉我如何解决此问题。
这是 MainActivity
的 xml 文件:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="com.example.bright.myapplication.MainActivity">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:id="@+id/tablayout"
android:layout_below="@+id/toolbar">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Center" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right" />
</android.support.design.widget.TabLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_below="@+id/toolbar" />
</RelativeLayout>
以下是第一个片段的 xml 文件:
fragment_blank_fragment1.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.bright.myapplication.BlankFragment1">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 1" />
</FrameLayout>
以下是第二个片段的 xml 文件:
fragment_blank_fragment2.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.bright.myapplication.BlankFragment2">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 2" />
</FrameLayout>
and one more xml file for a fragment
以下是Activity
文件:
MainActivity.java
public class MainActivity extends AppCompatActivity {
TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = (TabLayout)findViewById(R.id.tablayout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager(),3);
ViewPager viewPager = (ViewPager)findViewById(R.id.viewpager);
viewPager.setAdapter(myAdapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
}
}
以下是我通过ViewPager
将片段返回到主activity的地方:
MyAdapter.java
public class MyAdapter extends FragmentStatePagerAdapter {
int tabcount;
public MyAdapter(FragmentManager fm, int count) {
super(fm);
tabcount = count;
}
@Override
public Fragment getItem(int position) {
switch (position){
case 0:
BlankFragment1 fragment1 = new BlankFragment1();
return fragment1;
case 1:
BlankFragment2 fragment2 = new BlankFragment2();
return fragment2;
case 2:
BlankFragment3 fragment3 = new BlankFragment3();
return fragment3;
default:
return null;
}
}
@Override
public int getCount() {
return tabcount;
}
}
您的 TabLayout
出现在屏幕中央的原因是您将 layout_height
设置为 match_parent
。 TabLayout
中项目的默认 gravity
是 center_vertical
。
我假设您想要按照 Material Design Guidelines 的标准外观和感觉的选项卡,在这种情况下,您的 MainActivity
的布局文件应该看起来更像这样:
<android.support.design.widget.CoordinatorLayout 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="wrap_content">
<android.support.design.widget.AppBarLayout android:id="@+id/app_bar"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="@+id/toolbar"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay/>
<android.support.design.widget.TabLayout android:id="@+id/tab_layout"
android:layout_width="match_parent" android:layout_height="wrap_content"
app:tabIndicatorColor="?attr/colorAccent">
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_left"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_center"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_right"/>
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.ViewPager android:id="@+id/pager"
android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
此外,还有一种使用 ViewPager
设置选项卡的便捷方法,而不是调用 viewPager.setOnPageChangeListener()
:
tabLayout.setupWithViewPager(viewPager);
我用 ViewPager
创建了标签页。但是选项卡的标题出现在屏幕中央。我想将标题保留在屏幕顶部。请检查我的以下 xml 代码和 java 文件。请告诉我如何解决此问题。
这是 MainActivity
的 xml 文件:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="com.example.bright.myapplication.MainActivity">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:id="@+id/tablayout"
android:layout_below="@+id/toolbar">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Center" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right" />
</android.support.design.widget.TabLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_below="@+id/toolbar" />
</RelativeLayout>
以下是第一个片段的 xml 文件:
fragment_blank_fragment1.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.bright.myapplication.BlankFragment1">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 1" />
</FrameLayout>
以下是第二个片段的 xml 文件:
fragment_blank_fragment2.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.bright.myapplication.BlankFragment2">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 2" />
</FrameLayout>
and one more xml file for a fragment
以下是Activity
文件:
MainActivity.java
public class MainActivity extends AppCompatActivity {
TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = (TabLayout)findViewById(R.id.tablayout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager(),3);
ViewPager viewPager = (ViewPager)findViewById(R.id.viewpager);
viewPager.setAdapter(myAdapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
}
}
以下是我通过ViewPager
将片段返回到主activity的地方:
MyAdapter.java
public class MyAdapter extends FragmentStatePagerAdapter {
int tabcount;
public MyAdapter(FragmentManager fm, int count) {
super(fm);
tabcount = count;
}
@Override
public Fragment getItem(int position) {
switch (position){
case 0:
BlankFragment1 fragment1 = new BlankFragment1();
return fragment1;
case 1:
BlankFragment2 fragment2 = new BlankFragment2();
return fragment2;
case 2:
BlankFragment3 fragment3 = new BlankFragment3();
return fragment3;
default:
return null;
}
}
@Override
public int getCount() {
return tabcount;
}
}
您的 TabLayout
出现在屏幕中央的原因是您将 layout_height
设置为 match_parent
。 TabLayout
中项目的默认 gravity
是 center_vertical
。
我假设您想要按照 Material Design Guidelines 的标准外观和感觉的选项卡,在这种情况下,您的 MainActivity
的布局文件应该看起来更像这样:
<android.support.design.widget.CoordinatorLayout 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="wrap_content">
<android.support.design.widget.AppBarLayout android:id="@+id/app_bar"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="@+id/toolbar"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay/>
<android.support.design.widget.TabLayout android:id="@+id/tab_layout"
android:layout_width="match_parent" android:layout_height="wrap_content"
app:tabIndicatorColor="?attr/colorAccent">
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_left"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_center"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="@string/tab_right"/>
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.ViewPager android:id="@+id/pager"
android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
此外,还有一种使用 ViewPager
设置选项卡的便捷方法,而不是调用 viewPager.setOnPageChangeListener()
:
tabLayout.setupWithViewPager(viewPager);