zoukankan      html  css  js  c++  java

  • Android TabWidget

    首先先看一个小例子，接着讲解原理

     

    1. TabTest.java   
    2.   
    3. view plaincopy to clipboardprint?   
    4. package org.hualang.tab;     
    5. import android.app.Activity;     
    6. import android.app.TabActivity;     
    7. import android.graphics.Color;     
    8. import android.os.Bundle;     
    9. import android.widget.TabHost;     
    10. import android.widget.Toast;     
    11. import android.widget.TabHost.OnTabChangeListener;     
    12. public class TabTest extends TabActivity {     
    13.     /** Called when the activity is first created. */     
    14.     TabHost tabhost;     
    15.     @Override     
    16.     public void onCreate(Bundle savedInstanceState) {     
    17.         super.onCreate(savedInstanceState);     
    18.         setContentView(R.layout.main);     
    19.         //取得TabHost对象     
    20.         tabhost = getTabHost();     
    21.         //为TabHost添加标签     
    22.         //新建一个newTabSpec(newTabSpec)     
    23.         //设置其标签和图标（setIndicator）     
    24.         //设置内容（setContent）     
    25.         tabhost.addTab(tabhost.newTabSpec("tab1")     
    26.                 .setIndicator("TAB 1",getResources().getDrawable(R.drawable.img1))     
    27.                 .setContent(R.id.text1));     
    28.         tabhost.addTab(tabhost.newTabSpec("tab2")     
    29.                 .setIndicator("TAB 2",getResources().getDrawable(R.drawable.img2))     
    30.                 .setContent(R.id.text2));     
    31.         tabhost.addTab(tabhost.newTabSpec("tab3")     
    32.                 .setIndicator("TAB 3",getResources().getDrawable(R.drawable.img3))     
    33.                 .setContent(R.id.text3));     
    34.         //设置TabHost的背景颜色     
    35.         //tabhost.setBackgroundColor(Color.argb(150,22,70,150));     
    36.         //设置TabHost的背景图片资源     
    37.         tabhost.setBackgroundResource(R.drawable.bg0);     
    38.         //设置当前显示哪个标签     
    39.         tabhost.setCurrentTab(0);     
    40.         //标签切换事件处理，setOnTabChangedListener     
    41.         tabhost.setOnTabChangedListener(new OnTabChangeListener()     
    42.         {     
    43.             public void onTabChanged(String tabId)     
    44.             {     
    45.                 Toast toast=Toast.makeText(getApplicationContext(), "现在是"+tabId+"标签", Toast.LENGTH_SHORT);     
    46.                 toast.show();     
    47.             }     
    48.         });     
    49.              
    50.     }     
    51. }     
    52.   

    main.xml

    1. <?xml version="1.0" encoding="utf-8"?>     
    2. <TabHost xmlns:android="http://schemas.android.com/apk/res/android"     
    3.     android:id="@android:id/tabhost"     
    4.     android:layout_width="fill_parent"     
    5.     android:layout_height="fill_parent">     
    6.     <LinearLayout     
    7.         android:orientation="vertical"     
    8.         android:layout_width="fill_parent"     
    9.         android:layout_height="fill_parent">     
    10.         <TabWidget     
    11.             android:id="@android:id/tabs"     
    12.             android:layout_width="fill_parent"     
    13.             android:layout_height="wrap_content" />     
    14.         <FrameLayout     
    15.             android:id="@android:id/tabcontent"     
    16.             android:layout_width="fill_parent"     
    17.             android:layout_height="fill_parent">     
    18.             <TextView      
    19.                 android:id="@+id/text1"     
    20.                 android:layout_width="fill_parent"     
    21.                 android:layout_height="fill_parent"      
    22.                 android:text="选项卡1" />     
    23.             <TextView      
    24.                 android:id="@+id/text2"     
    25.                 android:layout_width="fill_parent"     
    26.                 android:layout_height="fill_parent"      
    27.                 android:text="选项卡2" />     
    28.             <TextView      
    29.                 android:id="@+id/text3"     
    30.                 android:layout_width="fill_parent"     
    31.                 android:layout_height="fill_parent"      
    32.                 android:text="选项卡3" />     
    33.         </FrameLayout>     
    34.     </LinearLayout>     
    35. </TabHost>    


    Android TabWidget的实现可以分为二种，一种是使用标准TabActivity实现，另外一种可以自定义方式实现，这种方法实现起来相对比较复杂，但对于要实现比较多元化的view是很好的，这里我们简单看下源码

    一、通用做法

    继承TabActivity，实现自己的TabActivity

     

    [java] view plaincopy
     
    1. import android.app.Activity;  
    2. import android.app.TabActivity;  
    3. import android.content.Intent;  
    4. import android.os.Bundle;  
    5. import android.widget.TabHost;  
    6. import android.widget.TabHost.OnTabChangeListener;  
    7. public class TabWidgetDemo2 extends TabActivity implements OnTabChangeListener {  
    8.      private TabHost mTabHost;  
    9.        
    10.     @Override  
    11.     protected void onCreate(Bundle savedInstanceState) {  
    12.         // TODO Auto-generated method stub  
    13.         super.onCreate(savedInstanceState);  
    14.           
    15.         setContentView(R.layout.tabwidgetdemo2);    
    16.         mTabHost = getTabHost();  
    17.         mTabHost.setOnTabChangedListener(this);  
    18.         setupTab1();  
    19.         setupTab2();  
    20.         mTabHost.setCurrentTab(1);  
    21.     }  
    22.     private void setupTab2() {  
    23.         // TODO Auto-generated method stub  
    24.         Intent intent = new Intent();  
    25.         intent.setAction(Intent.ACTION_MAIN);  
    26.         intent.setClass(this, TabWidget2.class);  
    27.         mTabHost.addTab(mTabHost.newTabSpec("TabWidget2")  
    28.                 .setIndicator("TabWidget2",getResources().getDrawable(R.drawable.icon))  
    29.                 .setContent(intent));  
    30.     }  
    31.     private void setupTab1() {  
    32.         // TODO Auto-generated method stub  
    33.         Intent intent = new Intent();  
    34.         intent.setAction(Intent.ACTION_MAIN);  
    35.         intent.setClass(this, TabWidget1.class);  
    36.         mTabHost.addTab(mTabHost.newTabSpec("TabWidget1")  
    37.                 .setIndicator("TabWidget1",getResources().getDrawable(R.drawable.icon))  
    38.                 .setContent(intent));  
    39.     }  
    40.     public void onTabChanged(String tabId) {  
    41.         // TODO Auto-generated method stub  
    42.         Activity activity = getLocalActivityManager().getActivity(tabId);  
    43.         if (activity != null) {  
    44.             activity.onWindowFocusChanged(true);  
    45.         }  
    46.     }  
    47.        
    48.        
    49. }  

    二个tab对应的Activity，先看TabWidget1，这个类在第二种实现中还会用到，因此我们可以看到对Action的判断。

     

    [java] view plaincopy
     
    1. import android.app.Activity;  
    2. import android.content.Intent;  
    3. import android.os.Bundle;  
    4. import com.android.exampledemo.R;  
    5. import com.android.exampledemo.util.DemoUtils;  
    6. public class TabWidget1 extends Activity {  
    7.     @Override  
    8.     protected void onCreate(Bundle savedInstanceState) {  
    9.         // TODO Auto-generated method stub  
    10.         super.onCreate(savedInstanceState);  
    11.           
    12.         Intent intent = this.getIntent();  
    13.         if (intent.getAction().equals(Intent.ACTION_MAIN)){  
    14.             setContentView(R.layout.tabwidgetdemo2_1);  
    15.         }  
    16.         else {  
    17.             setContentView(R.layout.tabwidget_1);  
    18.             DemoUtils.updateButtonBar((Activity)this,R.id.contactstab);  
    19.         }  
    20.     }  
    21. }  

     

    再看一下TabWidget2，这个Activity我们在第二种实现方式中也会用到。

     

    [java] view plaincopy
     
    1. import com.android.exampledemo.R;  
    2. import com.android.exampledemo.util.DemoUtils;  
    3. import android.app.Activity;  
    4. import android.content.Intent;  
    5. import android.os.Bundle;  
    6. public class TabWidget2 extends Activity {  
    7.     @Override  
    8.     protected void onCreate(Bundle savedInstanceState) {  
    9.         // TODO Auto-generated method stub  
    10.         super.onCreate(savedInstanceState);  
    11.           
    12.         Intent intent = this.getIntent();  
    13.           
    14.         if (intent.getAction().equals(Intent.ACTION_MAIN)){  
    15.             setContentView(R.layout.tabwidgetdemo2_1);  
    16.         }  
    17.         else {  
    18.             setContentView(R.layout.tabwidget_2);  
    19.             DemoUtils.updateButtonBar((Activity)this,R.id.groupstab);  
    20.         }  
    21.     }  
    22. }  

     

    最后就是各个Activity对应的layout

    1.tabwidgetdemo2.xml

     

    [xhtml] view plaincopy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <TabHost  
    3.   xmlns:android="http://schemas.android.com/apk/res/android"  
    4.   android:id="@android:id/tabhost"  
    5.   android:layout_width="fill_parent"  
    6.   android:layout_height="fill_parent">  
    7.   <LinearLayout   
    8.     android:orientation="vertical"  
    9.     android:layout_width="fill_parent"  
    10.     android:layout_height="fill_parent">  
    11.     <TabWidget android:id="@android:id/tabs"  
    12.         android:layout_width="fill_parent"  
    13.         android:layout_height="68dip"  
    14.         android:paddingLeft="1dip"  
    15.         android:paddingRight="1dip"  
    16.         android:paddingTop="4dip"  
    17.         />  
    18.     <FrameLayout android:id="@android:id/tabcontent"  
    19.         android:layout_width="fill_parent"  
    20.         android:layout_height="0dip"  
    21.         android:layout_weight="1"  
    22.         />  
    23.     </LinearLayout>   
    24. </TabHost>  

    2.二个sub tab对应的layout

     

    [xhtml] view plaincopy
     
    1. Layout1  
    2. <?xml version="1.0" encoding="utf-8"?>  
    3. <LinearLayout  
    4.   xmlns:android="http://schemas.android.com/apk/res/android"  
    5.   android:layout_width="fill_parent"  
    6.   android:layout_height="fill_parent"  
    7.   android:background="#FFF">  
    8.   <TextView android:id="@+id/textview"   
    9.     android:layout_width="wrap_content"   
    10.     android:layout_height="wrap_content"  
    11.     android:text="Tab Widget first">  
    12.    </TextView>  
    13. </LinearLayout>  
    14. Layout2  
    15. <?xml version="1.0" encoding="utf-8"?>  
    16. <LinearLayout  
    17.   xmlns:android="http://schemas.android.com/apk/res/android"  
    18.   android:layout_width="fill_parent"  
    19.   android:layout_height="fill_parent"  
    20.   android:background="#FFF">  
    21.   <TextView android:id="@+id/textview"   
    22.     android:layout_width="wrap_content"   
    23.     android:layout_height="wrap_content"  
    24.     android:text="Tab Widget second">  
    25.    </TextView>  
    26. </LinearLayout>  

     

     

    方法2：

    先创建一个Activity （TabWidgetDemo）

     

    [c-sharp] view plaincopy
     
    1. 1.TabWidgetDemo.java  
    2. import com.android.exampledemo.R;  
    3. import com.android.exampledemo.util.DemoUtils;  
    4. import android.app.Activity;  
    5. import android.content.Context;  
    6. import android.content.SharedPreferences;  
    7. import android.os.Bundle;  
    8. //not use tabhost to organized   
    9. public class TabWidgetDemo extends Activity {  
    10.     @Override  
    11.     protected void onCreate(Bundle savedInstanceState) {  
    12.         // TODO Auto-generated method stub  
    13.         super.onCreate(savedInstanceState);  
    14.         //int activeTab = DemoUtils.getIntPref(this, "activetab", R.id.artisttab);  
    15.         SharedPreferences prefs =  
    16.             getSharedPreferences(getPackageName(), Context.MODE_PRIVATE);  
    17.         int activeTab = prefs.getInt("activetab", R.id.contactstab);  
    18.         if (activeTab != R.id.contactstab  
    19.                 && activeTab != R.id.groupstab) {  
    20.             activeTab = R.id.contactstab;  
    21.         }  
    22.         DemoUtils.activateTab(this, activeTab);  
    23.     }  
    24. }  
    25. 2.DemoUtils  
    26. import android.app.Activity;  
    27. import android.content.Intent;  
    28. import android.net.Uri;  
    29. import android.view.View;  
    30. import android.widget.TabWidget;  
    31. import com.android.exampledemo.R;  
    32. public class DemoUtils {  
    33.     static int sActiveTabIndex = -1;  
    34.       
    35.     public static void activateTab(Activity a,int active_id){  
    36.         Intent intent = new Intent(Intent.ACTION_PICK);  
    37.         switch (active_id) {  
    38.         case R.id.contactstab:  
    39.             intent.setDataAndType(Uri.EMPTY, "vnd.android.cursor.dir/tb_contacts");  
    40.             break;  
    41.         case R.id.groupstab:  
    42.             intent.setDataAndType(Uri.EMPTY, "vnd.android.cursor.dir/tb_groups");  
    43.             break;  
    44.         default:  
    45.             return;  
    46.         }  
    47.         intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);  
    48.         a.startActivity(intent);  
    49.         a.finish();  
    50.         a.overridePendingTransition(0,0);  
    51.     }  
    52.       
    53.       
    54.     public static void updateButtonBar(Activity a, int highlight) {  
    55.         final TabWidget ll = (TabWidget) a.findViewById(R.id.buttonbar);  
    56.           
    57.          for (int i = ll.getChildCount() - 1; i >= 0; i--) {  
    58.              View v = ll.getChildAt(i);  
    59.              boolean isActive = (v.getId() == highlight);  
    60.              if (isActive) {  
    61.                     ll.setCurrentTab(i);  
    62.                     sActiveTabIndex = i;  
    63.              }  
    64.                
    65.              v.setTag(i);  
    66.              v.setOnClickListener(new View.OnClickListener() {  
    67.                     public void onClick(View v) {  
    68.                         int id = v.getId();  
    69.                         if (id == ll.getChildAt(sActiveTabIndex).getId()) {  
    70.                             return;  
    71.                         }  
    72.                         activateTab((Activity)ll.getContext(),id );  
    73.                         ll.setCurrentTab((Integer) v.getTag());  
    74.                     }});  
    75.          }  
    76.     }  
    77. }  

     

     

    二个Tab sub activity前一方法中已经给出，这里我们只需要看一下layout的实现就可以了

    1>buttonbar.xml

     

    [xhtml] view plaincopy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <TabWidget xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:id="@+id/buttonbar"  
    4.     android:layout_width="match_parent"  
    5.     android:layout_height="wrap_content" >  
    6.     <TextView  
    7.         android:id="@+id/contactstab"  
    8.         android:focusable="true"  
    9.         android:drawableTop="@drawable/icon"  
    10.         android:background="@drawable/buttonbarbackground"  
    11.         android:text="Contacts"  
    12.         android:textColor="@color/tab_indicator_text"  
    13.         android:textAppearance="?android:attr/textAppearanceSmall"  
    14.         android:paddingTop="7dip"  
    15.         android:paddingBottom="2dip"  
    16.         android:gravity="center"  
    17.         android:layout_weight="1"  
    18.         android:layout_marginLeft="-3dip"  
    19.         android:layout_marginRight="-3dip"  
    20.         android:layout_width="match_parent"  
    21.         android:layout_height="84dip"  
    22.         android:singleLine="true"  
    23.         android:ellipsize="marquee" />  
    24.     <TextView  
    25.         android:id="@+id/groupstab"  
    26.         android:focusable="true"  
    27.         android:drawableTop="@drawable/icon"  
    28.         android:background="@drawable/buttonbarbackground"  
    29.         android:text="Group"  
    30.         android:textColor="@color/tab_indicator_text"  
    31.         android:textAppearance="?android:attr/textAppearanceSmall"  
    32.         android:paddingTop="7dip"  
    33.         android:paddingBottom="2dip"  
    34.         android:gravity="center"  
    35.         android:layout_weight="1"  
    36.         android:layout_marginLeft="-3dip"  
    37.         android:layout_marginRight="-3dip"  
    38.         android:layout_width="match_parent"  
    39.         android:layout_height="84dip"  
    40.         android:singleLine="true"  
    41.         android:ellipsize="marquee" />  
    42. </TabWidget>  

    2>tabwidget_1.xml

     

    [xhtml] view plaincopy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout  
    3.   xmlns:android="http://schemas.android.com/apk/res/android"  
    4.   android:layout_width="fill_parent"  
    5.   android:layout_height="fill_parent">  
    6.     
    7.   <include layout="@layout/battonbar" />  
    8.     
    9.   <ExpandableListView android:id="@+id/android:list"  
    10.                   android:layout_width="fill_parent"   
    11.                   android:layout_height="wrap_content"  
    12.                   android:footerDividersEnabled="true"  
    13.                   android:fadeScrollbars="true"  
    14.                   android:drawSelectorOnTop="true">  
    15.   </ExpandableListView>  
    16.     
    17. </LinearLayout>  

    3> tabwidget_2.xml

     

    [xhtml] view plaincopy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout  
    3.   xmlns:android="http://schemas.android.com/apk/res/android"  
    4.   android:layout_width="fill_parent"  
    5.   android:layout_height="fill_parent">  
    6.     
    7.   <include layout="@layout/battonbar" />  
    8.     
    9. </LinearLayout>  

     
  • 相关阅读:
    android-sdk环境变量配置
    2018/08/04
    python 读取配置文件ini ---ConfigParser
    关于自动化测试框架搭建的前期考虑问题
    Jmeter中用例禁用
    Jmeter创建一个http请求
    基本的sql语法
    sql创建表格时出现乱码
    Jmeter安装
    Java环境搭建
  • 原文地址：https://www.cnblogs.com/javawebsoa/p/3020108.html
Copyright © 2011-2022 走看看