效果图
添加
picasso-2.4.0.jar
AndroidManifest.xml添加权限
<!--开启网络权限--> <uses-permission android:name="android.permission.INTERNET" />MainActivity中
package com.example.viewpagetest5; import android.app.Activity; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.AdapterView; import android.widget.ImageView; import android.widget.ListView; import android.widget.TextView; import android.widget.Toast; import com.orhanobut.logger.Logger; import com.squareup.picasso.Picasso; import java.util.ArrayList; import java.util.List; /** * viewPager实现图片查看器 */ public class MainActivity extends Activity { // 列表控件 private ListView lvPhoto; // viewPager private ViewPager viewPager; // 存放资源的list List<String>list; // viewPager,装view的数组 private View[] viewArray; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); myOnclick(); } // 初始化控件 private void initView(){ lvPhoto = (ListView)findViewById(R.id.lvPhoto); // 拿到数据资源 List list=getData(); Logger.t("111").d("list"+list.size()); LvAdapter lvAdapter = new LvAdapter(list,MainActivity.this); lvPhoto.setAdapter(lvAdapter); // 滑动控件 viewPager = (ViewPager)findViewById(R.id.viewPager); // 拿到数据 viewArray = getViewPagerData(); // 绑定数据 viewPager.setAdapter(new MyAdapter()); // 监听滑动 viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { // 这个方法会在屏幕滚动过程中不断被调用。 @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } // 代表哪个页面被选中。 @Override public void onPageSelected(int position) { // 设置一个右下角的图片个数 TextView tv= (TextView) viewArray[position].findViewById(R.id.tvYeShu); tv.setText(position+1+"/"+viewArray.length); } // 这个方法在手指操作屏幕的时候发生变化。有三个值:0(END),1(PRESS) , 2(UP) 。 @Override public void onPageScrollStateChanged(int state) { } }); } // 点击事件 private void myOnclick(){ lvPhoto.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { Toast.makeText(MainActivity.this, "条目点击事件"+position, Toast.LENGTH_SHORT).show(); lvPhoto.setVisibility(View.GONE); viewPager.setVisibility(View.VISIBLE); // 显示页面 viewPager.setCurrentItem(position); // 设置一个右下角的图片个数 TextView tv= (TextView) viewArray[position].findViewById(R.id.tvYeShu); tv.setText(position+1+"/"+viewArray.length); } }); } // 制造一组数据 private List<String> getData(){ list = new ArrayList<>(); list.add("http://www.zhlzw.com/UploadFiles/Article_UploadFiles/201204/20120412123914329.jpg"); list.add("http://www.zhlzw.com/UploadFiles/Article_UploadFiles/201204/20120412123912727.jpg"); list.add("http://pic.58pic.com/58pic/15/36/26/12J58PICuz4_1024.jpg"); list.add("http://pic.58pic.com/58pic/15/14/14/18e58PICMwt_1024.jpg"); return list; } // 存放viewPager的数据 private View[] getViewPagerData(){ viewArray=new View[list.size()]; // 实例化布局,加载图片,并放到数组中 for (int i = 0; i < viewArray.length; i++) { // 存放布局 LayoutInflater layoutInflater = getLayoutInflater(); View view = layoutInflater.inflate(R.layout.activity_lay, null); ImageView imageView = (ImageView) view.findViewById(R.id.imageView); Picasso.with(this).load(list.get(i)).into(imageView); viewArray[i] = view; imageView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { lvPhoto.setVisibility(View.VISIBLE); viewPager.setVisibility(View.GONE); } }); } return viewArray; } /** * 适配器绑定图片 */ public class MyAdapter extends PagerAdapter { @Override public int getCount() { return viewArray.length; } @Override public void destroyItem(ViewGroup container, int position, Object object) { View view = viewArray[position]; container.removeView(view); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public Object instantiateItem(ViewGroup container, int position) { View view = viewArray[position]; container.addView(view); return view; } } }
LvAdapter中
activity_main.xmlpackage com.example.viewpagetest5; 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 com.orhanobut.logger.Logger; import com.squareup.picasso.Picasso; import java.util.List; /** * Created by 16838 on 2017/7/26. */ public class LvAdapter extends BaseAdapter{ private Context context; private List<String>list; private ViewHolder viewHolder; public LvAdapter(List<String>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 position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if(convertView==null) { viewHolder=new ViewHolder(); convertView =LayoutInflater.from(context).inflate(R.layout.item_layout,null); viewHolder.ivPhoto= (ImageView) convertView.findViewById(R.id.ivPhoto); convertView.setTag(viewHolder); }else { viewHolder= (ViewHolder) convertView.getTag(); } Picasso.with(context) .load(list.get(position)) .into(viewHolder.ivPhoto); return convertView; } class ViewHolder{ ImageView ivPhoto; } }
item_layout.xml<?xml version="1.0" encoding="utf-8"?> <LinearLayout 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.example.viewpagetest5.MainActivity" android:orientation="vertical" > <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:animateLayoutChanges="true" > <ListView android:id="@+id/lvPhoto" android:layout_width="match_parent" android:layout_height="wrap_content"> </ListView> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent" android:visibility="gone" > </android.support.v4.view.ViewPager> </RelativeLayout> </LinearLayout>
activity_lay.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" > <ImageView android:id="@+id/ivPhoto" android:layout_width="match_parent" android:layout_height="wrap_content" android:scaleType="fitXY" /> </LinearLayout>
源码下载:<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <ImageView android:id="@+id/imageView" android:layout_width="fill_parent" android:layout_height="fill_parent" android:src="@drawable/b1" android:scaleType="fitXY" /> <TextView android:id="@+id/tvYeShu" android:layout_width="match_parent" android:layout_height="30dp" android:layout_alignParentBottom="true" android:text="页面" android:textColor="#FFFFFF" /> </RelativeLayout>
ViewPadeDemo----viewpagetest5http://download.csdn.net/detail/zhaihaohao1/9911113