• ViewPage+Frament+listView滑动效果


    近期在做一个须要使用Frament+ViewPage制作一个滑动的效果,看了非常多资料,最终实现了,这与大家分享一下战果

    总结一下。这里我做了一个Demo分享给大家

    我的文件文件夹结构图


    1。首先要有一个ViewPage组件,他是3.0以后出现的,所以要导入android.support.v4这个包

    先来建立一个mian布局文件

    activity_main.xml

    这个布局使用RadioGroup和RadioButton组合,在上面显示第一页。和第二页。以下就是ViewPage

    <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" 
        android:background="#ffffff"
        >

        <RadioGroup
            android:id="@+id/radio_group"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"    
            android:orientation="horizontal" >

            <RadioButton
                android:id="@+id/first"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1.0"
                android:background="@drawable/chat_tab_selector_2"
                android:button="@null"
                android:checked="true"
                android:gravity="center"
                android:text="第一页"
                android:textColor="#000000"
                android:textSize="18sp" />
            <RadioButton
                android:id="@+id/second"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1.0"
                android:background="@drawable/chat_tab_selector_2"
                android:button="@null"
                android:gravity="center"
                android:text="第二页"
                android:textColor="#000000"
                android:textSize="18sp" />
        </RadioGroup>
        <android.support.v4.view.ViewPager
            android:id="@+id/view_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/radio_group" >
        </android.support.v4.view.ViewPager>

    </RelativeLayout>


    然后在MainActivity中代码:

    注意这里一定要继承FragmentActivity ,不然是Frament管理器是建立不了滴。

    package com.example.activity;
    import java.util.ArrayList;
    import java.util.List;
    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.FragmentPagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.support.v4.view.ViewPager.OnPageChangeListener;
    import android.widget.RadioGroup;
    import android.widget.RadioGroup.OnCheckedChangeListener;


    import com.example.content.NumberConstant;
    import com.example.frament.MyExampleFragment;
    import com.example.viewpagedemo.R;

    public class MainActivity extends FragmentActivity implements OnCheckedChangeListener {


    private RadioGroup radioGroup;
    private ViewPager viewPager;
    private List<MyExampleFragment> pagerList = new ArrayList<MyExampleFragment>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    radioGroup = (RadioGroup) findViewById(R.id.radio_group);
    viewPager = (ViewPager) findViewById(R.id.view_pager);
    radioGroup.check(R.id.first);
    radioGroup.setOnCheckedChangeListener(this);// 设置监听器
    pagerList.clear();
    initDataFrament();//初始化Frament

    }

    /**

    这里我用的是同一个Frament展示不同的数据,我的这个Demo里展示的数据类似,所哟不须要用两个Frament,假设你有须要能够建立多个Frament,然后我还传递了FramentType来区分,展示不同的数据

    */
    public void initDataFrament() {
    MyExampleFragment fragment1 = MyExampleFragment.newInstance();
    Bundle bundle1 = new Bundle();
    bundle1.putString("fragmentType", "fragment1");
    fragment1.setArguments(bundle1);
    pagerList.add(fragment1);


    MyExampleFragment fragment2 = MyExampleFragment.newInstance();
    Bundle bundle2 = new Bundle();
    bundle2.putString("fragmentType", "fragment2");
    fragment2.setArguments(bundle2);
    pagerList.add(fragment2);

    MyPageListAdpter pageAdapter = new                   MyPageListAdpter(this.getSupportFragmentManager(),pagerList,radioGroup);
    viewPager.setAdapter(pageAdapter);//设置适配器
    viewPager.setOnPageChangeListener(pageAdapter);//设置监听
    }


    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
    if (checkedId == R.id.first) {
    viewPager.setCurrentItem(NumberConstant.ZERO, true);//这里是两个常量来区分是欢动哪一个frament
    } else if (checkedId == R.id.second) {
    viewPager.setCurrentItem(NumberConstant.ONE, true);
    }
    }

    /**
    * 定义一个适配器实现滑动
    * @author shaozucheng
    *
    */
    private class MyPageListAdpter extends FragmentPagerAdapter implements OnPageChangeListener {


    /**
    * 保存滑动子页的list
    */
    private List<MyExampleFragment> pagerList;

    /**
    * 标签页
    */
    private RadioGroup selectTag;

    public MyPageListAdpter(FragmentManager fm, List<MyExampleFragment> pagerList, RadioGroup selectTag) {
    super(fm);
    this.pagerList = pagerList;
    this.selectTag = selectTag;
    }

    @Override
    public Fragment getItem(int arg0) {
    return pagerList.get(arg0);
    }

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

    @Override
    public void onPageScrollStateChanged(int arg0) {

    }

    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {

    }

    @Override
    public void onPageSelected(int arg0) {
    if (arg0 == 0) {
    selectTag.check(R.id.first);
    } else if (arg0 == 1) {
    selectTag.check(R.id.second);
    }
    }

    }

    }

    然后就是要先建立一个Frament布局。这个布局里就是存放展示数据的listView的了由于你是要在Frament里展示的。

    文件名称为:example_widget_listview.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:orientation="vertical" >


        <ListView
            android:id="@+id/example_listview"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@null"//去掉背景色
            android:divider="@null"//去掉线条
            android:scrollbars="none"//去掉滚动栏
            android:visibility="visible" >
        </ListView>
    </LinearLayout>


    然后就用写在Frament中初始化数据了,或者你也能够在Activity中初始化数据,然后传到Frament中。那样Frament仅仅负责展示数据,两种方式都能够

    注意这里的自己定义的Frament要继承Frament

    package com.example.frament;
    import java.util.ArrayList;
    import java.util.List;
    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.ListView;
    import com.example.adapter.PersonListAdapter;
    import com.example.ato.Person;
    import com.example.viewpagedemo.R;


    /**
     * 
     * @author shaozucheng
     * 
     */

    public class MyExampleFragment extends Fragment {


    /**
    * 列表
    */
    private ListView listView;
    /**
    * 适配器
    */
    private PersonListAdapter adapter;


    public PersonListAdapter getAdapter() {
    return adapter;
    }


    public void setAdapter(PersonListAdapter adapter) {
    this.adapter = adapter;
    }


    public static MyExampleFragment newInstance() {
    MyExampleFragment fragment = new MyExampleFragment();
    return fragment;
    }


    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.example_widget_listview, container, false);
    listView = (ListView) view.findViewById(R.id.example_listview);
    initMettingFrament();
    return view;
    }


    /**
    * 初始化数据源
    */
    private void initMettingFrament() {
    Person p0 = new Person();
    Person p1 = new Person();
    Person p2 = new Person();
    p0.setName("荔枝");
    p1.setName("香蕉");
    p2.setName("苹果");


    Person p3 = new Person();
    Person p4 = new Person();
    Person p5 = new Person();
    p3.setName("黎明");
    p4.setName("邓超");
    p5.setName("董洁");


    List<Person> list1 = new ArrayList<Person>();
    list1.add(p1);
    list1.add(p2);
    list1.add(p0);


    List<Person> list2 = new ArrayList<Person>();
    list2.add(p3);
    list2.add(p4);
    list2.add(p5);


    String framentType = this.getArguments().getString("fragmentType");
    if (framentType.equals("fragment1")) {


    adapter = new PersonListAdapter(getActivity(), list1);
    } else if (framentType.equals("fragment2")) {
    adapter = new PersonListAdapter(getActivity(), list2);
    }
    listView.setAdapter(adapter);//设置展示数据的适配器
    listView.setOnItemClickListener(adapter);//设置监听。点击item每一栏的跳转事件,假设不须要的话,你能够不用设置
    }


    }

    items_list.xml布局文件

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/forum_toipc_list"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#ffffff" >


        <RelativeLayout
            android:id="@+id/rel_conrent"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp" >

    <!--为了效果好看我在每个item里面放了一张固定大小的图片  -->
            <ImageView
                android:id="@+id/image"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_centerVertical="true"
                android:layout_marginTop="5dp"
                android:contentDescription="@null"
                android:paddingTop="5dp"
                android:src="@drawable/image1"
                android:visibility="visible" />


            <TextView
                android:id="@+id/content"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginLeft="5dp"
                android:layout_toRightOf="@id/image"
                android:gravity="center_vertical"
                android:layout_centerVertical="true"
                android:textColor="#ff0000"
                android:textSize="18sp" />
        </RelativeLayout>


        <ImageView
            android:id="@+id/item_forum_line"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/rel_conrent"
            android:background="@drawable/list_divide_line"
            android:contentDescription="@null"
            android:visibility="visible" />


    </RelativeLayout>


    然后须要一个适配器展示item

    package com.example.adapter;


    import java.util.List;


    import android.app.Activity;
    import android.content.Context;
    import android.content.Intent;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.AdapterView;
    import android.widget.AdapterView.OnItemClickListener;
    import android.widget.BaseAdapter;
    import android.widget.TextView;


    import com.example.activity.SecondActivity;
    import com.example.ato.Person;
    import com.example.viewpagedemo.R;


    /**
     * 
     * @author shaozucheng
     * 
     */
    public class PersonListAdapter extends BaseAdapter implements OnItemClickListener {


    /**
    * 自己定义图层
    */
    private LayoutInflater inflater;


    private Activity mActivity;


    private List<Person> list;


    public PersonListAdapter(Activity mActivity, List<Person> list) {
    this.mActivity = mActivity;
    this.list = list;
    }


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


    @Override
    public Object getItem(int position) {
    return null;
    }


    @Override
    public long getItemId(int position) {
    return position;
    }


    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder = null;
    if (convertView == null) {
    inflater = (LayoutInflater) mActivity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    convertView = inflater.inflate(R.layout.items_list, null);
    holder = new ViewHolder();
    holder.content = (TextView) convertView.findViewById(R.id.content);
    convertView.setTag(holder);
    } else {
    holder = (ViewHolder) convertView.getTag();
    }


    Person dto = list.get(position);
    if (dto != null) {
    holder.content.setText(dto.getName());
    }


    return convertView;
    }


    /**
    * 自己定义内部类

    * @author shaozucheng

    */
    class ViewHolder {
    TextView content;// 内容


    }

    /**

    实现OnItemClickListener 接口。然后在这个监听器里就能够跳转到下一个Activity了

    */
    @Override
    public void onItemClick(AdapterView<?

    > arg0, View arg1, int arg2, long arg3) {
    Intent intent = new Intent(mActivity, SecondActivity.class);
    mActivity.startActivity(intent);
    }


    }

    点击每个Activity跳转到SecondActivity,在SecondActivty 中你能够做你须要做的业务了,这里我就写下去了,依据你项目的须要

    package com.example.activity;
    import com.example.viewpagedemo.R;
    import android.app.Activity;
    import android.os.Bundle;

    public class SecondActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_second);
    }
    }


    SecondActivity中的布局文件 activity_second.xml 依据须要自己去扩展。

    <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"
        android:background="#ffffff" >


        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="secondActivity" />


    </RelativeLayout>

    不要忘记了在AndroidManifest.xml注冊一下SecondActivity。

    最后的效果图

     



    这里提供一个源码下载地址:不懂的能够去下载看一下:须要3个积分哟点击打开链接

  • 相关阅读:
    单调递增的数字
    合并K个升序链表
    ISO 8 自适应cell
    动态计算UITableViewCell高度
    APP上传
    多线程 GCD队列组
    多线程 线程之间的通信
    多线程 GCD
    多线程 线程同步问题
    多线程 线程的状态
  • 原文地址:https://www.cnblogs.com/claireyuancy/p/6887924.html
Copyright © 2020-2023  润新知