默认样式无法用于ViewPagerIndicator的TabPageIndicator。为什么会这样，如何解决？

Question

不必解释问题，我直接展示给你看：

你可以看到选项卡标题全部挤在一起，完全没有样式。它们的功能是正确的，可以通过滑动切换标签（尽管除了适当位置的移动外没有可见指示），并且点击标签会切换视图，但所有样式都缺失。以下是代码：

gallerylists.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" >

  <com.viewpagerindicator.TabPageIndicator
    android:id="@+id/indicator"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" />

  <android.support.v4.view.ViewPager
    android:id="@+id/gallerypager"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" />

</LinearLayout>

GalleryLists.java

public class GalleryLists extends Activity {
  Context context;

  private static final String[] titles = new String[] {
        "20 Hottest", "20 Worst", "20 Awesomest", "MMA", "Comedy", "Moto", "Games" };

  ViewPager listPager;
  ListPagerAdapter listPagerAdapter;

  PageIndicator indicator;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.gallerylists);

    context = this;

    listPagerAdapter = new ListPagerAdapter();

    ViewPager.OnPageChangeListener changeListener = new ViewPager.OnPageChangeListener() {

      @Override
      public void onPageScrolled(int i, float v, int i1) {}

      @Override
      public void onPageSelected(int i) {}

      @Override
      public void onPageScrollStateChanged(int i) {}
    };

    listPager = (ViewPager) findViewById(R.id.gallerypager);
    listPager.setAdapter(listPagerAdapter);
    listPager.setOnPageChangeListener(changeListener);

    indicator = (TabPageIndicator) findViewById(R.id.indicator);
    indicator.setViewPager(listPager);
    indicator.setOnPageChangeListener(changeListener);
  }

  private class ListPagerAdapter extends PagerAdapter {

    // Not important (I believe)
  }
}

就这样了。现在，除非我尽管阅读文档并检查示例仍很困惑，否则我不需要采取任何额外步骤来使用默认样式。我有些迷茫。

- Michael Plotke

Answer 1

我有同样的问题，但是android:theme="@style/Theme.PageIndicatorDefaults"不能与我的应用程序主题相结合。

还有另一种个性化的方法，可以覆盖res/values/style.xml：

<resources>

    <style name="AppTheme" parent="android:Theme.Light" >
        <item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item>

    </style>

    <style name="CustomTabPageIndicator" >
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/vpi__tab_indicator</item>        
        <item name="android:paddingTop">12dp</item>
        <item name="android:paddingBottom">12dp</item>
        <item name="android:textAppearance">@style/TextAppearance.TabPageIndicator</item>
        <item name="android:textSize">15sp</item>
        <item name="android:maxLines">1</item>
        <item name="android:textColor">#FF555555</item>
    </style>
</resources>

- Narkha

---

我其实遇到了类似的问题，并且做了类似的事情。我想在可用的情况下使用 Holo 主题，所以我需要创建另一个文件夹 res/values-v11，并在其中创建一个 style.xml 文件，在其中设置 parent="Theme.Holo"，在你的情况下应该是 "Theme.Holo.Light"。 - Michael Plotke

非常感谢您！真是太糟糕了，要花费这么多时间来弄清楚如何使ViewPagerIndicator工作并进行自定义...如果没有StackOverflow和你们，我会试错到死的。 - Terry

Answer 2

我感觉自己有点蠢，但这里提供了一个非常简单和明显的解决方案。

AndroidManifest.xml

...
<activity
  android:name=".GalleryLists"
  android:theme="@style/Theme.PageIndicatorDefaults"
  ... >
</activity>
...

没错，我需要做的就是实际使用这个主题。希望这能帮助其他一些可怜的迷失灵魂。

- Michael Plotke

---

啊，我一直打开这个标签页但从未阅读它！最终我自己弄清了主题，但本可以节省时间。 - georgiecasey

Answer 3

在Michael的解决方案上进行小改进：如果您已经为您的活动使用自定义主题，只需将以下两行添加到主题中：

<item name="vpiIconPageIndicatorStyle">@style/Widget.IconPageIndicator</item>
<item name="vpiTabPageIndicatorStyle">@style/Widget.TabPageIndicator</item>

- Ripityom