ViewPager控件的Demo

最新推荐文章于 2019-07-16 16:00:37 发布

anmai7157

最新推荐文章于 2019-07-16 16:00:37 发布

阅读量102

点赞数

文章标签：移动开发 java

原文链接：http://www.cnblogs.com/zhongyinghe/p/5492070.html

版权

1、主视图

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6      >
 7 
 8     <include layout="@layout/head"/>
 9     <android.support.v4.view.ViewPager
10         android:layout_width="match_parent"
11         android:layout_height="0dip"
12         android:layout_weight="1"
13         android:id="@+id/vp"
14         />
15 
16 </LinearLayout>

2、主视图头部

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="wrap_content"
 5     android:orientation="vertical" >
 6 
 7     <LinearLayout
 8         android:layout_width="match_parent"
 9         android:layout_height="wrap_content"
10         android:padding="10dip"
11         android:orientation="horizontal" >
12 
13         <TextView
14             android:id="@+id/tvChat"
15             android:layout_width="0dip"
16             android:layout_height="wrap_content"
17             android:layout_weight="1"
18             android:gravity="center"
19             android:text="聊天" />
20 
21         <TextView
22             android:id="@+id/tvFriend"
23             android:layout_width="0dip"
24             android:layout_height="wrap_content"
25             android:layout_weight="1"
26             android:gravity="center"
27             android:text="朋友" />
28 
29         <TextView
30             android:id="@+id/tvContact"
31             android:layout_width="0dip"
32             android:layout_height="wrap_content"
33             android:layout_weight="1"
34             android:gravity="center"
35             android:text="通讯" />
36     </LinearLayout>
37     <ImageView 
38         android:id="@+id/iv_scroll"
39         android:layout_width="100dip"
40         android:layout_height="wrap_content"
41         android:background="@drawable/ivbg"
42         />
43     <TextView 
44         android:layout_width="match_parent"
45         android:layout_height="1dip"
46         android:background="#000000"
47         />
48 </LinearLayout>

3、fragment的视图

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:gravity="center"
 6     android:orientation="vertical" >
 7     <TextView 
 8         android:layout_width="wrap_content"
 9         android:layout_height="wrap_content"
10         android:text="我在聊天"
11         />
12 
13 </LinearLayout>

<?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:gravity="center"
    android:orientation="vertical" >
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我的朋友"
        />

</LinearLayout>

<?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:gravity="center"
    android:orientation="vertical" >
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我的通讯"
        />

</LinearLayout>

4、MainActivity

  1 package com.zyhui.viewpagerdemo;
  2 
  3 import java.util.ArrayList;
  4 import java.util.List;
  5 
  6 import android.os.Bundle;
  7 import android.app.Activity;
  8 import android.content.Context;
  9 import android.support.v4.app.Fragment;
 10 import android.support.v4.app.FragmentActivity;
 11 import android.support.v4.app.FragmentManager;
 12 import android.support.v4.app.FragmentPagerAdapter;
 13 import android.support.v4.view.ViewPager;
 14 import android.support.v4.view.ViewPager.OnPageChangeListener;
 15 import android.util.DisplayMetrics;
 16 import android.util.Log;
 17 import android.view.Display;
 18 import android.view.Menu;
 19 import android.view.WindowManager;
 20 import android.widget.ImageView;
 21 import android.widget.LinearLayout;
 22 
 23 public class MainActivity extends FragmentActivity {
 24     private List<Fragment> fragList;
 25     private ViewPager vp;
 26     private ImageView iv_scroll;
 27     private int screenWidth;
 28     private LinearLayout.LayoutParams lp;
 29     @Override
 30     protected void onCreate(Bundle savedInstanceState) {
 31         super.onCreate(savedInstanceState);
 32         setContentView(R.layout.activity_main);
 33         
 34         iv_scroll = (ImageView) findViewById(R.id.iv_scroll);
 35         
 36         //获取屏幕宽
 37         screenWidth = getScreenWH()[0];
 38         //设置iv_scroll的宽和高
 39         lp = (LinearLayout.LayoutParams)iv_scroll.getLayoutParams();//为什么要这样呢?
 40         lp.width = screenWidth/3;
 41         
 42         initFragment();
 43         initViewPager();
 44         
 45         setVpEvent();
 46     }
 47     
 48     private void initViewPager() {
 49         vp = (ViewPager) findViewById(R.id.vp);
 50         vp.setAdapter(new MyAdapter(getSupportFragmentManager()));
 51         vp.setCurrentItem(0);
 52     }
 53 
 54     private void initFragment() {
 55         fragList = new ArrayList<Fragment>();
 56         fragList.add(new FragmentChat());
 57         fragList.add(new FragmentFriend());
 58         fragList.add(new FragmentContact());
 59     }
 60 
 61     private class MyAdapter extends FragmentPagerAdapter{
 62 
 63         public MyAdapter(FragmentManager fm) {
 64             super(fm);
 65             
 66         }
 67 
 68         @Override
 69         public Fragment getItem(int position) {
 70             return fragList.get(position);
 71         }
 72 
 73         @Override
 74         public int getCount() {
 75             return fragList.size();
 76         }
 77 
 78         
 79     }
 80     
 81     private void setVpEvent() {
 82         vp.setOnPageChangeListener(new OnPageChangeListener() {
 83             private int currentIndex = 0;//这个初始值应当为0,而不要为-1,否则默认是显示不了iv_scroll的图片的，因为leftMargin的值会为负值
 84             //选中页面时候调用的方法
 85             //index表示当前选中的页
 86             @Override
 87             public void onPageSelected(int index) {
 88                 currentIndex = index;
 89             }
 90             
 91             //页面滑动时候调用的方法
 92             //position是向右滑动到下一个页面时position==index,向左滑动position-index=1
 93             //offset:向右滑动到下一个页面时，它的值从0.00到0.99;向做滑动时，从0.99到0.00
 94             //offsetPixels:向右滑动到下一个页面时，它从0到屏幕的宽度;向左滑动时是从屏幕宽度到0
 95             @Override
 96             public void onPageScrolled(int position, float offset, int offsetPixels) {
 97                 //经测试，感觉不用这个判断也可以，直接使用lp.leftMargin = (screenWidth/3)*currentIndex就行了，这样右移感觉不到卡
 98                 if(position == currentIndex){//向右滑动
 99                     lp.leftMargin = (int) ((screenWidth/3)*currentIndex + offset * (screenWidth/3));
100                     //lp.leftMargin = (screenWidth/3)*currentIndex;
101                     Log.i("zyh", currentIndex + "========>" + offset+"R");
102                     //Log.i("zyh", "右移");//感觉没有左移的输出
103                     iv_scroll.setLayoutParams(lp);
104                 }else if(position - currentIndex == 1){//向左滑动
105                     lp.leftMargin = (int) ((screenWidth/3) * currentIndex - (1 - offset) * (screenWidth/3));
106                     //lp.leftMargin = (screenWidth/3)*currentIndex;
107                     Log.i("zyh", currentIndex + "========>" + offset+"L");
108                     //Log.i("zyh", "左移");//感觉没有左移的输出
109                     iv_scroll.setLayoutParams(lp);
110                 }
111                 
112                 
113             }
114             
115             //滑动状态改变时调用的方法
116             //state有3个值:
117             //0表示什么多不干
118             //1表示正在滑动
119             //2表示
120             @Override
121             public void onPageScrollStateChanged(int state) {
122                 
123             }
124         });
125     }
126     
127     /**
128      * @desc 获取屏幕的宽高
129      * @return
130      */
131     private int[] getScreenWH() {
132         WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
133         Display display = wm.getDefaultDisplay();
134         DisplayMetrics outMetrics = new DisplayMetrics();
135         display.getMetrics(outMetrics);
136         return new int[]{outMetrics.widthPixels,outMetrics.heightPixels};
137     }
138 
139 }

5、fragment的java代码

 1 package com.zyhui.viewpagerdemo;
 2 
 3 import android.os.Bundle;
 4 import android.support.v4.app.Fragment;
 5 import android.view.LayoutInflater;
 6 import android.view.View;
 7 import android.view.ViewGroup;
 8 
 9 public class FragmentChat extends Fragment {
10     @Override
11     public View onCreateView(LayoutInflater inflater, ViewGroup container,
12             Bundle savedInstanceState) {
13         
14         return inflater.inflate(R.layout.frag_chat, null);
15     }
16 }

其他的类似

转载于:https://www.cnblogs.com/zhongyinghe/p/5492070.html

anmai7157

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ViewPager控件的Demo

1、主视图 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 2 xmlns:tools="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 ...
复制链接

扫一扫