将滑动标签与工具栏一起使用
Using Sliding Tabs with Toolbar
我已经开始从使用 ActionBarActivity 更改为 AppCompatActivity，但我也开始使用 Toolbar 而不是标准 ActionBar。
但是，在我的一个具有滑动选项卡布局类型的活动中，以下行似乎已被弃用：
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
虽然我已经在 Stack Overflow 上查看了一些关于此的其他答案，但是否有任何内置方法可以更改它以支持使用 Toolbar。如果是这样，你能具体解释一下我将如何改变它吗？如何更改 onTabSelected 等已弃用的方法？
此外，我注意到 Google Play 音乐应用在选项卡下方有一个看起来像扩展的 toolbar/section（参见 this image for what I am talking about）。我怎样才能拥有那种类型的布局？
提前致谢。
所以经过几天的大量研究，并查看 GitHub，我终于设法解决了我的问题。
使用 AppCompatActivity 将 ActionBar 选项卡更新为 Toolbar 选项卡的步骤：
更新：2015 年 5 月 29 日星期五之后：
幸运的是，自从 Android 设计支持库 在 Google I/O 2015.
我们不再需要下载自定义视图 类，这是 Google 很久以前就应该做的事情。
来自Android Developers' Blogspot post on the Android Design Support Library:
Tabs:
Switching between different views in your app via tabs is not a new concept to material design and they are equally at home as a top level navigation pattern or for organizing different groupings of content within your app (say, different genres of music).
The Design library’s TabLayout implements both fixed tabs, where the view’s width is divided equally between all of the tabs, as well as scrollable tabs, where the tabs are not a uniform size and can scroll horizontally. Tabs can be added programmatically:
TabLayout tabLayout = ...;
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
However, if you are using a ViewPager for horizontal paging between tabs, you can create tabs directly from your PagerAdapter’s getPageTitle() and then connect the two together using setupWithViewPager(). This ensures that tab selection events update the ViewPager and page changes update the selected tab.
2015 年 GoogleI/O 之前：
首先，我在 GitHub 上从 Google 的 I/O 会议应用程序下载了 SlidingTabLayout.java and SlidingTabStrip.java 文件。这些将是将在选项卡布局中使用的视图，因此我创建了一个包含我的其他 Java 活动的文件夹，名为 'view' 并将它们放在那里。
接下来，我将 activity 布局 .xml 编辑为如下所示：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="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="com.mycompany.myapp.MyActivity" >
<!-- This is the Toolbar with the tabs underneath -->
<LinearLayout android:id="@+id/detail_headerBar"
style="@style/HeaderBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include android:id="@+id/detail_toolbar" layout="@layout/toolbar" />
<com.mycompany.myapp.view.SlidingTabLayout
android:id="@+id/sliding_tabs"
android:background="?attr/colorPrimary"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<!-- This is the ViewPager (which I had used before) and
it would be responsible for the swiping to change layouts -->
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/detail_headerBar"
android:layout_above="@+id/detail_adView" />
<!-- I also had an AdView in my layout,
but this is not necessary for creating tab layouts -->
<com.google.android.gms.ads.AdView
android:id="@+id/detail_adView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="@string/banner_ad_unit_id" >
</com.google.android.gms.ads.AdView>
</RelativeLayout>
引用 Toolbar (<include android:id="@+id/detail_toolbar" layout="@layout/toolbar" />) 的行引用了以下布局（对于那些还不确定如何使用 Toolbar 的人）：
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
并且在上面的两个 .xml 布局文件中，?attr/colorPrimary 指的是我的应用程序的主要颜色（我在样式中定义了它）。
另外，在第一个布局中，我提到的@style/HeaderBar样式指的是：
<style name="HeaderBar">
<item name="android:background">?colorPrimary</item>
<item name="android:elevation">4dp</item>
<!-- You may have to override this in a v21 version of this file -->
</style>
在我开始设置 Java 中的布局之前，我必须确保更改 SlidingTabLayout.java 和 SlidingTabStrip.java 中对应于它们放置位置的包名称。就我而言，我在这两个文件中都使用了：package com.mycompany.myapp.view;。
现在，在我的 Activity（扩展 AppCompatActivity）中，我首先在 onCreate 方法中添加了以下内容：
Toolbar toolbar = (Toolbar) findViewById(R.id.detail_toolbar);
setSupportActionBar(toolbar);
这将负责显示 Toolbar。
然后我设置 ViewPager 和 SlidingTabLayout 部分：
mViewPager = (ViewPager) findViewById(R.id.view_pager);
mViewPager.setAdapter(new ViewPagerAdapter(getSupportFragmentManager()));
mSlidingTabLayout = (SlidingTabLayout) findViewById(R.id.sliding_tabs);
mSlidingTabLayout.setSelectedIndicatorColors(getResources().getColor(R.color.tab_line));
mSlidingTabLayout.setDistributeEvenly(true);
mSlidingTabLayout.setViewPager(mViewPager);
颜色“tab_line”是我在 color.xml 中声明的颜色，这将是制表符线指示器的颜色。另请注意，上面的变量是我之前在 activity:
中定义的全局变量
SlidingTabLayout mSlidingTabLayout;
ViewPager mViewPager;
最后要做的是设置 ViewPagerAdapter，我称之为 eariler。这将负责根据选择的选项卡更改页面。我使用了以下内容：
public class ViewPagerAdapter extends FragmentPagerAdapter {
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public int getCount() {
// Returns the number of tabs
return 3;
}
@Override
public Fragment getItem(int position) {
// Returns a new instance of the fragment
switch (position) {
case 0:
return new FragmentOne();
case 1:
return new FragmentTwo();
case 2:
return new FragmentThree();
}
return null;
}
@Override
public CharSequence getPageTitle(int position) {
Locale l = Locale.getDefault();
switch (position) {
case 0:
return getString(R.string.title_section1).toUpperCase(l);
case 1:
return getString(R.string.title_section2).toUpperCase(l);
case 2:
return getString(R.string.title_section3).toUpperCase(l);
}
return null;
}
}
对于从 ActionBarActivity 切换到 AppCompatActivity 并开始使用 Toolbar 而不是像我一样遇到同样问题的人，我希望这是一个足够彻底的答案ActionBar。如果有什么不明白的，欢迎在下方留言。
我已经开始从使用 ActionBarActivity 更改为 AppCompatActivity，但我也开始使用 Toolbar 而不是标准 ActionBar。
但是，在我的一个具有滑动选项卡布局类型的活动中，以下行似乎已被弃用：
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
虽然我已经在 Stack Overflow 上查看了一些关于此的其他答案，但是否有任何内置方法可以更改它以支持使用 Toolbar。如果是这样，你能具体解释一下我将如何改变它吗？如何更改 onTabSelected 等已弃用的方法？
此外，我注意到 Google Play 音乐应用在选项卡下方有一个看起来像扩展的 toolbar/section（参见 this image for what I am talking about）。我怎样才能拥有那种类型的布局？
提前致谢。
所以经过几天的大量研究，并查看 GitHub，我终于设法解决了我的问题。
使用 AppCompatActivity 将 ActionBar 选项卡更新为 Toolbar 选项卡的步骤：
更新：2015 年 5 月 29 日星期五之后：
幸运的是，自从 Android 设计支持库 在 Google I/O 2015.
我们不再需要下载自定义视图 类，这是 Google 很久以前就应该做的事情。
来自Android Developers' Blogspot post on the Android Design Support Library:
Tabs:
Switching between different views in your app via tabs is not a new concept to material design and they are equally at home as a top level navigation pattern or for organizing different groupings of content within your app (say, different genres of music).
The Design library’s TabLayout implements both fixed tabs, where the view’s width is divided equally between all of the tabs, as well as scrollable tabs, where the tabs are not a uniform size and can scroll horizontally. Tabs can be added programmatically:
TabLayout tabLayout = ...;
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));However, if you are using a ViewPager for horizontal paging between tabs, you can create tabs directly from your PagerAdapter’s getPageTitle() and then connect the two together using
setupWithViewPager(). This ensures that tab selection events update the ViewPager and page changes update the selected tab.
2015 年 GoogleI/O 之前：
首先，我在 GitHub 上从 Google 的 I/O 会议应用程序下载了 SlidingTabLayout.java and SlidingTabStrip.java 文件。这些将是将在选项卡布局中使用的视图，因此我创建了一个包含我的其他 Java 活动的文件夹，名为 'view' 并将它们放在那里。
接下来，我将 activity 布局 .xml 编辑为如下所示：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="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="com.mycompany.myapp.MyActivity" >
<!-- This is the Toolbar with the tabs underneath -->
<LinearLayout android:id="@+id/detail_headerBar"
style="@style/HeaderBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include android:id="@+id/detail_toolbar" layout="@layout/toolbar" />
<com.mycompany.myapp.view.SlidingTabLayout
android:id="@+id/sliding_tabs"
android:background="?attr/colorPrimary"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<!-- This is the ViewPager (which I had used before) and
it would be responsible for the swiping to change layouts -->
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/detail_headerBar"
android:layout_above="@+id/detail_adView" />
<!-- I also had an AdView in my layout,
but this is not necessary for creating tab layouts -->
<com.google.android.gms.ads.AdView
android:id="@+id/detail_adView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="@string/banner_ad_unit_id" >
</com.google.android.gms.ads.AdView>
</RelativeLayout>
引用 Toolbar (<include android:id="@+id/detail_toolbar" layout="@layout/toolbar" />) 的行引用了以下布局（对于那些还不确定如何使用 Toolbar 的人）：
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
并且在上面的两个 .xml 布局文件中，?attr/colorPrimary 指的是我的应用程序的主要颜色（我在样式中定义了它）。
另外，在第一个布局中，我提到的@style/HeaderBar样式指的是：
<style name="HeaderBar">
<item name="android:background">?colorPrimary</item>
<item name="android:elevation">4dp</item>
<!-- You may have to override this in a v21 version of this file -->
</style>
在我开始设置 Java 中的布局之前，我必须确保更改 SlidingTabLayout.java 和 SlidingTabStrip.java 中对应于它们放置位置的包名称。就我而言，我在这两个文件中都使用了：package com.mycompany.myapp.view;。
现在，在我的 Activity（扩展 AppCompatActivity）中，我首先在 onCreate 方法中添加了以下内容：
Toolbar toolbar = (Toolbar) findViewById(R.id.detail_toolbar);
setSupportActionBar(toolbar);
这将负责显示 Toolbar。
然后我设置 ViewPager 和 SlidingTabLayout 部分：
mViewPager = (ViewPager) findViewById(R.id.view_pager);
mViewPager.setAdapter(new ViewPagerAdapter(getSupportFragmentManager()));
mSlidingTabLayout = (SlidingTabLayout) findViewById(R.id.sliding_tabs);
mSlidingTabLayout.setSelectedIndicatorColors(getResources().getColor(R.color.tab_line));
mSlidingTabLayout.setDistributeEvenly(true);
mSlidingTabLayout.setViewPager(mViewPager);
颜色“tab_line”是我在 color.xml 中声明的颜色，这将是制表符线指示器的颜色。另请注意，上面的变量是我之前在 activity:
SlidingTabLayout mSlidingTabLayout;
ViewPager mViewPager;
最后要做的是设置 ViewPagerAdapter，我称之为 eariler。这将负责根据选择的选项卡更改页面。我使用了以下内容：
public class ViewPagerAdapter extends FragmentPagerAdapter {
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public int getCount() {
// Returns the number of tabs
return 3;
}
@Override
public Fragment getItem(int position) {
// Returns a new instance of the fragment
switch (position) {
case 0:
return new FragmentOne();
case 1:
return new FragmentTwo();
case 2:
return new FragmentThree();
}
return null;
}
@Override
public CharSequence getPageTitle(int position) {
Locale l = Locale.getDefault();
switch (position) {
case 0:
return getString(R.string.title_section1).toUpperCase(l);
case 1:
return getString(R.string.title_section2).toUpperCase(l);
case 2:
return getString(R.string.title_section3).toUpperCase(l);
}
return null;
}
}
对于从 ActionBarActivity 切换到 AppCompatActivity 并开始使用 Toolbar 而不是像我一样遇到同样问题的人，我希望这是一个足够彻底的答案ActionBar。如果有什么不明白的，欢迎在下方留言。