【问题标题】:Highlight or underline selected TabPageIndicator突出显示或下划线选定的 TabPageIndicator
【发布时间】:2012-10-29 13:17:54
【问题描述】:

我在平板电脑大小的横向布局上有一个双窗格,我正在使用片段。

在左边我有一个带有列表视图的片段。当点击其中一个项目列表时,右侧片段会加载详细信息。

在右侧(详细)片段的布局中有一个com.viewpagerindicator.TabPageIndicator 和一个android.support.v4.view.ViewPager. ViewPager 将加载 2 个元素,每个元素都有其com.viewpagerindicator.TabPageIndicator。 我试图突出显示或下划线选定的选项卡,但我没有这样做。

希望你能给点建议:)

【问题讨论】:

  • 请更新您的问题并在此处输入一些代码。

标签: android android-layout android-viewpager tabcontrol viewpagerindicator


【解决方案1】:

只需使用两个库 1) Sherlock 操作栏 2) ViewPageIndicator 并实现 tabPageIndicator 视图,它将为您提供默认选项卡,并为 highliget 选项卡提供下划线。 如果您想更改下划线颜色,则需要更改在 underlinbe 中使用的可绘制的第 9 个补丁图像。

这里是示例代码

XML 视图示例

               <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:orientation="vertical" >

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

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>
</FrameLayout>

片段代码

        final FragmentPagerAdapter adapter = new  FragmentChildPageAdapter(getChildFragmentManager());//getActivity().getSupportFragmentManager()

    final ViewPager pager = (ViewPager) v.findViewById(R.id.pager);
    pager.setAdapter(adapter);

    final TabPageIndicator indicator = (TabPageIndicator) v.findViewById(R.id.indicator);
    indicator.setViewPager(pager);

【讨论】:

    【解决方案2】:

    默认情况下,TabPageIndicator 不应用任何样式。要从 ViewPagerIndicator 启用默认样式,将以下行添加到 application 标记或 manifest.xml 中适当的 activity 标记

    android:theme="@style/Theme.MyTheme"
    

    然后在你的项目中添加一个res\values\styles.xml文件,内容如下

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <style name="Theme.MyTheme" parent="@android:style/Theme.Light">
            <item name="vpiTabPageIndicatorStyle">@style/Widget.TabPageIndicator</item>
        </style>  
    </resources>  
    

    我正在为我的应用程序使用 android light 主题,但您可能希望将其更改为您现在使用的主题。

    如果您想更改默认 VPI 样式,请将 styles.xml 文件更改为如下内容:

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    
      <style name="Theme.MyTheme" parent="@android:style/Theme.Light">
        <item name="vpiTabPageIndicatorStyle">@style/MyTabPageIndicator</item>
      </style>  
    
      <style name="MyTabPageIndicator" parent="Widget.TabPageIndicator">
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/vpi__tab_indicator</item>
        <item name="android:paddingLeft">22dip</item>
        <item name="android:paddingRight">22dip</item>
        <item name="android:paddingTop">12dp</item>
        <item name="android:paddingBottom">12dp</item>
        <item name="android:textAppearance">@style/MyTabPageIndicator.Text</item>
        <item name="android:textSize">12sp</item>
        <item name="android:maxLines">1</item>
      </style>
    
      <style name="MyTabPageIndicator.Text" parent="TextAppearance.TabPageIndicator">
        <item name="android:textStyle">bold</item>
        <item name="android:textColor">@color/vpi__dark_theme</item>
      </style>
    
    </resources>
    

    请注意,上面的设置与 TabPageIndicactor 的默认 VPI 样式完全相同,因此您仍然需要进行您喜欢的更改。

    【讨论】:

    • 嗨,我正在使用操作栏,我如何在清单文件上同时实现操作栏和 android:theme="@style/Theme.MyTheme"?
    • @StackOverflowError 我认为问题已得到解答herehere
    • @THelper 我用的是 ABC,方法一样吗?
    • @THelper 很好,很有魅力,感谢您的帮助。
    • @THelper,这个答案真的很好。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-03-02
    • 1970-01-01
    • 1970-01-01
    • 2017-09-26
    • 2023-03-24
    • 2013-08-22
    • 1970-01-01
    相关资源
    最近更新 更多