Android(安卓)ViewPager图片滑动
16lz
2021-01-24
Android ViewPager图片滑动 首先展示效果图
Android ViewPager图片滑动代码演示步骤 1.实例化ViewPager
2.通过LayoutInflater加载布局,返回View结果
3.把生成的每一个View对象添加到List集合中
4.实例化适配器,传递View集合
5.在适配器中继承自PagerAdapter,实现内部的四个方法
getCount(); 返回视图的数量
isViewFromObject(); 是否通过对象加载视图 View==object
instantiateltem(); 加载当前页面
(通过container.addView();添加视图)
返回个给用户
destroyItem(); 销毁滑出的视图
(通过container.removerView();销毁视图)
6.实例化每个ImageView
7.点击每个ImageView时,切换不同的页面
(viewPager.setCurrentltem(下标))
8.当页面切换后,还要把当前的导航栏变为绿色
设置文本颜色的 setImageResource(R.drawable. radio_true );
9.当你每次点击之前的时候,添加一个方法,清除方法,
(清理之 前的所有导航栏的状态,置为灰色)
10.实现滑动监听需要addOnPagerChangeListener
11.在onPagerSelected方法中,根据position页面的下标判断分别设置对应的底部导航栏状态
一.新建一个项目名为ViewPagerDemo,并引入ViewPager ViewPager是google SDk中自带的一个附加包的一个类,可以用来实现屏幕间的切换 1.在主布局文件activity_main.xml中引入 android.support.v4.view. ViewPager包, 添加一个线性布局 在线性布局中添加ImageView用于显示滑动小点
Android ViewPager图片滑动代码演示步骤 1.实例化ViewPager
2.通过LayoutInflater加载布局,返回View结果
3.把生成的每一个View对象添加到List集合中
4.实例化适配器,传递View集合
5.在适配器中继承自PagerAdapter,实现内部的四个方法
getCount(); 返回视图的数量
isViewFromObject(); 是否通过对象加载视图 View==object
instantiateltem(); 加载当前页面
(通过container.addView();添加视图)
返回个给用户
destroyItem(); 销毁滑出的视图
(通过container.removerView();销毁视图)
6.实例化每个ImageView
7.点击每个ImageView时,切换不同的页面
(viewPager.setCurrentltem(下标))
8.当页面切换后,还要把当前的导航栏变为绿色
设置文本颜色的 setImageResource(R.drawable. radio_true );
9.当你每次点击之前的时候,添加一个方法,清除方法,
(清理之 前的所有导航栏的状态,置为灰色)
10.实现滑动监听需要addOnPagerChangeListener
11.在onPagerSelected方法中,根据position页面的下标判断分别设置对应的底部导航栏状态
一.新建一个项目名为ViewPagerDemo,并引入ViewPager ViewPager是google SDk中自带的一个附加包的一个类,可以用来实现屏幕间的切换 1.在主布局文件activity_main.xml中引入 android.support.v4.view. ViewPager包, 添加一个线性布局 在线性布局中添加ImageView用于显示滑动小点
<?xml version="1.0" encoding="utf-8"?><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" android:orientation="vertical" tools:context="com.example.cxy.viewpagerdemo.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent"> android.support.v4.view.ViewPager> <LinearLayout android:layout_gravity="bottom" android:gravity="center" android:layout_marginBottom="20dp" android:layout_width="match_parent" android:layout_height="wrap_content"> <ImageView android:id="@+id/imageView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_true" android:layout_gravity="bottom"/> <ImageView android:id="@+id/imageView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_false" android:layout_gravity="bottom"/> <ImageView android:id="@+id/imageView3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_false" android:layout_gravity="bottom"/> <ImageView android:id="@+id/imageView4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_false" android:layout_gravity="bottom"/> <ImageView android:id="@+id/imageView5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_false" android:layout_gravity="bottom"/> <ImageView android:id="@+id/imageView6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/radio_false" android:layout_gravity="bottom"/> LinearLayout>FrameLayout>2.ViewPager的加载需要一个适配器pagerAdapter的子类 当继承pagerAdapter生成两个方法,剩下两个方法需要自己补充
package com.example.cxy.viewpagerdemo.adapter;import android.support.v4.view.PagerAdapter;import android.view.View;import android.view.ViewGroup;import java.util.List;/** * date:2017/3/7 * Created:陈箫阳(admin) */public class MyViewPagerAdapter extends PagerAdapter { private List3.新建一个fragment包并新建类OneFragment,通过LayoutInflater加载布局,返回View结果,并在布局文件中添加Imageview用于显示滑动所显示的图片,共六个用于显示六张图片,这里只写一个 OneFeagment类mList; public MyViewPagerAdapter(List list) { mList = list; } //返回视图数量 @Override public int getCount() { return mList.size(); } //是否通过对象加载视图 @Override public boolean isViewFromObject(View view, Object object) { return view == object; } //加载当前页面 @Override public Object instantiateItem(ViewGroup container, int position) { container.addView(mList.get(position)); return mList.get(position); } //销毁滑出视图 @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(mList.get(position)); }}
package com.example.cxy.viewpagerdemo.fragment;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 com.example.cxy.viewpagerdemo.R;/** * date:2017/3/7 * Created:陈箫阳(admin) */public class OneFragment extends Fragment{ @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragmentone, null); return view; }}fragmentone.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"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/view1"/>LinearLayout>4.编写主类
package com.example.cxy.viewpagerdemo;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.widget.ImageView;import com.example.cxy.viewpagerdemo.adapter.MyViewPagerAdapter;import java.util.ArrayList;import java.util.List;public class MainActivity extends AppCompatActivity implements View.OnClickListener, ViewPager.OnPageChangeListener { private ViewPager mViewPager; private ListmList; private ImageView mImageView1, mImageView2, mImageView3, mImageView4, mImageView5, mImageView6; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //初始化所有控件 initView(); } private void initView() { //实例化ViewPager mViewPager = (ViewPager) findViewById(R.id.viewPager); //实例化ImageView mImageView1 = (ImageView) findViewById(R.id.imageView1); mImageView2 = (ImageView) findViewById(R.id.imageView2); mImageView3 = (ImageView) findViewById(R.id.imageView3); mImageView4 = (ImageView) findViewById(R.id.imageView4); mImageView5 = (ImageView) findViewById(R.id.imageView5); mImageView6 = (ImageView) findViewById(R.id.imageView6); //给ImageView添加监听点击事件 mImageView1.setOnClickListener(this); mImageView2.setOnClickListener(this); mImageView3.setOnClickListener(this); mImageView4.setOnClickListener(this); mImageView5.setOnClickListener(this); mImageView6.setOnClickListener(this); //实例化Lise数组 mList = new ArrayList<>(); View view1 = LayoutInflater.from(this).inflate(R.layout.fragmentone, null); View view2 = LayoutInflater.from(this).inflate(R.layout.fragmenttwo, null); View view3 = LayoutInflater.from(this).inflate(R.layout.fragmentthree, null); View view4 = LayoutInflater.from(this).inflate(R.layout.fragmentfour, null); View view5 = LayoutInflater.from(this).inflate(R.layout.fragmentfive, null); View view6 = LayoutInflater.from(this).inflate(R.layout.fragmentsix, null); //把生成的每一个View对象添加到List集合中 mList.add(view1); mList.add(view2); mList.add(view3); mList.add(view4); mList.add(view5); mList.add(view6); //实例化适配器 MyViewPagerAdapter adapter = new MyViewPagerAdapter(mList); //给ViewPager添加适配器 mViewPager.setAdapter(adapter); //给ViewPager添加监听 mViewPager.addOnPageChangeListener(this); } @Override public void onClick(View v) { //清理所有导航栏的状态 clearState(); switch (v.getId()) { case R.id.imageView1: //给ViewPager设置当前布局 mViewPager.setCurrentItem(0); //给ImageView设置文本颜色 mImageView1.setImageResource(R.drawable.radio_true); break; case R.id.imageView2: mViewPager.setCurrentItem(1); mImageView2.setImageResource(R.drawable.radio_true); break; case R.id.imageView3: mViewPager.setCurrentItem(2); mImageView3.setImageResource(R.drawable.radio_true); break; case R.id.imageView4: mViewPager.setCurrentItem(3); mImageView4.setImageResource(R.drawable.radio_true); break; case R.id.imageView5: mViewPager.setCurrentItem(4); mImageView5.setImageResource(R.drawable.radio_true); break; case R.id.imageView6: mViewPager.setCurrentItem(5); mImageView6.setImageResource(R.drawable.radio_true); break; } } //将底部导航栏小点初始化 private void clearState() { mImageView1.setImageResource(R.drawable.radio_false); mImageView2.setImageResource(R.drawable.radio_false); mImageView3.setImageResource(R.drawable.radio_false); mImageView4.setImageResource(R.drawable.radio_false); mImageView5.setImageResource(R.drawable.radio_false); mImageView6.setImageResource(R.drawable.radio_false); } //滑动过程中的动作 @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } //选择某个页面松手后会被调用 @Override public void onPageSelected(int position) { //清理所有导航栏的状态 clearState(); //使用Switch拿到下标定义当滑动到相应位置小点显示颜色 switch (position) { case 0: mImageView1.setImageResource(R.drawable.radio_true); break; case 1: mImageView2.setImageResource(R.drawable.radio_true); break; case 2: mImageView3.setImageResource(R.drawable.radio_true); break; case 3: mImageView4.setImageResource(R.drawable.radio_true); break; case 4: mImageView5.setImageResource(R.drawable.radio_true); break; case 5: mImageView6.setImageResource(R.drawable.radio_true); break; } } //手指放上去,松开,拖动都会被调用 @Override public void onPageScrollStateChanged(int state) { }}
更多相关文章
- Android最好用的播放器ExoPlayer的使用及自定义UI
- Android调试神器stetho使用详解和改造
- 强制保持Android(安卓)Activity状态
- Android中的线性布局(LinearLayout)
- Android(安卓)简单计算器源码....
- android 开发技巧(5)--使 用 TextSwitcher 实现平滑过渡
- Android(安卓)线性布局(LinearLayout)相关官方文档 - 参考部分
- Android(安卓)线性布局(LinearLayout)相关官方文档 - 布局参数部分
- Android(安卓)Activity生命周期管理 .