实现这一功能方法是使用ViewPager来实现的,支持左右滑动、双击变大或变小、返回退出预览、当前查看到第几张、一共几张等功能,功能先简要描述这么多,下面来看下效果图,效果图是最直接的是吧
效果图呢大概就是这样,下面我们说一下怎么实现的。没有代码相信也很少人来看你的博客,那么我们直接上代码
1、activity布局
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.android.infantschool.ui.imageloader.PhotoViewPager
android:id="@+id/vpGallery"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#151920" />
<TextView
android:id="@+id/tvTitle"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:gravity="center"
android:textColor="@color/write"
android:textSize="16sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="bottom"
android:layout_marginBottom="30dp"
android:gravity="center">
<ImageView
android:id="@+id/img_dismess"
android:layout_width="50dp"
android:padding="10dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="@mipmap/icon_filed" />
</LinearLayout>
</FrameLayout>
界面上关闭按钮的X素材我就不上传了,那个是在阿里矢量图库里面找的一张图片,大家也可以去下载一张自己喜欢的关闭按钮素材复制过去
2、PhotoViewPager.java
public class PhotoViewPager extends ViewPager {
public PhotoViewPager(Context context) {
super(context);
}
public PhotoViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
try {
return super.onInterceptTouchEvent(ev);
} catch (IllegalArgumentException e) {
e.printStackTrace();
return false;
}
}
}
3、ImageAdapter.java
public class ImageAdapter extends PagerAdapter {
public static final String TAG = ImageAdapter.class.getSimpleName();
private List<String> imageUrls;
private Activity activity;
public ImageAdapter(List<String> imageUrls, Activity activity) {
this.imageUrls = imageUrls;
this.activity = activity;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
String url = imageUrls.get(position);
PhotoView photoView = new PhotoView(activity);
photoView.setScaleType(ImageView.ScaleType.FIT_CENTER);
Glide.with(activity)
.load(url)
.into(photoView);
container.addView(photoView);
return photoView;
}
@Override
public int getCount() {
return imageUrls != null ? imageUrls.size() : 0;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
@Override
public int getItemPosition(Object object) {
return POSITION_NONE;
}
}
4、ImageActivity.java
public class ImageActivity extends BaseActivity {
private int position;
private List<String> list;
@BindView(R.id.tvTitle)
public TextView tvTitle;
@BindView(R.id.vpGallery)
public PhotoViewPager mPhoto;
@BindView(R.id.img_dismess)
public ImageView mImgDismess;
private String title;
public static Intent newIntent(Context context, int position, List<String> list) {
Intent intent = new Intent(context, ImageActivity.class);
intent.putExtra("position", position);
intent.putExtra("IMG_LIST", (Serializable) list);
return intent;
}
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_image);
ButterKnife.bind(this);
position = getIntent().getIntExtra("position", 0);
list = getIntent().getStringArrayListExtra("IMG_LIST");
initView();
}
public void initView() {
title = "%1$d/%2$d";
mImgDismess.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ImageActivity.this.finish();
}
});
tvTitle.setText(String.format(title, position + 1, list.size()));
mPhoto.setAdapter(new ImageAdapter(list, ImageActivity.this));
mPhoto.setCurrentItem(position);
mPhoto.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
@Override
public void onPageSelected(int pos) {
super.onPageSelected(pos);
position = pos;
tvTitle.setText(String.format(title, position + 1, list.size()));
}
});
}
@Override
protected void onDestroy() {
super.onDestroy();
if (list != null) {
list.clear();
}
}
}
5、AndroidManifest.xml配置activity
<activity android:name=".ui.activity.ImageActivity" />
6、具体如何使用
在图片列表那个界面
//参数1:上下文,参数2:当前点击的图片的position,参数3:图片列表
startActivity(ImageActivity.newIntent(this, position2, list));
7、最后再配置3个远程仓库
implementation 'com.jakewharton:butterknife:8.8.1'//依赖注解
annotationProcessor 'com.jakewharton:butterknife-compiler:8.8.1'
implementation 'com.github.chrisbanes:PhotoView:1.2.6'//查看图
implementation 'com.github.bumptech.glide:glide:3.7.0'//图片加载
致辞就结束了!