Android realizes picture click enlargement
- 2021-12-09 10:11:40
- OfStack
In this paper, we share the specific code of Android to realize picture click enlargement for your reference. The specific contents are as follows
In my project, click on the image banner and then enlarge the browsing function. My approach is to create a special picture display Activity, layout inside with ViewPage, so that you can control the left and right slide of the picture, and control which picture to display first.
The function is ok, and the display is normal. But it took me several days to realize and perfect this function.
ShowMoreImageActivity
/**
* Picture enlargement
*/
public class ShowMoreImageActivity extends BaseActivity {
@FindId(R.id.vp)
private ViewPager vp;
@FindId(R.id.ll_point)
private LinearLayout ll_point;
private List<String> imgs;
@FindId(R.id.btn_save)
private ImageView btn_save;
private int index;
public static int type;
private Activity activity;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_more_image);
initViews();
activity = this;
}
private void initViews() {
AutoFindId.findId(context);
imgs = (ArrayList<String>) getIntent().getSerializableExtra("img");
index = getIntent().getIntExtra("index", 0);
type = getIntent().getIntExtra("type", 0);
vp.setAdapter(new MoreImgPagerAdapter(context, imgs));
vp.addOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int arg0) {
index = arg0;
setUpPoint(imgs.size(), arg0);
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
});
setUpPoint(imgs.size(), 0);
vp.setCurrentItem(index);
}
protected void downLoad(final String urls) {
String[] split = urls.split("\\?");
final String url = split[0];
if (url.startsWith("file")) {
G.toast(context, " This is a local picture, so you don't need to download it , The path is " + url.replace("file://", ""));
return;
}
if (OKHttpUtils.isNetworkAvailable(context)) {
G.showPd(context);
TDUtils.execute(new Runnable() {
@Override
public void run() {
try {
File file = new File(C.getDownloadPath());
if (!file.exists()) {
file.mkdir();
}
File jpg = new File(C.getDownloadPath() + G.urlToFileName(url));
// Do not need to download if it already exists
if (jpg != null && jpg.exists()) {
G.dismissProgressDialogInThread();
G.toastInThread(context,
" The file has been downloaded to " + jpg.getParent() + context.getResources().getString(R.string.xia));
return;
}
// Find it from the cache first
File tmpFile = NetAide.getBitmapUtils().getBitmapFileFromDiskCache(url);
if (tmpFile != null && tmpFile.exists()) {
G.look("--- Find a picture from the cache ----");
Bitmap bm = BitmapFactory.decodeFile(tmpFile.getAbsolutePath());
FileOutputStream fos = new FileOutputStream(jpg);
bm.compress(CompressFormat.JPEG, 100, fos);
fos.close();
G.dismissProgressDialogInThread();
// Notify gallery updates
C.noticeImageRefresh(context, jpg);
G.toastInThread(context, context.getResources().getString(R.string.downLoadUrl)
+ jpg.getParent() + context.getResources().getString(R.string.xia));
return;
}
// Download and save from the network
Bitmap bm = BitmapFactory.decodeStream(new URL(url).openStream());
FileOutputStream fos = new FileOutputStream(jpg);
bm.compress(CompressFormat.JPEG, 100, fos);
fos.close();
G.dismissProgressDialogInThread();
// Notify gallery updates
C.noticeImageRefresh(context, jpg);
G.toastInThread(context, " You can now view the picture in the gallery ");
} catch (Exception e) {
e.printStackTrace();
G.dismissProgressDialogInThread();
G.toastInThread(context, context.getResources().getString(R.string.downLoadFail));
File jpg = new File(C.getDownloadPath() + G.urlToFileName(url));
if (jpg != null && jpg.exists()) {
jpg.delete();
}
}
}
});
}
}
private void setUpPoint(int size, int choose) {
ll_point.removeAllViews();
if (size <= 1) {
return;
}
for (int i = 0; i < size; i++) {
ImageView point = new ImageView(context);
point.setLayoutParams(new LinearLayout.LayoutParams(DensityUtil.dip2px(context, 15), -2));
point.setScaleType(ScaleType.FIT_CENTER);
if (i == choose) {
point.setImageResource(R.drawable.white_choosed);
} else {
point.setImageResource(R.drawable.white_no_choosed);
}
ll_point.addView(point);
}
}
public void doClcik(View view) {
switch (view.getId()){
case R.id.btn_save:
PermissionUtils permissionUtils = new PermissionUtils();
permissionUtils.setPermission(this, " Storage ", " Save Picture ", new PermissionUtils.AfterPermission() {
@Override
public void doNext() {
downLoad(imgs.get(index));
}
},Manifest.permission.WRITE_EXTERNAL_STORAGE);
break;
}
}
}
Corresponding layout:
<?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"
android:background="@android:color/black"
android:orientation="vertical">
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginTop="25dp">
<LinearLayout
android:layout_width="50dp"
android:layout_height="match_parent"
android:onClick="onFinish">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dp"
android:background="@drawable/nav_back" />
</LinearLayout>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<ImageView
android:id="@+id/btn_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="10dp"
android:onClick="doClcik"
android:src="@drawable/download_img" />
</LinearLayout>
<LinearLayout
android:id="@+id/ll_point"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="40dp"
android:gravity="center"
android:orientation="horizontal"/>
</FrameLayout>
MoreImgPagerAdapter
public class MoreImgPagerAdapter extends PagerAdapter {
private Context context;
private List<String> images;
private SparseArray<SoftReference<View>> ivs;
public MoreImgPagerAdapter(Context context, List<String> images) {
this.context = context;
this.images = images;
ivs = new SparseArray<SoftReference<View>>();
}
@Override
public int getCount() {
return images.size();
}
@Override
public void destroyItem(ViewGroup arg0, int arg1, Object arg2) {
SoftReference<View> reference = ivs.get(arg1);
if (reference != null && reference.get() != null) {
arg0.removeView(reference.get());
}
}
@Override
public Object instantiateItem(ViewGroup arg0, final int arg1) {
SoftReference<View> reference = ivs.get(arg1);
if (reference == null || reference.get() == null) {
View v = LayoutInflater.from(context).inflate(R.layout.item_show_more_image, null);
reference = new SoftReference<View>(v);
ivs.put(arg1, reference);
}
View v = reference.get();
final ViewHolder holder = new ViewHolder(v);
Glide.with(context).asBitmap().load(images.get(arg1)).into(holder.image);
arg0.addView(v);
return v;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0.equals(arg1);
}
class ViewHolder {
@FindId(R.id.image)
private ImageView image;
@FindId(R.id.rl_percent)
private RelativeLayout rl_percent;
@FindId(R.id.tv_percent)
private TextView tv_percent;
@FindId(R.id.iv_top)
private ImageView iv_top;
public ViewHolder(View v) {
AutoFindId.findIdByView(this, v);
}
}
}
Corresponding layout:
<?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:background="@android:color/black"
android:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="50dp"
android:layout_marginTop="70dp" >
<ImageView
android:layout_gravity="center"
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="@+id/iv_top"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:visibility="gone"
android:background="@drawable/shuiyin" />
</FrameLayout>
<RelativeLayout
android:visibility="gone"
android:id="@+id/rl_percent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ProgressBar
android:layout_width="40dp"
android:layout_height="40dp" />
<TextView
android:id="@+id/tv_percent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:textColor="@android:color/white"
android:textSize="12sp" />
</RelativeLayout>
</RelativeLayout>
The above is secondary, because I found a simpler wheel.
github Address
In my project, I only need two steps to complete this function.
Step 1:
// View the larger picture
implementation 'com.github.SherlockGougou:BigImageViewPager:v4_6.1.1'
Step 2:
Called from the Click Picture event:
ImagePreview
.getInstance()
// Context, must be activity There is no need to worry about memory leakage, and this framework has already handled it;
.setContext(context)
// Set the number from which to start (the index is from 0 Start)
.setIndex(position)
// Have 3 A way to set up a data set according to your own needs 3 Choose 1 :
// 1 : No. 1 1 Step generated imageInfo List
//.setImageInfoList(imageInfoList)
// 2 Direct transmission url List
.setImageList(imageList)
// 3 : Only 1 The situation of a picture can be directly passed into this picture url
//.setImage(String image)
// Open preview
.start();
In this way, the functions of enlarging, browsing and downloading pictures are completed, which are recorded here.