我的Android之旅（八）---ViewPage+Fragment+ListView

应用开发中应用比较广

下面就让我们来认识一下：

ViewPage+Fragment+ListView，这三者的搭配在应用开发中很常见，下面就举个例子，来具体的说一下他们之间的用法以及如何关联

Activity中的代码为：

package com.jerehedu.jerduech07;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.astuetz.PagerSlidingTabStrip;
import com.jerehedu.jerduech07.adapter.FragmentAdapter;
import com.jerehedu.jerduech07.fragment.PageFragment;

import java.util.ArrayList;
import java.util.List;

public class FragmentPageActivity extends AppCompatActivity {
private ViewPager vp;
    private PagerSlidingTabStrip pst;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fragment_page);
        vp= (ViewPager) findViewById(R.id.vp );
        pst= (PagerSlidingTabStrip) findViewById(R.id.pst);
        List<Fragment> list =new ArrayList<>();
        List<String> titles=new ArrayList<>();
        titles.add("体育");
        titles.add("娱乐");
        titles.add("奥运");
        titles.add("财经");
        titles.add("国际");
        for (int i=1;i<=5;i++){
            Fragment fragment=new PageFragment();
            Bundle bundle=new Bundle();
            bundle.putInt("arg",i);
            fragment.setArguments(bundle);
            list.add(fragment);
        }
        FragmentPagerAdapter ma=new FragmentAdapter
                (getSupportFragmentManager(),list,titles);
        vp.setAdapter(ma);
        //ViewPage自带的滑动效果
        //先缩小后放大
        //vp.setPageTransformer(true,new ZoomOutPageTransformer());
        //重影
        vp.setPageTransformer(true,new DepthPageTransformer());

        //pst的一些属性
        pst.setIndicatorColor(getResources().getColor(R.color.colorPrimary));
        //Indicator指示器颜色
        pst.setIndicatorHeight(5);
        //指示器高度
        pst.setTextColor(getResources().getColor(R.color.colorAccent));
        //标题栏字体颜色
        pst.setAllCaps(true);
        pst.setDividerColor(getResources().getColor(R.color.colorPrimaryDark));
        //分割线的颜色
        pst.setDividerPadding(10);
        //分割线距离上下的距离
        //pst.setUnderlineColor(getResources().getColor(R.color.colorAccent));
        //容易覆盖指示器的颜色
           pst.setShouldExpand(true);
        //均等分割标题栏的大小
        pst.setTabBackground(R.drawable.background_tab);
        //整体的背景颜色：按压标题栏后的颜色
        pst.setViewPager(vp);

    }
}

主布局中的代码为：

PagerSlidingTabStrip

ViewPage的标题栏：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.jerehedu.jerduech07.FragmentPageActivity">
    <com.astuetz.PagerSlidingTabStrip
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:id="@+id/pst">
    </com.astuetz.PagerSlidingTabStrip>
    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/vp"
        android:layout_below="@+id/pst">
    </android.support.v4.view.ViewPager>
</RelativeLayout>

Fragment中的代码：

package com.jerehedu.jerduech07.fragment;


import android.content.Intent;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.Toast;

import com.jerehedu.jerduech07.IntentActivity;
import com.jerehedu.jerduech07.R;
import com.jerehedu.jerduech07.adapter.MyListAdapter;
import com.jerehedu.jerduech07.entity.News;

import java.util.ArrayList;
import java.util.List;

/**
 * A simple {@link Fragment} subclass.
 */
public class PageFragment extends Fragment {


    public PageFragment() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_page, container, false);
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        final List<News>  list=new ArrayList<>();
        ListView lv= (ListView) getView().findViewById(R.id.lv);
        MyListAdapter ma=new MyListAdapter(list,getActivity());
        lv.setAdapter(ma);
        final Bundle bundle=  getArguments();
        //监听方法
        lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
               News news=list.get(position);
                Toast.makeText(getActivity(),news.getTitle(),Toast.LENGTH_SHORT).show();
                Intent intent=new Intent(getActivity(), IntentActivity.class);
                //intent.putExtra("obj",news);
                intent.putExtra("obj",news);
                //注意参数 不同，方法的重载
                //传送Bundle数据类型
                Bundle b1=new Bundle();
                b1.putString("arg1","今天是情人节");
                intent.putExtra("bundle",b1);
                startActivity(intent);
            }
        });
        if (bundle!=null){
        int arg= bundle.getInt("arg");
          //  tv.setText("我是fragment"+arg);
            switch (arg){
                case 1:
                    for (int i=1;i<=20;i++){
                     list.add(new News(R.mipmap.e1, "体育新闻" + i, "今天", "新浪"));
                }
                    ma.notifyDataSetChanged();
                    //通知数据变更
                    break;
                case 2:
                    for (int i=0;i<20;i++){
                        list.add(new News(R.mipmap.e2,"娱乐新闻"+i,"昨天","网易"));
                    }
                    ma.notifyDataSetChanged();
                    break;
                case 3:
                    for (int i=0;i<20;i++){
                        list.add(new News(R.mipmap.f1,"奥运新闻"+i,"刚刚","腾讯"));
                    }
                    ma.notifyDataSetChanged();
                    break;
                case 4:
                    for (int i=0;i<20;i++){
                        list.add(new News(R.mipmap.f2,"财经新闻"+i,"今天","新浪"));
                    }
                    ma.notifyDataSetChanged();
                    break;
                case 5:
                    for (int i=0;i<20;i++){
                        list.add(new News(R.mipmap.f3,"国际新闻"+i,"今天","微博"));
                    }
                    ma.notifyDataSetChanged();
                    break;
            }
        }
    }
}

Listview中的代码：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.jerehedu.jerduech07.fragment.PageFragment">
    
<ListView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/lv">
</ListView>
</FrameLayout>

最重要的是ListView需要继承BaseAdapter,同样Fragment也需要继承FragmentPageAdapter

BaseAdapter

package com.jerehedu.jerduech07.adapter;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import com.jerehedu.jerduech07.R;
import com.jerehedu.jerduech07.entity.News;

import java.util.List;

/**
 * Created by 王明松 on 0092016/8/9.
 */
public class MyListAdapter extends BaseAdapter{
    private List<News> list;
    private Context context;

    public MyListAdapter(List<News> list, Context context) {
        this.list = list;
        this.context = context;
    }

    @Override
    public int getCount() {
        return list.size();
    }

    @Override
    public Object getItem(int position) {
        return list.get(position);
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
       ViewHold vh;
        if (convertView==null){
            vh=new ViewHold();
            convertView= LayoutInflater.from(context).inflate(R.layout.list_layout,null);
            vh.img= (ImageView) convertView.findViewById(R.id.img);
            vh.title= (TextView) convertView.findViewById(R.id.title);
            vh.pubdate= (TextView) convertView.findViewById(R.id.pubDate);
            vh.from= (TextView) convertView.findViewById(R.id.from);
            convertView.setTag(vh);
        }else {
            vh=(ViewHold)convertView.getTag();
        }
        News news=list.get(position);
        vh.img.setImageResource(news.getImg());
        vh.title.setText(news.getTitle());
        vh.pubdate.setText(news.getPubDate());
        vh.from.setText(news.getFrom());
        return convertView;
    }
    private  class  ViewHold{
        ImageView img;
        TextView title;
        TextView pubdate;
        TextView from;
    }
}

FragmentPageAdapter:

package com.jerehedu.jerduech07.adapter;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * Created by 王明松 on 0092016/8/9.
 */
public class FragmentAdapter extends FragmentPagerAdapter {
private List<Fragment> list;
    private  List<String> titles;
    public FragmentAdapter(FragmentManager fm,
                           List<Fragment> list,
                           List<String> titles) {
        super(fm);
        this.list=list;
        this.titles=titles;
    }
    @Override
    public Fragment getItem(int position) {
        return list.get(position);
    }
    @Override
    public int getCount() {
        return list.size();
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return titles.get(position);
    }
}

子布局代码：

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

<ImageView
    android:layout_width="150dp"
    android:layout_height="70dp"
    android:src="@mipmap/ic_launcher"
    android:id="@+id/img"
    android:layout_below="@+id/title"
    android:layout_alignParentStart="true"
    android:layout_marginTop="44dp" />
<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="我是标题"
    android:id="@+id/title"
    android:layout_alignParentTop="true"
    android:layout_toEndOf="@+id/img"
    android:layout_marginStart="46dp" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/pubDate"
        android:text="今天"
        android:layout_alignBottom="@+id/img"
        android:layout_toEndOf="@+id/img" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/from"
        android:text="新浪"
        android:layout_marginStart="95dp"
        android:layout_alignTop="@+id/pubDate"
        android:layout_toEndOf="@+id/img" />
</RelativeLayout>

运行结果