tabhost练习，剥离自“去哪儿”

如下图（喜欢这种干净整洁）：

1.MainActivity.java

  1 package com.example.tab1;
  2 
  3 import com.example.framgent.Fav_Fragment;
  4 import com.example.framgent.Index_Fragment;
  5 import com.example.framgent.Order_Fragment;
  6 import com.example.framgent.Setting_Fragment;
  7 import com.example.framgent.Uc_Fragment;
  8 import com.example.util.DummyTabContent;
  9 
 10 import android.os.Bundle;
 11 import android.support.v4.app.FragmentActivity;
 12 import android.view.LayoutInflater;
 13 import android.widget.ImageView;
 14 import android.widget.LinearLayout;
 15 import android.widget.TabHost;
 16 import android.widget.TabWidget;
 17 import android.widget.TextView;
 18 
 19 public class MainActivity extends FragmentActivity {
 20 
 21     TabHost tabHost;
 22     TabWidget tabWidget; 
 23     LinearLayout bottom_layout;
 24     int CURRENT_TAB = 0;    //设置常量
 25     Fav_Fragment homeFragment;
 26     Order_Fragment wallFragment;
 27     Uc_Fragment messageFragment;
 28     Setting_Fragment meFragment;
 29     Index_Fragment index_Fragment;
 30     android.support.v4.app.FragmentTransaction ft;
 31     LinearLayout tabIndicator1,tabIndicator2,tabIndicator3,tabIndicator4,tabIndicator5;
 32 
 33     @Override
 34     public void onCreate(Bundle savedInstanceState) {
 35         super.onCreate(savedInstanceState);
 36         setContentView(R.layout.activity_main);
 37         findTabView();
 38         tabHost.setup();
 39         
 40         /** 监听*/
 41         TabHost.OnTabChangeListener tabChangeListener = new TabHost.OnTabChangeListener(){
 42             @Override
 43             public void onTabChanged(String tabId) {
 44                 
 45                 /**碎片管理*/
 46                 android.support.v4.app.FragmentManager fm =  getSupportFragmentManager();
 47                 homeFragment = (Fav_Fragment) fm.findFragmentByTag("home");
 48                 wallFragment = (Order_Fragment) fm.findFragmentByTag("wall");
 49                 messageFragment = (Uc_Fragment) fm.findFragmentByTag("message");
 50                 meFragment = (Setting_Fragment) fm.findFragmentByTag("me");
 51                 index_Fragment    =(Index_Fragment) fm.findFragmentByTag("index");
 52                 ft = fm.beginTransaction();
 53                 
 54                 /** 如果存在Detaches掉 */
 55                 if(homeFragment!=null)
 56                     ft.detach(homeFragment);
 57                 
 58                 /** 如果存在Detaches掉 */
 59                 if(wallFragment!=null)
 60                     ft.detach(wallFragment);
 61                 
 62                 /** 如果存在Detaches掉 */
 63                 if(messageFragment!=null)
 64                     ft.detach(messageFragment);
 65                 
 66                 /** 如果存在Detaches掉 */
 67                 if(meFragment!=null)
 68                     ft.detach(meFragment);
 69                 
 70                 if(index_Fragment!=null)
 71                     ft.detach(index_Fragment);
 72                 
 73                 /** 如果当前选项卡是home */
 74                 if(tabId.equalsIgnoreCase("home")){
 75                     isTabHome();
 76                     CURRENT_TAB = 1;
 77                     
 78                 /** 如果当前选项卡是wall */
 79                 }else if(tabId.equalsIgnoreCase("wall")){    
 80                     isTabWall();
 81                     CURRENT_TAB = 2;
 82                     
 83                 /** 如果当前选项卡是message */
 84                 }else if(tabId.equalsIgnoreCase("index")){
 85                     isTabIndex();
 86                     CURRENT_TAB    =    5;
 87                 }else if(tabId.equalsIgnoreCase("message")){    
 88                     isTabMessage();
 89                     CURRENT_TAB = 3;
 90                     
 91                 /** 如果当前选项卡是me */
 92                 }else if(tabId.equalsIgnoreCase("me")){    
 93                     isTabMe();
 94                     CURRENT_TAB = 4;
 95                 }else{
 96                     switch (CURRENT_TAB) {
 97                     case 1:
 98                         isTabHome();
 99                         break;
100                     case 2:
101                         isTabWall();
102                         break;
103                     case 3:
104                         isTabMessage();
105                         break;
106                     case 4:
107                         isTabMe();
108                         break;
109                     case 5:
110                         isTabIndex();
111                         break;
112                     default:
113                         isTabHome();
114                         break;
115                     }        
116                     
117                 }
118                     ft.commit();    
119             }
120             
121         };
122         //设置初始选项卡  
123         tabHost.setCurrentTab(2);
124         tabHost.setOnTabChangedListener(tabChangeListener);
125         initTab();
126          /**  设置初始化界面  */
127         tabHost.setCurrentTab(2);
128 
129     }
130     
131     //判断当前
132     public void isTabHome(){
133         
134         if(homeFragment==null){        
135             ft.add(R.id.realtabcontent,new Fav_Fragment(), "home");                        
136         }else{
137             ft.attach(homeFragment);                        
138         }
139     }
140     
141     public void isTabWall(){
142         
143         if(wallFragment==null){
144             ft.add(R.id.realtabcontent,new Order_Fragment(), "wall");                        
145         }else{
146             ft.attach(wallFragment);                        
147         }
148     }
149     
150     public void isTabMessage(){
151         
152         if(messageFragment==null){
153             ft.add(R.id.realtabcontent,new Uc_Fragment(), "message");                        
154         }else{
155             ft.attach(messageFragment);                        
156         }
157     }
158     
159     public void isTabMe(){
160         
161         if(meFragment==null){
162             ft.add(R.id.realtabcontent,new Setting_Fragment(), "me");                        
163         }else{
164             ft.attach(meFragment);    
165         }
166     }
167     public void isTabIndex(){
168         if(index_Fragment==null){
169             ft.add(R.id.realtabcontent,new Index_Fragment(), "index");                        
170         }else{
171             ft.attach(index_Fragment);    
172         }
173     }
174     /**
175      * 找到Tabhost布局
176      */
177     public void findTabView(){
178         
179          tabHost = (TabHost) findViewById(android.R.id.tabhost);
180          tabWidget = (TabWidget) findViewById(android.R.id.tabs);
181          LinearLayout layout = (LinearLayout)tabHost.getChildAt(0);
182          TabWidget tw = (TabWidget)layout.getChildAt(1);
183          
184          tabIndicator1 = (LinearLayout) LayoutInflater.from(this)
185                  .inflate(R.layout.tab_indicator, tw, false);
186          TextView tvTab1 = (TextView)tabIndicator1.getChildAt(1);
187          ImageView ivTab1 = (ImageView)tabIndicator1.getChildAt(0);
188          ivTab1.setBackgroundResource(R.drawable.selector_mood_home);
189          tvTab1.setText(R.string.buttom_home);
190          
191          tabIndicator2 = (LinearLayout) LayoutInflater.from(this)
192                  .inflate(R.layout.tab_indicator, tw, false);
193          TextView tvTab2 = (TextView)tabIndicator2.getChildAt(1);
194          ImageView ivTab2 = (ImageView)tabIndicator2.getChildAt(0);
195          ivTab2.setBackgroundResource(R.drawable.selector_mood_wall);
196          tvTab2.setText(R.string.buttom_wall);
197          
198          tabIndicator3 = (LinearLayout) LayoutInflater.from(this)
199                  .inflate(R.layout.tab_indicator, tw, false);
200          TextView tvTab3 = (TextView)tabIndicator3.getChildAt(1);
201          ImageView ivTab3 = (ImageView)tabIndicator3.getChildAt(0);
202          ivTab3.setBackgroundResource(R.drawable.selector_mood_photograph);
203          tvTab3.setText(R.string.buttom_camera);
204           
205          tabIndicator4 = (LinearLayout) LayoutInflater.from(this)
206                  .inflate(R.layout.tab_indicator, tw, false);
207          TextView tvTab4 = (TextView)tabIndicator4.getChildAt(1);
208          ImageView ivTab4 = (ImageView)tabIndicator4.getChildAt(0);
209          ivTab4.setBackgroundResource(R.drawable.selector_mood_message);
210          tvTab4.setText(R.string.buttom_message);
211          
212          tabIndicator5 = (LinearLayout) LayoutInflater.from(this)
213                  .inflate(R.layout.tab_indicator, tw, false);
214          TextView tvTab5 = (TextView)tabIndicator5.getChildAt(1);
215          ImageView ivTab5 = (ImageView)tabIndicator5.getChildAt(0);
216          ivTab5.setBackgroundResource(R.drawable.selector_mood_my_wall);
217          tvTab5.setText(R.string.buttom_me);
218     }
219     
220     /** 
221      * 初始化选项卡
222      * 
223      * */
224     public void initTab(){
225         
226         TabHost.TabSpec tSpecHome = tabHost.newTabSpec("home");
227         tSpecHome.setIndicator(tabIndicator1);        
228         tSpecHome.setContent(new DummyTabContent(getBaseContext()));
229         tabHost.addTab(tSpecHome);
230         
231         TabHost.TabSpec tSpecWall = tabHost.newTabSpec("wall");
232         tSpecWall.setIndicator(tabIndicator2);        
233         tSpecWall.setContent(new DummyTabContent(getBaseContext()));
234         tabHost.addTab(tSpecWall);
235         
236         TabHost.TabSpec tSpecCamera = tabHost.newTabSpec("index");
237         tSpecCamera.setIndicator(tabIndicator3);        
238         tSpecCamera.setContent(new DummyTabContent(getBaseContext()));
239         tabHost.addTab(tSpecCamera);
240         
241        /* //拍照按钮监听事件，弹出dialog
242         tabIndicator3.setOnClickListener(new OnClickListener() {
243             @Override
244             public void onClick(View v) {
245                 
246                 Dialog choose = new Dialog(MainActivity.this,R.style.draw_dialog);
247                 choose.setContentView(R.layout.camera_dialog);
248                 // 设置背景模糊参数
249                 WindowManager.LayoutParams winlp = choose.getWindow()
250                         .getAttributes();
251                 winlp.alpha = 0.9f; // 0.0-1.0
252                 choose.getWindow().setAttributes(winlp);
253                 choose.show();// 显示弹出框
254             }
255         });*/
256         
257         TabHost.TabSpec tSpecMessage = tabHost.newTabSpec("message");
258         tSpecMessage.setIndicator(tabIndicator4);      
259         tSpecMessage.setContent(new DummyTabContent(getBaseContext()));
260         tabHost.addTab(tSpecMessage);
261         
262         TabHost.TabSpec tSpecMe = tabHost.newTabSpec("me");
263         tSpecMe.setIndicator(tabIndicator5);        
264         tSpecMe.setContent(new DummyTabContent(getBaseContext()));
265         tabHost.addTab(tSpecMe);
266         
267     }
268     
269 }

如上图所示，总共5个framgent及其对应的5个布局文件，下面给出示例代码，复杂漂亮的界面待你实现。

2.Fav_Fragment.java

 1 package com.example.framgent;
 2 
 3 
 4 import com.example.tab1.R;
 5 
 6 import android.os.Bundle;
 7 import android.support.v4.app.Fragment;
 8 import android.view.LayoutInflater;
 9 import android.view.View;
10 import android.view.ViewGroup;
11 import android.widget.TextView;
12 
13 public class Fav_Fragment extends Fragment{
14 
15     @Override
16     public void onCreate(Bundle savedInstanceState) {
17         // TODO Auto-generated method stub
18         super.onCreate(savedInstanceState);
19     }
20 
21     @Override
22     public View onCreateView(LayoutInflater inflater, ViewGroup container,
23             Bundle savedInstanceState) {
24         View view            = inflater.inflate(R.layout.fav, container, false);
25         return view;
26     }
27 
28 }

3.fav.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent" 
 5     android:background="@android:color/white"
 6     android:orientation="vertical">
 7           <TextView
 8               android:layout_width="wrap_content"
 9               android:layout_height="wrap_content"
10               android:padding="8dp"
11               android:text="酒店收藏"
12               android:textColor="#000"
13               android:textSize="17sp" />
14 
15 
16 </LinearLayout>

还有一些细节美化部分，具体的请看代码吧。

链接: http://pan.baidu.com/s/1hqms1Qc 密码: z9m7