欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android GridView仿微信添加多圖效果

 更新時(shí)間:2018年05月14日 08:41:07   作者:dwf_學(xué)海無涯  
這篇文章主要為大家詳細(xì)介紹了Android GridView仿微信添加多圖效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了GridView仿微信添加多圖效果展示的具體代碼,供大家參考,具體內(nèi)容如下

栗子慣例,先上GIF


在項(xiàng)目中這種添加⑨圖的效果應(yīng)該是非常常見的,后面有個(gè)添加的按鈕應(yīng)該怎么實(shí)現(xiàn),這也許讓一部分小白抓狂了吧~來吧,淡漠帶你飛,走起~~啦啦啦......

起飛前先說下,本篇只是講解九宮格添加圖片的效果,至于選擇圖片的效果是別人寫的庫,我只是接過來做選擇圖片用的~

1.首先這是用GridView實(shí)現(xiàn)的
xml布局就一個(gè)GridView

 <GridView
  android:id="@+id/gridView"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:columnWidth="90dp"
  android:gravity="center"
  android:horizontalSpacing="4dp"
  android:numColumns="3"
  android:scrollbars="none"
  android:stretchMode="columnWidth"
  android:verticalSpacing="4dp" />

2.接下來看看java代碼

 //圖片數(shù)據(jù),ImageItem是圖片選擇的庫自帶的Bean
 private ArrayList<ImageItem> images;
 //adapter是核心,添加按鈕的處理刪除的處理都在里面,后面會(huì)說,別急
 private MultiImageAdapter adapter;
 //初次進(jìn)入的時(shí)候先只傳this
 adapter = new MultiImageAdapter(this);
 gridView.setAdapter(adapter);

 @Override
 protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  super.onActivityResult(requestCode, resultCode, data);
  if (data != null && requestCode == 3) {
   //判斷一下是否有數(shù)據(jù),有的話就addAll(),不會(huì)覆蓋已經(jīng)有的圖
   if(images == null){
    images = (ArrayList<ImageItem>)
      data.getSerializableExtra(ImagePicker.EXTRA_RESULT_ITEMS);
   }else{
    images.addAll((ArrayList<ImageItem>)
      data.getSerializableExtra(ImagePicker.EXTRA_RESULT_ITEMS));
   }
   //拿到圖片數(shù)據(jù)后把images傳過去
   adapter = new MultiImageAdapter(this,images);
   gridView.setAdapter(adapter);
  } else {
   Toast.makeText(this, "沒有選擇圖片", Toast.LENGTH_SHORT).show();
  }
 }

Ok,Java代碼也講完了,到這里沒有什么復(fù)雜的吧,添加按鈕和刪除按鈕的處理都在Adapter里面,下面開始說核心的Adapter

3.核心Adapter

先看xml吧

 <?xml version="1.0" encoding="utf-8"?>
 <com.anfq.mylibrary.view.SquareLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:background="#ffffff"
  android:layout_height="match_parent">
  <RelativeLayout
   android:layout_width="match_parent"
   android:layout_height="wrap_content">
   <ImageView
    android:id="@+id/ivIcon"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimaryDark"
    android:scaleType="fitXY" />
   <ImageButton
    android:id="@+id/ibDelete"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:background="@null"
    android:padding="10dp"
    android:src="@drawable/del" />
  </RelativeLayout>
  <ImageButton
   android:id="@+id/ibAdd"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:layout_centerInParent="true"
   android:background="#eeeeee"
   android:src="@drawable/add"
   android:visibility="gone" />
 </com.anfq.mylibrary.view.SquareLayout>

xml也不復(fù)雜,最外層的SquareLayout是一個(gè)讓GridView顯示的Item為正方形的處理,RelativeLayout里有個(gè)ImageView這個(gè)是用來展示圖片的,ImageButton是刪除的按鈕;然后外面ImageButton是添加按鈕,設(shè)置了隱藏屬性android:visibility="gone",只有在需要的時(shí)候才把添加按鈕召喚出來,添加完9個(gè)圖片的時(shí)候是沒有添加按鈕的。

把SquareLayout的代碼也插上吧~

 public class SquareLayout extends RelativeLayout {
  public SquareLayout(Context context, AttributeSet attrs, int defStyle) {
   super(context, attrs, defStyle);
  }
  public SquareLayout(Context context, AttributeSet attrs) {
   super(context, attrs);
  }
  public SquareLayout(Context context) {
   super(context);
  }
  @SuppressWarnings("unused")
  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
   setMeasuredDimension(getDefaultSize(0, widthMeasureSpec),
     getDefaultSize(0, heightMeasureSpec));
   int childWidthSize = getMeasuredWidth();
   int childHeightSize = getMeasuredHeight();
   // 高度和寬度一樣
   heightMeasureSpec = widthMeasureSpec = MeasureSpec.makeMeasureSpec(
     childWidthSize, MeasureSpec.EXACTLY);
   super.onMeasure(widthMeasureSpec, heightMeasureSpec);
  }
 }

Adapter來了

 public class MultiImageAdapter extends BaseAdapter {
  private Activity activity;
  private LayoutInflater inflater;
  private ArrayList<ImageItem> mImages;
  //用來判斷是否是剛剛進(jìn)入,剛進(jìn)入只顯示添加按鈕,也就是上面java代碼中只傳this的時(shí)候
  private boolean is = false;
  ImagePicker imagePicker = ImagePicker.getInstance();
  public MultiImageAdapter(Activity activity, ArrayList<ImageItem> images) {
   this.activity = activity;
   this.inflater = LayoutInflater.from(activity);
   this.mImages = images;
   initImagePicker();//設(shè)置圖片選擇的一些屬性
  } public MultiImageAdapter(Activity activity) {
   this.activity = activity;
   this.inflater = LayoutInflater.from(activity);
   is = true;//設(shè)置為true表示第一次初始化
   initImagePicker();//設(shè)置圖片選擇的一些屬性
  }
  @Override
  public int getCount() {
   if(!is){
    //這里判斷數(shù)據(jù)如果有9張就size等于9,否則就+1,+1是為按鈕留的位置
    return mImages.size()==9?mImages.size():mImages.size()+1;
   }
   //沒有數(shù)據(jù)就是1,1是為按鈕留的位置
   return 1;
  }
  @Override
  public Object getItem(int position) {
   return mImages.get(position);
  }
  @Override
  public long getItemId(int position) {
   return position;
  }
  @Override
  public View getView(final int position, View view, final ViewGroup parent) {
   ViewHolder holder = null;
   if (null == view) {
    view = inflater.inflate(R.layout.item_ulti_image, null);
    holder = new ViewHolder();
    holder.ivIcon = (ImageView) view.findViewById(R.id.ivIcon);
    holder.ibAdd = (ImageButton) view.findViewById(R.id.ibAdd);
    holder.ibDelete = (ImageButton) view.findViewById(R.id.ibDelete);
    view.setTag(holder);
   } else {
    holder = (ViewHolder) view.getTag();
   }
   if(!is){
    //選了圖片后會(huì)進(jìn)入這里,先判斷下position 是否等于size
    if(position == mImages.size()){
     //執(zhí)行到這里就說明是最后一個(gè)位置,判斷是否有9張圖
     if(mImages.size() != 9){
      //沒有9張圖就顯示添加按鈕
      holder.ibAdd.setVisibility(View.VISIBLE);
     }else{
      //有就隱藏
      holder.ibAdd.setVisibility(View.GONE);
     }
    }else{
     //還不是最后一個(gè)位置的時(shí)候執(zhí)行這里
     //隱藏添加按鈕,要設(shè)置圖片嘛~
     holder.ibAdd.setVisibility(View.GONE);
     //根據(jù)條目位置設(shè)置圖片
     ImageItem item = mImages.get(position);
     Glide.with(activity)
       .load(item.path)
       .into(holder.ivIcon);
    }
    //刪除按鈕的點(diǎn)擊事件
    holder.ibDelete.setOnClickListener(new View.OnClickListener() {
     @Override
     public void onClick(View v) {
      //移除圖片
      mImages.remove(position);
      //更新
      notifyDataSetChanged();
     }
    });
   }else{
    //初次初始化的時(shí)候顯示添加按鈕
    holder.ibAdd.setVisibility(View.VISIBLE);
   }
   //添加按鈕點(diǎn)擊事件
   holder.ibAdd.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
     //判斷是否是初始化進(jìn)入
     if(!is){
      //到這里表示已經(jīng)選過了,然后用9-size算出還剩幾個(gè)圖的位置
      imagePicker.setSelectLimit(9-mImages.size());//選中數(shù)量限制
     }
     //跳轉(zhuǎn)到圖片選擇
     Intent intent = new Intent(activity, ImageGridActivity.class);
     activity.startActivityForResult(intent, 3);
    }
   });
   return view;
  }
  protected class ViewHolder {
   /** icon */
   protected ImageView ivIcon;
   /** 移除 */
   protected ImageButton ibDelete;
   /**添加 */
   protected ImageButton ibAdd;
  }
  private void initImagePicker() {
   imagePicker.setImageLoader(new GlideImageLoader()); //設(shè)置圖片加載器
   imagePicker.setShowCamera(true);//顯示拍照按鈕
   imagePicker.setCrop(true);//允許裁剪(單選才有效)
   imagePicker.setSaveRectangle(true);//是否按矩形區(qū)域保存
   imagePicker.setSelectLimit(9);//選中數(shù)量限制
   imagePicker.setStyle(CropImageView.Style.CIRCLE);//裁剪框的形狀
   imagePicker.setFocusWidth(100);//裁剪框的寬度。單位像素(圓形自動(dòng)取寬高最小值)
   imagePicker.setFocusHeight(100);//裁剪框的高度。單位像素(圓形自動(dòng)取寬高最小值)
   imagePicker.setOutPutX(1000);//保存文件的寬度。單位像素
   imagePicker.setOutPutY(1000);//保存文件的高度。單位像素
  }
 }

總結(jié):其實(shí)原理就是把數(shù)據(jù)的size+1,做為添加按鈕的放置,然后判斷下有9張圖就不顯示添加按鈕,并且size也不+1,就這樣,一個(gè)帶添加按鈕的GridView就好了。

以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論