Настройка вкладок в ActionBar - ActionBarCompat

Question

Я хочу, чтобы достичь этого:

Но я не был в состоянии уменьшить высоту вкладок в ActionBarCompat. Высота моей вкладки в настоящее время по умолчанию.

Я читал, что если я уменьшу размер ActionBar, я могу уменьшить размер вкладок, и я пробовал это, но хочу, чтобы мой ActionBar оставался в своем обычном размере.

Я пробовал создавать пользовательские стили от Android Action Bar Style Generator, но это не помогло мне изменить высоту вкладок.

Это мой style.xml

<resources xmlns:android="http://schemas.android.com/apk/res/android"> 

    <style name="Theme.Musclemonster" parent="@style/Theme.AppCompat.Light.DarkActionBar"> 
     <item name="actionBarItemBackground">@drawable/selectable_background_musclemonster</item> 
     <item name="popupMenuStyle">@style/PopupMenu.Musclemonster</item> 
     <item name="dropDownListViewStyle">@style/DropDownListView.Musclemonster</item> 
     <item name="actionBarTabStyle">@style/Theme.Musclemonster.TabsStyle</item> 
     <item name="actionDropDownStyle">@style/DropDownNav.Musclemonster</item> 
     <item name="actionBarStyle">@style/ActionBar.Solid.Musclemonster</item> 
     <item name="actionModeBackground">@drawable/cab_background_top_musclemonster</item> 
     <item name="actionModeSplitBackground">@drawable/cab_background_bottom_musclemonster</item> 
     <item name="actionModeCloseButtonStyle">@style/ActionButton.CloseMode.Musclemonster</item> 
     <item name="actionBarTabTextStyle">@style/Theme.Musclemonster.TabsTextStyle</item> 

     <!-- Light.DarkActionBar specific --> 
     <item name="actionBarWidgetTheme">@style/Theme.Musclemonster.Widget</item> 
    </style> 

    <style name="ActionBar.Solid.Musclemonster" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse"> 
     <item name="background">@drawable/ab_solid_musclemonster</item> 
     <item name="backgroundStacked">@drawable/ab_stacked_solid_musclemonster</item> 
     <item name="backgroundSplit">@drawable/ab_bottom_solid_musclemonster</item> 
     <item name="progressBarStyle">@style/ProgressBar.Musclemonster</item> 
    </style> 

    <style name="ActionBar.Transparent.Musclemonster" parent="@style/Widget.AppCompat.ActionBar"> 
     <item name="background">@drawable/ab_transparent_musclemonster</item> 
     <item name="progressBarStyle">@style/ProgressBar.Musclemonster</item> 
    </style> 

    <style name="PopupMenu.Musclemonster" parent="@style/Widget.AppCompat.PopupMenu"> 
     <item name="android:popupBackground">@drawable/menu_dropdown_panel_musclemonster</item> 
    </style> 

    <style name="DropDownListView.Musclemonster" parent="@style/Widget.AppCompat.ListView.DropDown"> 
     <item name="android:listSelector">@drawable/selectable_background_musclemonster</item> 
    </style> 

    <style name="ActionBarTabStyle.Musclemonster" parent="@style/Widget.AppCompat.ActionBar.TabView"> 
     <item name="android:background">@drawable/tab_indicator_ab_musclemonster</item> 
    </style> 

    <style name="DropDownNav.Musclemonster" parent="@style/Widget.AppCompat.Spinner.DropDown.ActionBar"> 
     <item name="android:background">@drawable/spinner_background_ab_musclemonster</item> 
     <item name="android:popupBackground">@drawable/menu_dropdown_panel_musclemonster</item> 
     <item name="android:dropDownSelector">@drawable/selectable_background_musclemonster</item> 
    </style> 

    <style name="ProgressBar.Musclemonster" parent="@style/Widget.AppCompat.ProgressBar.Horizontal"> 
     <item name="android:progressDrawable">@drawable/progress_horizontal_musclemonster</item> 
    </style> 

    <style name="ActionButton.CloseMode.Musclemonster" parent="@style/Widget.AppCompat.ActionButton.CloseMode"> 
     <item name="android:background">@drawable/btn_cab_done_musclemonster</item> 
    </style> 

    <!-- this style is only referenced in a Light.DarkActionBar based theme --> 
    <style name="Theme.Musclemonster.Widget" parent="@style/Theme.AppCompat"> 
     <item name="popupMenuStyle">@style/PopupMenu.Musclemonster</item> 
     <item name="dropDownListViewStyle">@style/DropDownListView.Musclemonster</item> 
    </style> 

    <!-- This style is for tabs --> 
    <style name="Theme.Musclemonster.TabsStyle" parent="@style/Widget.AppCompat.Base.ActionBar.TabView"> 
     <item name="android:background">@drawable/tabbackground</item> 
    </style> 

    <style name="Theme.Musclemonster.TabsTextStyle" parent="@style/Widget.AppCompat.Base.ActionBar.TabText"> 
     <item name="android:textColor">@android:color/white</item> 
    </style> 

</resources> 

Это было сгенерировано Бар генератора Стиль действий. Я пробовал много ссылок от Google. Сейчас у меня есть около 20 вкладок, открытых в моем Google Chrome. Если я пропустил любой, любезно сообщите мне. Или просто дайте мне знать, как я могу достичь этого стиля вкладок. Благодаря!

Answer 1

Что вам нужно, это ViewPager с контролем заголовка вместо вкладок, посмотрите здесь tutorial и загрузите sample app, чтобы настроить его.

<android.support.v4.view.ViewPager 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/pager" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<android.support.v4.view.PagerTitleStrip 
    android:id="@+id/pager_title_strip" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="top" 
    android:background="#33b5e5" 
    android:textColor="#fff" 
    android:paddingTop="4dp" 
    android:paddingBottom="4dp" /> 

Надеется, что это помогло!