自定義視圖ActionBar.Tab不能正確顯示

Question

我目前有一個使用標籤導航實現的actionBar，並且現在想要自定義標籤本身。我爲每個選項卡創建了一個自定義XML佈局，使其具有textview和可單擊的ImageButton，並使用ActionBar.Tab.setCustomView對其進行設置。問題是沒有任何佈局的屬性似乎有任何影響（如對齊）。任何幫助，將不勝感激！

這裏是在什麼產生的圖像：Image of what is being produced

我的自定義標籤佈局XML文件

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="horizontal" > 
<TextView 
    android:id="@+id/tab_title" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:layout_centerHorizontal="true" 
    android:layout_centerVertical="true" 
    /> 
<ImageButton 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:layout_centerVertical="true" 
    android:src="@drawable/ic_action_refresh"/> 

</RelativeLayout> 

動作條代碼：

final ActionBar actionBar = getActionBar(); 

      //Because there is no 'parent' when navigating from the action bar, the home button for the Action Bar is disabled.  
      actionBar.setHomeButtonEnabled(false); 

      //Specify that the actionBar will include a tabbed navigation 
      actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 


     // Setting up the ViewPager rowingViewPager, attaching the RowingFragmentPagerAdapter and setting up a listener for when the 
     // user swipes between sections. 
      rowViewPager = (ViewPager) findViewById(R.id.pager); 
      rowViewPager.setAdapter(rowAdapter); 
      rowViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() 
      { 
       @Override 
       public void onPageSelected(int position) 
       { 
        actionBar.setSelectedNavigationItem(position); 
       } 
      }); 


     // For loop to add tabs for each fragment to the actionBar 
      for (int tab_counter = 0; tab_counter < rowAdapter.getCount(); tab_counter++) 
      { 
       Tab new_tab = actionBar.newTab(); 
       new_tab.setCustomView(R.layout.custom_tab); 
       TextView tab_title = (TextView) new_tab.getCustomView().findViewById(R.id.tab_title); 
       tab_title.setText(rowAdapter.getTabTitle(tab_counter)); 
       new_tab.setTabListener(this); 
       // Add tab with specified text as well as setting this activity as the TabListener. 
       actionBar.addTab(new_tab); 


      } 

     rowViewPager.setOffscreenPageLimit(2); //Sets the number of off-screen fragments to store and prevent re-load. Will increase if future fragments are added. 
    } 

Answer 1

問題就出在沒有自定義動作條佈局本身，而是改變風格。默認的ActionBar有一個屬性，其左側和右側的填充是16dp。你可以在你的標籤佈局中做任何你想要的，但是它不會覆蓋這個。

爲此，我簡單地在ActionBar選項卡的styles.xml中編寫了一個新樣式，其中我覆蓋了該填充並將其應用於應用程序主題中的actionBarTabStyle屬性。這是我的新styles.xml顯示更改。

<resources> 

    <!-- 
     Base application theme, dependent on API level. This theme is replaced 
     by AppBaseTheme from res/values-vXX/styles.xml on newer devices. 
    --> 
    <style name="AppBaseTheme" parent="android:Theme.Light"> 
     <!-- 
      Theme customizations available in newer API levels can go in 
      res/values-vXX/styles.xml, while customizations related to 
      backward-compatibility can go here. 
     --> 
    </style> 

    <!-- Application theme. --> 
    <style name="AppTheme" parent="AppBaseTheme"> 
     <!-- All customizations that are NOT specific to a particular API-level can go here. --> 
     <item name="android:actionBarTabStyle">@style/ActionBarTabStyle</item> 
    </style> 


    <style name="ActionBarTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabView"> 
    <item name="android:paddingLeft">0dp</item> 
    <item name="android:paddingRight">0dp</item> 
</style> 

</resources> 

Answer 2

它非常簡單只是從您的自定義視圖中刪除的ImageView和它/添加爲繪製頂部/左/右下角爲TextView的

即

<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:drawableTop="@drawable/your_img" 
    android:text="Tab1" 
    />