android Fragment实现APP主界面Tab页面切换和点击事件

版权声明:本文为博主编写文章,未经博主允许转载,转载请注明出处。 https://blog.csdn.net/u012373815/article/details/47709213

Fragment 页面切换不能滑动 所以对于listview 可以添加的左右滑动事件 ,不会有冲突例如(QQ的好友列表的删除)
Fragment 和viewpager 的区别
Viewpager 的事件都需要写在 MainActivity 使得 MainActivity 类非常冗余
Fragment 内部的事件则可以由其内部去处理分成多个类。便于维护和管理 MainActivity 只起到一个调度的作用
效果图
这里写图片描述
源代码我已上传资源页
Fragment实现页面切换和点击事件
(注意引用时要全部引用这个android.support.v4.app)
MainActivity .java

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.TextView;

public class MainActivity extends FragmentActivity implements OnClickListener {
    private TextView t1;
    private TextView t2;
    private TextView t3;

    private Fragment tab1;
    private Fragment tab2;
    private Fragment tab3;

    @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() {
        // TODO Auto-generated method stub
        t1.setOnClickListener(this);
        t2.setOnClickListener(this);
        t3.setOnClickListener(this);
    }
//初始化
    private void initView() {
        t1 = (TextView) findViewById(R.id.text1);
        t2 = (TextView) findViewById(R.id.text2);
        t3 = (TextView) findViewById(R.id.text3);

    }

    /**
     * 将tab 的text 初始化
     */
    public void reset() {
        t1.setText("标题1");
        t2.setText("标题2");
        t3.setText("标题3");
    }

    //设置Fragment内容区域
    private void setSelect(int i) {
        FragmentManager fm=getSupportFragmentManager();
        FragmentTransaction trs=fm.beginTransaction();
        //隐藏Fragment
        hideFragment(trs);

        // 把text 切换为选中
        switch (i) {
        case 0:
            if(tab1==null)
            {
                tab1=new Fragment1();
                trs.add(R.id.id_content, tab1);
            }else
            {
                trs.show(tab1); 
            }
            t1.setText("选中");
            break;
        case 1:
            if(tab2==null)
            {
                tab2=new Fragment2();   
                trs.add(R.id.id_content, tab2);
            }else
            {
                trs.show(tab2); 
            }
            t2.setText("选中");
            break;

        case 2:
            if(tab3==null)
            {
                tab3=new Fragment3();
                trs.add(R.id.id_content, tab3);
            }else
            {
                trs.show(tab3); 
            }
            t3.setText("选中");
            break;

        default:        
            break;
        }
        trs.commit();
    }
/*
 * 隐藏所有的Fragment
 */
    private void hideFragment(FragmentTransaction trs) {

        if(tab1!=null)
        {
            trs.hide(tab1);
        }
        if(tab2!=null)
        {
            trs.hide(tab2);
        }
        if(tab3!=null)
        {
            trs.hide(tab3);
        }

    }

    @Override
    public void onClick(View v) {
        reset();
        switch (v.getId()) {
        case R.id.text1:
            setSelect(0);
            break;
        case R.id.text2:
            setSelect(1);

            break;
        case R.id.text3:
            setSelect(2);
            break;

        default:
            break;
        }
    }
}

三个Fragment (请注意第二个有点击事件)
Fragment1.java

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class Fragment1 extends Fragment {
    private View tab1view;
    @Override
    public View onCreateView(LayoutInflater inflater,
             ViewGroup container,  Bundle savedInstanceState) {
        tab1view=inflater.inflate(R.layout.tab1, container, false); 
        return tab1view;
    }
}

Fragment2.java

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.Toast;
public class Fragment2 extends Fragment {
private View tab2view;
    @Override
    public View onCreateView(LayoutInflater inflater,
             ViewGroup container,  Bundle savedInstanceState) {
        tab2view=inflater.inflate(R.layout.tab2, container, false);
        Button button=(Button)tab2view.findViewById(R.id.button2);
        button.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                Toast.makeText(getActivity(), "点击了我", Toast.LENGTH_SHORT).show();
            }
        });
        return tab2view;    
    }       
}

Fragment3.java

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class Fragment3 extends Fragment {
    private View tab3view;
    @Override
    public View onCreateView(LayoutInflater inflater,
             ViewGroup container,  Bundle savedInstanceState) {
        tab3view=inflater.inflate(R.layout.tab3, container, false); 
        return tab3view;
    }
}

布局文件xml
activity_main.xml(小技巧 用include 引用xml 可以提高代码的重用性,并且方便维护和管理)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#EEEEEE"
    android:orientation="vertical" >
    <FrameLayout
        android:id="@+id/id_content"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >
    </FrameLayout>
<include  layout="@layout/bottom"/>
</LinearLayout>

bottom.xml 底部菜单

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="45dp"
    android:orientation="horizontal" >    
        <TextView
            android:id="@+id/text1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text="标题1"
            android:textColor="#000000"
            android:textSize="18.0dip" />

        <TextView
            android:id="@+id/text2"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text="标题2"
            android:textColor="#000000"
            android:textSize="18.0dip" />

        <TextView
            android:id="@+id/text3"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text="标题3"
            android:textColor="#000000"
            android:textSize="18.0dip" />
</LinearLayout>

tab1.xml
(三个tab布局都只是添加了一个背景图片和前篇博客viewpager 一样)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/image20"
    android:orientation="vertical" >

    <ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

tab2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
     android:background="@drawable/image29"
    android:orientation="vertical" >
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />
</LinearLayout>

tab3.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
        android:background="@drawable/image1"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <SeekBar
        android:id="@+id/seekBar1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>
展开阅读全文

没有更多推荐了,返回首页