【IMOOC学习笔记】多种多样的App主界面Tab实现方法(二)
Fragment实现Tab
首先把activity_main.xml 文件中的ViewPager标签改成Fragment标签
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <FrameLayout 2 android:id="@+id/id_content" 3 android:layout_width="fill_parent" 4 android:layout_height="0dp" 5 android:layout_weight="1" > 6 </FrameLayout>
其他的xml文件都跟上一篇中一样,就不重复了。
与之前的ViewPager不同的是,我们还要为每个tab新建一个相应的Fragment类,并且在Fragment类中填充视图
如下:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
package com.imooc.tab02; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class WeixinFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.tab01, container, false); } }
最后看看MainActivity类
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
package com.imooc.tab02; import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentActivity; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentTransaction; import android.view.View; import android.view.View.OnClickListener; import android.view.Window; import android.widget.ImageButton; import android.widget.LinearLayout; public class MainActivity extends FragmentActivity implements OnClickListener { private LinearLayout mTabWeixin; private LinearLayout mTabFrd; private LinearLayout mTabAddress; private LinearLayout mTabSettings; private ImageButton mImgWeixin; private ImageButton mImgFrd; private ImageButton mImgAddress; private ImageButton mImgSettings; private Fragment mTab01; private Fragment mTab02; private Fragment mTab03; private Fragment mTab04; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); initView(); initEvent(); setSelect(0); } private void initEvent() { mTabWeixin.setOnClickListener(this); mTabFrd.setOnClickListener(this); mTabAddress.setOnClickListener(this); mTabSettings.setOnClickListener(this); } private void initView() { mTabWeixin = (LinearLayout) findViewById(R.id.id_tab_weixin); mTabFrd = (LinearLayout) findViewById(R.id.id_tab_frd); mTabAddress = (LinearLayout) findViewById(R.id.id_tab_address); mTabSettings = (LinearLayout) findViewById(R.id.id_tab_settings); mImgWeixin = (ImageButton) findViewById(R.id.id_tab_weixin_img); mImgFrd = (ImageButton) findViewById(R.id.id_tab_frd_img); mImgAddress = (ImageButton) findViewById(R.id.id_tab_address_img); mImgSettings = (ImageButton) findViewById(R.id.id_tab_settings_img); } private void setSelect(int i) { FragmentManager fm = getSupportFragmentManager(); FragmentTransaction transaction = fm.beginTransaction(); hideFragment(transaction); switch (i) { case 0: if (mTab01 == null) { mTab01 = new WeixinFragment(); transaction.add(R.id.id_content, mTab01); } else { transaction.show(mTab01); } mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed); break; case 1: if (mTab02 == null) { mTab02 = new FrdFragment(); transaction.add(R.id.id_content, mTab02); } else { transaction.show(mTab02); } mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed); break; case 2: if (mTab03 == null) { mTab03 = new AddressFragment(); transaction.add(R.id.id_content, mTab03); } else { transaction.show(mTab03); } mImgAddress.setImageResource(R.drawable.tab_address_pressed); break; case 3: if (mTab04 == null) { mTab04 = new SettingFragment(); transaction.add(R.id.id_content, mTab04); } else { transaction.show(mTab04); } mImgSettings.setImageResource(R.drawable.tab_settings_pressed); break; default: break; } transaction.commit(); } private void hideFragment(FragmentTransaction transaction) { if (mTab01 != null) { transaction.hide(mTab01); } if (mTab02 != null) { transaction.hide(mTab02); } if (mTab03 != null) { transaction.hide(mTab03); } if (mTab04 != null) { transaction.hide(mTab04); } } @Override public void onClick(View v) { resetImgs(); switch (v.getId()) { case R.id.id_tab_weixin: setSelect(0); break; case R.id.id_tab_frd: setSelect(1); break; case R.id.id_tab_address: setSelect(2); break; case R.id.id_tab_settings: setSelect(3); break; default: break; } } private void resetImgs() { mImgWeixin.setImageResource(R.drawable.tab_weixin_normal); mImgFrd.setImageResource(R.drawable.tab_find_frd_normal); mImgAddress.setImageResource(R.drawable.tab_address_normal); mImgSettings.setImageResource(R.drawable.tab_settings_normal); } }
Android 小女子