如何在Android中实现自定义Tab主机

时间:2012-03-28 20:48:33

标签: android tabs

如何在Android中制作此类标签[http://i.stack.imgur.com/rIbUX.png]

只要注意看到重叠区域,当您单击选项卡时,重叠会发生变化。

这里有一个中文版示例,其中我认为这就是我想要的,但是他们没有提供完整的代码,我不知道如何继续这个项目。< / p>

http://www.oschina.net/question/54100_29061

我目前正在使用Android 3.2和ICS 4+来实现这个项目,所以欢迎,如果可以实现与Framgment的竞争。


我终于自己解决了这个问题。我只是离开原生标签主机实现,自己组成。

这是屏幕截图: [http://i.stack.imgur.com/1mXLZ.png]

这是活动代码:

import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.TextView;

public class PelesysTabHostActivity extends Activity {
private ImageView ib1, ib2, ib3, last;
private Drawable pressed, released;
private TextView tv,tv1,tv2,tv3;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    ib1 = (ImageView) this.findViewById(R.id.imageView1);
    ib2 = (ImageView) this.findViewById(R.id.imageView2);
    ib3 = (ImageView) this.findViewById(R.id.imageView3);
    tv = (TextView) this.findViewById(R.id.textView1);
    tv1= (TextView) this.findViewById(R.id.textView11);
    tv2= (TextView) this.findViewById(R.id.textView22);
    tv3= (TextView) this.findViewById(R.id.textView33);

    pressed = getResources().getDrawable(R.drawable.ui_table_tab_button);
    released = getResources().getDrawable(
            R.drawable.ui_table_tab_button_disabled);
    ib1.setImageDrawable(pressed);
    last = ib1;

    ib1.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {
            last.setImageDrawable(released);
            ib1.setImageDrawable(pressed);
            last = ib1;
            tv.setText("I am super 1");
            ib1.bringToFront();
            tv1.bringToFront();
        }
    });

    ib2.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {
            last.setImageDrawable(released);
            ib2.setImageDrawable(pressed);
            last = ib2;
            tv.setText("TWO!!!  I am super 2");
            ib2.bringToFront();
            tv2.bringToFront();
        }
    });

    ib3.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {
            last.setImageDrawable(released);
            ib3.setImageDrawable(pressed);
            last = ib3;
            tv.setText(" III !!!  I am super 3");
            ib3.bringToFront();
            tv3.bringToFront();
        }
    });

}
}

这是我使用的布局文件(main.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" >

<RelativeLayout
    android:id="@+id/relativeLayout2"
    android:layout_width="fill_parent"
    android:layout_height="330dp"
    android:layout_alignParentLeft="true"
    android:layout_centerVertical="true" >

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:src="@drawable/ui_table_bg_coursedetail" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Large Text"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="#000000" />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/relativeLayout2"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="326dp" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:src="@drawable/ui_table_tab_button_disabled" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="90dp"
        android:src="@drawable/ui_table_tab_button_disabled" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="180dp"
        android:src="@drawable/ui_table_tab_button_disabled" />

    <TextView
        android:id="@+id/textView11"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView1"
        android:layout_marginLeft="50dp"
        android:text="1"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textColor="#000000" />

    <TextView
        android:id="@+id/textView22"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView2"
        android:layout_marginLeft="50dp"
        android:text="2"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textColor="#000000" />

    <TextView
        android:id="@+id/textView33"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView3"
        android:layout_marginLeft="50dp"
        android:text="3"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textColor="#000000" />
</RelativeLayout>

1 个答案:

答案 0 :(得分:0)

现在只用了一个星期我用过:https://github.com/AdilSoomro/Iphone-Tab-in-Android 工作得很好!您可以在第一张图片中自定义它