Fragment切换页面思路整理

通过慕课的学习现在整理下思路,使用fragment实现微信页面的切换,首先从整体思考:
我们需要先定义mainactivity.java;main.xml;
由于我们的微信是有顶部,中部,还有顶部三部分构成,
所以我们需要把这顶部和底部分别自定义布局,然后用include添加到main.xml.(具体布局看源码),俩个include中间写个linerlayout
然后定义4个fragment和它们的布局文件;
接下来在mainactivity中内实现切换功能.
首先定义我们需要的属性,分别有底部的tab的4个linerlayout,还有其TextView和ImageView,Fragment 1,2,3,4;
在oncreate方法内调用initView()方法实例化它们的属性,然后设置底部的tab的4个linerlayout的点击事件,这个要implements OnClickListener,然后在点击事件中首先要初始化其图片的默认内容,
我们要调用isselect(position)方法来动态添加fragment,调用isselect(position)后我们还要设置点击tab后点击图片的变化。
在isselect(position)的代码中先调用hideFragment方法因为这样会减少每次都要创建fragment的重复创建。还有isselect(position)中switch(position)中if~else的使用也使用的很好,可以想一想,当我们运行这些代码是我们的fragment还没有实例化,这样的话在switch(position)前的hideFragment调用后将不会产生影响,然后接着我们进行if~else判断.
如果fragment没有实例化将实例化并add(R.id.page,fragment1),
这样的话就被添加到页面上了,
如果fragment实例化后将show(fragment),显示内容。
重要思想:这个源码中运行过程中只会有创建一次fragment的实例,其后都是通过show和hide方法来显示的。

在这里的mainactivity中的思路很好。

这个是mainactivity.java

package cn.oddcloud.www.startoveragain7.FragmentDemo;


import android.os.Bundle;
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.Window;
import android.widget.ImageView;
import android.widget.LinearLayout;

import cn.oddcloud.www.startoveragain7.R;

public class MainActivity1 extends FragmentActivity implements View.OnClickListener{
    LinearLayout layout1;
    LinearLayout layout2;
    LinearLayout layout3;
    LinearLayout layout4;
    ImageView img1;
    ImageView img2;
    ImageView img3;
    ImageView img4;
    Fragment1 fragment1;
    Fragment2 fragment2;
    Fragment3 fragment3;
    Fragment4 fragment4;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.fragmentdemo);
        intiView();
        intiEvent();
        isSelect(0);

    }

    private void intiEvent() {
        layout1.setOnClickListener( this);
        layout2.setOnClickListener((View.OnClickListener) this);
        layout3.setOnClickListener((View.OnClickListener) this);
        layout4.setOnClickListener((View.OnClickListener) this);
    }

    private void intiView() {

        layout1= (LinearLayout) findViewById(R.id.tab1);
        layout2= (LinearLayout) findViewById(R.id.tab2);
        layout3= (LinearLayout) findViewById(R.id.tab3);
        layout4= (LinearLayout) findViewById(R.id.tab4);
        img1= (ImageView) findViewById(R.id.image1);
        img2= (ImageView) findViewById(R.id.image2);
        img3= (ImageView) findViewById(R.id.image3);
        img4= (ImageView) findViewById(R.id.image4);
    }
public void  isSelect(int position){
    FragmentManager fragmentManager=getSupportFragmentManager();
    FragmentTransaction fragmentTransaction=fragmentManager.beginTransaction();
    hideFragment(fragmentTransaction);
    switch (position) {
        case 0:
        if (fragment1 == null) {
            fragment1 = new Fragment1();
            fragmentTransaction.add(R.id.page1, fragment1);
        } else {
            fragmentTransaction.show(fragment1);
        }
            break;
        case 1:
            if (fragment2 == null) {
                fragment2 = new Fragment2();
                fragmentTransaction.add(R.id.page1, fragment2);
            } else {
                fragmentTransaction.show(fragment2);
            }
            break;
        case 2:
            if (fragment3 == null) {
                fragment3 = new Fragment3();
                fragmentTransaction.add(R.id.page1, fragment3);
            } else {
                fragmentTransaction.show(fragment3);
            }
            break;
        case 3:
            if (fragment4 == null) {
                fragment4 = new Fragment4();
                fragmentTransaction.add(R.id.page1, fragment4);
            } else {
                fragmentTransaction.show(fragment4);
            }
            break;

    }
    fragmentTransaction.commit();
}
  public void hideFragment(FragmentTransaction fragmentTransaction){
      if (fragment1!=null)
      {
         fragmentTransaction.hide(fragment1);
      }
      if (fragment2!=null)
      {
          fragmentTransaction.hide(fragment2);
      }
      if (fragment3!=null)
      {
          fragmentTransaction.hide(fragment3);
      }
      if (fragment4!=null)
      {
          fragmentTransaction.hide(fragment4);
      }


   }

    @Override
    public void onClick(View v) {
        ImageIdChange();
        switch (v.getId())
        {
            case R.id.tab1:
               isSelect(0);
                img1.setImageResource(R.drawable.tab_weixin_pressed);

                break;
            case R.id.tab2:

                isSelect(1);
                img2.setImageResource(R.drawable.tab_find_frd_pressed);
                break;
            case R.id.tab3:

                isSelect(2);
                img3.setImageResource(R.drawable.tab_address_pressed);
                break;
            case R.id.tab4:

                isSelect(3);
                img4.setImageResource(R.drawable.tab_settings_pressed);
                break;
        }
    }
    public void ImageIdChange(){
        img1.setImageResource(R.drawable.tab_weixin_normal);
        img2.setImageResource(R.drawable.tab_find_frd_normal);
        img3.setImageResource(R.drawable.tab_address_normal);
        img4.setImageResource(R.drawable.tab_settings_normal);

    }
}

其布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">
    <include layout="@layout/top"></include>
    <LinearLayout  android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:id="@+id/page1"></LinearLayout>
    <include layout="@layout/bottom"/>

</LinearLayout>

fragment1.java
其他3个fragment都差不多,
return inflater.inflate(R.layout.tab_1,null);改一下布局R.layout.tab_1即可


import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import cn.oddcloud.www.startoveragain7.R;

/** * Created by Administrator on 2016/5/5. */
public class Fragment1 extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.tab_1,null);
    }
}

fragment1的xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">
<TextView  android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tab_1" android:text="this is a 首页" android:gravity="center" android:textSize="23sp" />
</LinearLayout>

底部导航文件xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:background="@drawable/bottom_bar9" android:layout_height="wrap_content" android:gravity="center">
    <LinearLayout  android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/tab1" android:orientation="vertical">
        <ImageView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:id="@+id/image1" android:src="@drawable/tab_weixin_pressed"/>
        <TextView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="首页" android:id="@+id/text1" android:layout_gravity="center" android:textColor="#fff" />
    </LinearLayout>
    <LinearLayout  android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical" android:id="@+id/tab2">
        <ImageView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:id="@+id/image2" android:src="@drawable/tab_find_frd_normal"/>
        <TextView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="朋友" android:id="@+id/text2" android:layout_gravity="center" android:textColor="#fff"></TextView>
    </LinearLayout>
    <LinearLayout  android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical" android:id="@+id/tab3">

        <ImageView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/image3" android:layout_gravity="center" android:src="@drawable/tab_find_frd_normal"/>
        <TextView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="地址" android:layout_gravity="center" android:id="@+id/text3" android:textColor="#fff"></TextView>
    </LinearLayout>
    <LinearLayout  android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical" android:id="@+id/tab4">
        <ImageView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/image4" android:layout_gravity="center" android:src="@drawable/tab_settings_normal"/>
        <TextView  android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="设置" android:layout_gravity="center" android:id="@+id/text4" android:textColor="#fff"></TextView>
    </LinearLayout>

</LinearLayout>

顶部的xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:background="@drawable/title_bar9" android:layout_height="wrap_content" android:gravity="center_vertical" >
<TextView  android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="微信" android:gravity="center" android:layout_gravity="center_vertical" android:textSize="32sp" android:textColor="#fff" />


</LinearLayout>

你可能感兴趣的:(源码,Fragment,微信,页面切换,Fragment切换)