【问题标题】:Android: Tabs at the BOTTOMAndroid:底部的标签
【发布时间】:2010-03-07 08:40:43
【问题描述】:

我看到了一些关于这个的讨论,但没有确定的。 有没有办法将 TabWidget 中的选项卡放在屏幕底部? 如果有,怎么做?

我尝试了以下方法,但没有成功:

a) 在框架布局下方设置标签小部件
b) 将 tabwidget 的重力设置为“底部”

谢谢! 呸呸呸

【问题讨论】:

标签: android tabwidget


【解决方案1】:

这是在屏幕底部获取标签的最简单、最强大且可扩展的解决方案。

  1. 在您的垂直 LinearLayout 中,将 FrameLayout 放在 TabWidget 上方
  2. 在 FrameLayout 和 TabWidget 上将 layout_height 设置为 wrap_content
  3. 设置FrameLayout的android:layout_weight="1"
  4. 设置 TabWidget 的 android:layout_weight="0"(默认为 0,但用于强调、可读性等)
  5. 设置 TabWidget 的 android:layout_marginBottom="-4dp"(移除底部分隔线)

完整代码:

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

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

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:layout_weight="1"/>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:layout_marginBottom="-4dp"/>

    </LinearLayout>

</TabHost>

【讨论】:

  • 分隔线实际上是硬编码的。我试图更改用于选项卡的可绘制对象并找到了它。真是太可惜了。
  • 您应该选择这个(或其他)作为接受的答案。
  • 此处与 Google 的标准 TabWidget 示例唯一需要的偏差是在 FrameLayout 上设置 layout_weight=1。这允许选项卡控件首先“声明”其在 LinearLayout 之外的高度。
  • 为了去掉 TabWidget 底部的分隔线,只需将 android:layout_marginBottom="-5px" 添加到 TabWidget 即可。这会将 TabWidget 移出屏幕底部 5 个像素,刚好够您看不到分隔线。 FrameLayout 将补偿大小,使其完美运行。我不确定分隔线的大小是否会在较大的设备上发生变化。您可能必须使用dp 而不是px
  • 我已将 remove-divider 注释合并到答案中。
【解决方案2】:

试试看;) 只需观看 FrameLayout(@id/tabcontent) 的内容,因为我不知道在滚动的情况下它会如何处理......在我的情况下它可以工作,因为我使用 ListView 作为我的选项卡的内容。 :) 希望对您有所帮助。

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <RelativeLayout 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent">
        <FrameLayout android:id="@android:id/tabcontent"
             android:layout_width="fill_parent" 
             android:layout_height="fill_parent"
             android:layout_alignParentTop="true" 
             android:layout_above="@android:id/tabs" />
    <TabWidget android:id="@android:id/tabs"
             android:layout_width="fill_parent" 
             android:layout_height="wrap_content"
             android:layout_alignParentBottom="true" />
    </RelativeLayout>
</TabHost>

【讨论】:

  • +1 但是您注意到屏幕顶部的黑/灰条了吗?你是如何删除它的?
  • 我正在使用它来将标签小部件发布到表单的左侧。
【解决方案3】:

有一种方法可以删除线。

1) 遵循本教程: android-tabs-with-fragments

2) 然后应用 Leaudro 上面建议的 RelativeLayout 更改(将布局道具应用到所有 FrameLayouts)。

您还可以将 ImageView 添加到第 1 项中的 tab.xml 并获得非常 iPhone 的标签外观。

这是我现在正在处理的屏幕截图。我还有一些工作要做,主要是为图标做一个选择器并确保水平分布相等,但你明白了。 就我而言,我使用的是片段,但相同的原则应该适用于标准选项卡视图。

【讨论】:

  • 您发布此内容已经有一段时间了,但您的链接现在显示 Welcome to nginx! 页面上没有其他内容。
  • 这不是我的网站,所以很遗憾我无法控制它。不过,经过这段时间之后,系统已经发生了很大变化,您可能不应该为您的 Android 用户实现这种界面,他们会期望现在的工作方式会有所不同。
【解决方案4】:

不确定它是否适用于所有版本的 Android(尤其是那些具有自定义 UI 内容的版本),但我可以通过添加删除底部的灰色条

 android:layout_marginBottom="-3dp"

到 TabWidget XML...

【讨论】:

    【解决方案5】:

    对于所有尝试删除 tabWidget 分隔线的人,这里有一个示例项目(及其各自的教程),它非常适合自定义选项卡,从而在选项卡位于底部时消除问题。 Eclipse 项目:android-custom-tabs; 原文解释:blog; 希望这会有所帮助。

    【讨论】:

      【解决方案6】:

      有两种方法可以在标签活动的底部显示标签。

      1. 使用相对布局
      2. 使用 Layout_weight 属性

      请查看link for more details

      【讨论】:

        【解决方案7】:

        这可能不是您正在寻找的(将您的选项卡发送到屏幕底部并不是一个“简单”的解决方案),但它仍然是一个有趣的替代解决方案,我想向您指出:

        ScrollableTabHost 的行为类似于 TabHost,但带有一个额外的滚动视图以适应更多项目...

        也许深入研究这个开源项目,您会找到问题的答案。如果我看到任何更容易的事情,我会回来找你的。

        【讨论】:

          【解决方案8】:

          我在尝试将它们放在屏幕底部时遇到了同样的问题。我的场景是不使用布局文件并在代码中创建选项卡,我还希望从每个选项卡中触发活动,这使用其他方法似乎有点过于复杂,因此,这里是解决问题的示例代码:

          adding-tabs-in-android-and-placing-them

          【讨论】:

            【解决方案9】:

            是的,见:link,但是他使用xml布局,而不是activity来创建新标签,所以把他的xml代码(为FrameLayout设置paddingTop - 0px)然后写代码:

            public class SomeActivity extends ActivityGroup {
            
            @Override
            public void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
              setContentView(R.layout.main);
            
                TabHost tab_host = (TabHost) findViewById(R.id.edit_item_tab_host); 
            
                tab_host.setup(this.getLocalActivityManager());
            
                TabSpec ts1 = tab_host.newTabSpec("TAB_DATE"); 
                ts1.setIndicator("tab1"); 
                ts1.setContent(new Intent(this, Registration.class)); 
                tab_host.addTab(ts1); 
            
                TabSpec ts2 = tab_host.newTabSpec("TAB_GEO"); 
                ts2.setIndicator("tab2"); 
                ts2.setContent(new Intent(this, Login.class)); 
                tab_host.addTab(ts2); 
            
                TabSpec ts3 = tab_host.newTabSpec("TAB_TEXT"); 
                ts3.setIndicator("tab3"); 
                ts3.setContent(new Intent(this, Registration.class)); 
                tab_host.addTab(ts3); 
            
                tab_host.setCurrentTab(0);      
            
            
            }
            

            }

            【讨论】:

              【解决方案10】:

              我建议将此代码用于稳定工作,它针对选项卡中的嵌套片段(例如嵌套 MapFragment)进行了优化,并针对“不保留活动”进行了测试:https://stackoverflow.com/a/23150258/2765497

              【讨论】:

                猜你喜欢
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                相关资源
                最近更新 更多