tab界面实现方式之Fragment

Posted 2020-08-12

相信大家都用过qq，关于qq的界面是怎么实现的呢？其实它的界面就是我们今天要说的--用Fragment来实现tab。

首先，我们来说说这个方式的优点：

  1.减少MainActivity类中的代码，将代码分配给相应的Fragment类中

  2.由于创建了多个Fragment来管理布局，因此后期维护更加容易，只需要更改相应的Fragment就行

  3.在单个Fragment中可以实现更多的功能，想一想qq的向右滑动与向左滑动。如果是viewpager，则不能这些功能。

好，话不多说，直接贴代码

MainActivity布局文件

xml代码

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6     tools:context="com.example.android_tab1.MainActivity" >
 7 
 8     <LinearLayout
 9         android:layout_width="match_parent"
10         android:layout_height="wrap_content" >
11 
12         <include layout="@layout/top" />
13     </LinearLayout>
14     <FrameLayout 
15         android:id="@+id/framelayout"
16         android:layout_width="match_parent"
17         android:layout_height="0dp"
18         android:layout_weight="1"
19         ></FrameLayout>
20     <LinearLayout
21         android:layout_width="match_parent"
22         android:layout_height="wrap_content" >
23 
24         <include layout="@layout/bottom" />
25     </LinearLayout>
26 
27 </LinearLayout>

其他的xml代码，比如top.xml,  buttom.xml,  view1.xml,  view2.xml,  view3.xml,  view4.xml代码都与上一文章中的一样的，这里我就不贴了

WeixinFragment代码

JAVA代码

 1 package com.example.Fragment;
 2 
 3 
 4 import com.example.android_tab2.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 
12 public class WeixinFragment extends Fragment{
13     @Override
14     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
15         // TODO Auto-generated method stub
16         return inflater.inflate(R.layout.view1, container, false);
17     }
18 }

FriendFragment代码

JAVA代码

 1 package com.example.Fragment;
 2 
 3 
 4 import com.example.android_tab2.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 
12 public class FriendFragment extends Fragment{
13     @Override
14     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
15         // TODO Auto-generated method stub
16         return inflater.inflate(R.layout.view2, container, false);
17     }
18 }

AddressFragment代码

JAVA代码

 1 package com.example.Fragment;
 2 
 3 
 4 import com.example.android_tab2.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 
12 public class AddressFragment extends Fragment{
13     @Override
14     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
15         // TODO Auto-generated method stub
16         return inflater.inflate(R.layout.view3, container, false);
17     }
18 }

SettingFragment代码

JAVA代码

 1 package com.example.Fragment;
 2 
 3 
 4 import com.example.android_tab2.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 
12 public class SettingFragment extends Fragment{
13     @Override
14     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
15         // TODO Auto-generated method stub
16         return inflater.inflate(R.layout.view4, container, false);
17     }
18 }

MainActivity代码

JAVA代码

  1 package com.example.android_tab2;
  2 
  3 import com.example.Fragment.AddressFragment;
  4 import com.example.Fragment.FriendFragment;
  5 import com.example.Fragment.SettingFragment;
  6 import com.example.Fragment.WeixinFragment;
  7 
  8 import android.os.Bundle;
  9 import android.support.v4.app.Fragment;
 10 import android.support.v4.app.FragmentActivity;
 11 import android.support.v4.app.FragmentManager;
 12 import android.support.v4.app.FragmentTransaction;
 13 import android.util.Log;
 14 import android.view.View;
 15 import android.view.View.OnClickListener;
 16 import android.view.Window;
 17 import android.widget.ImageButton;
 18 import android.widget.LinearLayout;
 19 
 20 public class MainActivity extends FragmentActivity implements OnClickListener{
 21     private LinearLayout linear_weixin = null;
 22     private LinearLayout linear_friend = null;
 23     private LinearLayout linear_address = null;
 24     private LinearLayout linear_setting = null;
 25     
 26     private ImageButton imagebutton_weixin = null;
 27     private ImageButton imagebutton_friend = null;
 28     private ImageButton imagebutton_address = null;
 29     private ImageButton imagebutton_setting = null;
 30     
 31     private Fragment weixinFragment = null;
 32     private Fragment friendFragment = null;
 33     private Fragment addressFragment = null;
 34     private Fragment settingFragment = null;
 35     protected void onCreate(Bundle savedInstanceState) {
 36         super.onCreate(savedInstanceState);
 37         requestWindowFeature(Window.FEATURE_NO_TITLE);
 38         setContentView(R.layout.activity_main);
 39         initview();
 40         initEvents();
 41         change(0);
 42     }
 43 
 44     private void initview() {
 45         linear_weixin = (LinearLayout) findViewById(R.id.linear_weixin);
 46         linear_friend = (LinearLayout) findViewById(R.id.linear_friend);
 47         linear_address = (LinearLayout) findViewById(R.id.linear_address);
 48         linear_setting = (LinearLayout) findViewById(R.id.linear_setting);
 49         
 50         
 51         imagebutton_weixin = (ImageButton) findViewById(R.id.imagebutton_weixin);
 52         imagebutton_friend = (ImageButton) findViewById(R.id.imagebutton_friend);
 53         imagebutton_address = (ImageButton) findViewById(R.id.imagebutton_address);
 54         imagebutton_setting = (ImageButton) findViewById(R.id.imagebutton_setting);
 55         
 56     }
 57     private void initEvents() {
 58         linear_weixin.setOnClickListener(this);
 59         linear_friend.setOnClickListener(this);
 60         linear_address.setOnClickListener(this);
 61         linear_setting.setOnClickListener(this);
 62     }
 63 
 64 
 65     public void onClick(View v) {
 66         resetImage();
 67         switch(v.getId())
 68         {
 69             case R.id.linear_weixin:
 70             {
 71                 change(0);
 72                 break;
 73             }
 74             case R.id.linear_friend:
 75             {
 76                 change(1);
 77                 break;
 78             }
 79             case R.id.linear_address:
 80             {
 81                 change(2);
 82                 break;
 83             }
 84             case R.id.linear_setting:
 85             {
 86                 change(3);
 87                 break;
 88             }
 89         }
 90     }
 91     private void change(int i)
 92     {
 93         //获得Fragment的管理员
 94         FragmentManager manager = getSupportFragmentManager();
 95         FragmentTransaction transaction = manager.beginTransaction();
 96         //将所有的Fragment隐藏起来
 97         hideFragment(transaction);
 98         switch(i)
 99         {
100             case 0:
101             {
102                 imagebutton_weixin.setImageResource(R.drawable.tab_weixin_pressed);
103                 if(weixinFragment == null)
104                 {
105                     weixinFragment = new WeixinFragment();
106                     transaction.add(R.id.framelayout, weixinFragment);
107                 }
108                 else
109                 {
110                     Log.i("main", "1");
111                     transaction.show(weixinFragment);
112                 }
113                 
114                 break;
115             }
116             case 1:
117             {
118                 imagebutton_friend.setImageResource(R.drawable.tab_find_frd_pressed);
119                 if(friendFragment == null)
120                 {
121                     friendFragment = new FriendFragment();
122                     transaction.add(R.id.framelayout, friendFragment);
123                 }
124                 else
125                 {
126                     Log.i("main", "2");
127                     //显示特定Fragment
128                     transaction.show(friendFragment);
129                 }
130                 
131                 break;
132             }
133             case 2:
134             {
135                 imagebutton_address.setImageResource(R.drawable.tab_address_pressed);
136                 if(addressFragment == null)
137                 {
138                     addressFragment = new AddressFragment();
139                     transaction.add(R.id.framelayout, addressFragment);
140                 }
141                 else
142                 {
143                     Log.i("main", "3");
144                     transaction.show(addressFragment);
145                 }
146                 
147                 break;
148             }
149             case 3:
150             {
151                 imagebutton_setting.setImageResource(R.drawable.tab_settings_pressed);
152                 if(settingFragment == null)
153                 {
154                     settingFragment = new SettingFragment();
155                     transaction.add(R.id.framelayout, settingFragment);
156                 }
157                 else
158                 {
159                     Log.i("main", "4");
160                     transaction.show(settingFragment);
161                 }
162                 
163                 break;
164             }
165         }
166         transaction.commit();
167     }
168     private void hideFragment(FragmentTransaction transaction)
169     {
170         if(weixinFragment != null)
171         {
172             //隐藏特定的Fragment
173             transaction.hide(weixinFragment);
174         }
175         if(friendFragment != null)
176         {
177             transaction.hide(friendFragment);
178         }
179         if(addressFragment != null)
180         {
181             transaction.hide(addressFragment);
182         }
183         if(settingFragment != null)
184         {
185             transaction.hide(settingFragment);
186         }
187     }
188     private void resetImage()
189     {
190         imagebutton_weixin.setImageResource(R.drawable.tab_weixin_normal);
191         imagebutton_friend.setImageResource(R.drawable.tab_find_frd_normal);
192         imagebutton_address.setImageResource(R.drawable.tab_address_normal);
193         imagebutton_setting.setImageResource(R.drawable.tab_settings_normal);
194     }
195 }