1

我正在构建一个选项卡式应用程序。TabHost 的效果非常好。不幸的是，我的团队负责人不喜欢标签的外观。他不喜欢小图标和标签之间的空隙。所以，我要么需要修改 TabHost，要么使用 ActivityGroup。

我的第一次尝试是更改 TabHost。

这是我的一个标签的drawable：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- When selected, use grey -->
    <item android:drawable="@drawable/ic_tab_timeline_grey"
          android:state_selected="true" />
    <!-- When not selected, use white-->
    <item android:drawable="@drawable/ic_tab_timeline_white" />
    <!-- This is a state-list drawable, which you will apply as the tab image. When the tab state changes, the tab icon will automatically switch between the images defined here.  -->
</selector>

我在我的主要活动中初始化选项卡：

// Initialize a TabSpec for each tab and add it to the TabHost
intent = new Intent().setClass(this, TimelineActivity.class);
spec = tabHost.newTabSpec("timeline") .setIndicator("",
                  res.getDrawable(R.drawable.ic_tab_timeline))
              .setContent(intent);
tabHost.addTab(spec);

（请注意，我将指标设置为空白。）

然后，我设置了背景图片：

TabWidget tw = getTabWidget();
//changeTabWidgetStyle(tw);
View tempView = tabHost.getTabWidget().getChildAt(0);
tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.timeline_on));

这成功地将背景设置为我想要的图像。但是，我的标签仍然有一个小图标，它覆盖了我的背景图像。我怎样才能摆脱图标？我在初始化选项卡时尝试将 Drawable 设置为 null，但这会导致我的应用程序崩溃。

即使我可以让它工作，看起来我仍然会有标签之间的空格。我怎样才能摆脱那些？

如果这不起作用，我可能不得不使用 ActivityGroup。不过，我宁愿不这样做，因为这似乎更复杂。

我正在使用这个例子：android: using ActivityGroup to embed Activity

LocalActivityManager mgr = getLocalActivityManager(); 

Intent i = new Intent(this, SomeActivity.class); 

Window w = mgr.startActivity("unique_per_activity_string", i); 
View wd = w != null ? w.getDecorView() : null; 

if(wd != null) { 
    mSomeContainer.addView(wd); 
}

我可以获得“选项卡”来更改和扩展布局，但我无法添加本地活动。我不确定要将视图添加到哪种“容器”。我的 xml 布局应该是什么样的？

4

2 回答 2

1

这是我用来在最近的项目中成功创建完全自定义外观选项卡的方法。

这个想法是在您的布局中使用隐藏的 TabWidget，并使用包含按钮的自定义 LinearLayout 来控制它。这样，您可以更轻松地自定义按钮以显示您想要的外观。您将在每个按钮的 OnClick 内控制 Activity 中的实际 TabWidget。

使用 TabWidget 和按钮创建布局：

<?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:orientation="vertical"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:gravity="bottom">
    <TabWidget android:id="@android:id/tabs"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        android:visibility="gone" />

    <LinearLayout android:id="@+id/tabbar"
        android:orientation="horizontal" android:layout_width="fill_parent"
        android:layout_height="wrap_content">
        <Button android:id="@+id/firstButton"
            android:layout_alignParentTop="true" android:background="@drawable/btn_first_on"
            android:layout_width="100dp" android:layout_height="43dp"
            android:clickable="true"></Button>
        <Button android:id="@+id/secondButton"
            android:layout_alignParentTop="true" android:background="@drawable/btn_second_off"
            android:layout_height="43dp" android:layout_width="100dp"
            android:clickable="true"></Button>
        <Button android:id="@+id/thirdButton"
            android:layout_alignParentTop="true" android:background="@drawable/btn_third_off"
            android:layout_height="43dp" android:layout_width="100dp"
            android:clickable="true"></Button>
        <Button android:id="@+id/forthButton"
            android:layout_alignParentTop="true" android:background="@drawable/btn_forth_off"
            android:layout_height="43dp" android:layout_width="100dp"
            android:clickable="true"></Button>
    </LinearLayout>

    <FrameLayout android:id="@android:id/tabcontent"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_below="@+id/tabbar" />

    </RelativeLayout>
</TabHost>

设置活动的 onCreate 以使用调整选项卡视图的按钮进行处理：

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    // tabs        
    firstButton = (Button) findViewById(R.id.firstButton);
    secondButton = (Button) findViewById(R.id.secondButton);        
    thirdButton = (Button) findViewById(R.id.thirdButton);
    forthButton = (Button) findViewById(R.id.forthButton);

    Resources res = getResources(); // Resource object to get Drawables
    final TabHost tabHost = getTabHost();  // The activity TabHost
    TabHost.TabSpec spec;  // Resusable TabSpec for each tab
    Intent intent;  // Reusable Intent for each tab

    intent = new Intent().setClass(this, FirstGroupActivity.class);
    spec = tabHost.newTabSpec("first").setIndicator("First").setContent(intent);
    tabHost.addTab(spec);
    intent = new Intent().setClass(this, SecondGroupActivity.class);
    spec = tabHost.newTabSpec("second").setIndicator("Second").setContent(intent);
    tabHost.addTab(spec);   

    intent = new Intent().setClass(this, ThirdGroupActivity.class);
    spec = tabHost.newTabSpec("third").setIndicator("Third").setContent(intent);
    tabHost.addTab(spec);


    intent = new Intent().setClass(this, ForthActivity.class);
    spec = tabHost.newTabSpec("forth").setIndicator("Forth").setContent(intent);
    tabHost.addTab(spec);


    tabHost.setCurrentTab(0);

    firstButton.setOnClickListener(new OnClickListener() {

        public void onClick(View v)
        {
            tabHost.setCurrentTab(0);
            firstButton.setBackgroundResource(R.drawable.btn_first_on);
            secondButton.setBackgroundResource(R.drawable.btn_second_off);              
            thirdButton.setBackgroundResource(R.drawable.btn_third_off);
            forthButton.setBackgroundResource(R.drawable.btn_forth_off);            
        }

    });


    secondButton.setOnClickListener(new OnClickListener() {

        public void onClick(View v)
        {
            tabHost.setCurrentTab(1);
            firstButton.setBackgroundResource(R.drawable.btn_first_off);
            secondButton.setBackgroundResource(R.drawable.btn_second_on);                       
            thirdButton.setBackgroundResource(R.drawable.btn_third_off);                        
            forthButton.setBackgroundResource(R.drawable.btn_forth_off);

        }

    });


    thirdButton.setOnClickListener(new OnClickListener() {

        public void onClick(View v)
        {
            tabHost.setCurrentTab(3);
            firstButton.setBackgroundResource(R.drawable.btn_first_off);
            secondButton.setBackgroundResource(R.drawable.btn_second_off);              
            thirdButton.setBackgroundResource(R.drawable.btn_third_on);
            forthButton.setBackgroundResource(R.drawable.btn_forth_off);

        }

    });


    forthButton.setOnClickListener(new OnClickListener() {

        public void onClick(View v)
        {
            tabHost.setCurrentTab(4);
            firstButton.setBackgroundResource(R.drawable.btn_first_off);
            secondButton.setBackgroundResource(R.drawable.btn_second_off);              
            thirdButton.setBackgroundResource(R.drawable.btn_third_off);
            forthButton.setBackgroundResource(R.drawable.btn_forth_on);

        }

    });
}

如您所见，我使用可绘制对象来显示打开和关闭按钮的图像。使用这种技术，您不仅限于尝试自定义 TabWidget 选项卡的外观时可用的选项，还可以为您的选项卡创建完全自定义的外观。

此外，根据经验，在 android 选项卡中使用 ActivityGroup 是个坏主意。这种方法会占用大量系统资源。一种更好的方法，也是我在这个项目中实施的一种方法是通过一组视图来跟踪视图，然后根据需要将它们换掉。

于 2011-10-19T10:42:19.503 回答
0

除了 SBerg413 的回答，您可以将新标签按钮的按钮图像设置为透明图像。然后在按钮下添加一个ImageView显示（用于RelativeLayout让ImageView显示在与按钮相同的空间中），并根据按下的按钮简单地切换显示在那里的图像。

这样，您可以拥有不同形状的选项卡按钮，并且通常可以更自由地设计选项卡栏，并将按钮用作每个选项卡按钮的基本点击框。

于 2013-07-15T11:04:50.313 回答