在平時的開發中，我們會看到不管是微信發朋友圈照片還是微博發布新鮮事，添加圖片的時候都是選完后面還有個+號再去選擇圖片，這樣的話比較方便用戶去添加圖片，有的右上角還有個－號方便用戶去刪除圖片，而一般用戶選擇的圖片多少都是不定的，我們只限制最大張數，我們用gridview去實現，代碼可能比較簡單，高手請略過。
0.效果圖
1.準備資源圖片
添加圖片的+號圖片
刪除圖片的圖片
2.可設置限制用戶選擇最大張數
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
/** * 可以動態設置最多上傳幾張，之后就不顯示+號了，用戶也無法上傳了 * 默認9張 */ private int maxImages = 9; /** * 獲取最大上傳張數 * * @return */ public int getMaxImages() { return maxImages; } /** * 設置最大上傳張數 * * @param maxImages */ public void setMaxImages(int maxImages) { this.maxImages = maxImages; } |
3.設置GridView的總數
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
/** * 讓GridView中的數據數目加1最后一個顯示+號 * 當到達最大張數時不再顯示+號 * @return 返回GridView中的數量 */ @Override public int getCount() { int count = datas == null ? 1 : datas.size() + 1; if (count >= maxImages) { return datas.size(); } else { return count; } } |
4.getView()中根據position判斷+號的顯示
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
@Overridepublic View getView(final int position, View convertView, ViewGroup parent) { ViewHolder viewHolder = null; if (convertView == null) { convertView = inflater.inflate(R.layout.item_published_grida, parent, false); viewHolder = new ViewHolder(convertView); convertView.setTag(viewHolder); } else { viewHolder = (ViewHolder) convertView.getTag(); } /**代表+號之前的需要正常顯示圖片**/ if (datas != null && position < datas.size()) { final File file = new File(datas.get(position).get("path").toString()); Glide.with(context) .load(file) .priority(Priority.HIGH) .into(viewHolder.ivimage); viewHolder.btdel.setVisibility(View.VISIBLE); viewHolder.btdel.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (file.exists()) { file.delete(); } datas.remove(position); notifyDataSetChanged(); } }); } else { /**代表+號的需要+號圖片顯示圖片**/ Glide.with(context) .load(R.mipmap.image_add) .priority(Priority.HIGH) .centerCrop() .into(viewHolder.ivimage); viewHolder.ivimage.setScaleType(ImageView.ScaleType.FIT_XY); viewHolder.btdel.setVisibility(View.GONE); } return convertView;} |
5.GridView的完整代碼
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
|
package cn.bluemobi.dylan.gridviewaddimage;import android.content.Context;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.Button;import android.widget.ImageView;import com.bumptech.glide.Glide;import com.bumptech.glide.Priority;import java.io.File;import java.util.ArrayList;import java.util.List;import java.util.Map;/** * com.bm.falvzixun.adapter.GridViewAddImgAdpter * * @author yuandl on 2015/12/24. * 添加上傳圖片適配器 */public class GridViewAddImgesAdpter extends BaseAdapter { private List<Map<String, Object>> datas; private Context context; private LayoutInflater inflater; /** * 可以動態設置最多上傳幾張，之后就不顯示+號了，用戶也無法上傳了 * 默認9張 */ private int maxImages = 9; public GridViewAddImgesAdpter(List<Map<String, Object>> datas, Context context) { this.datas = datas; this.context = context; inflater = LayoutInflater.from(context); } /** * 獲取最大上傳張數 * * @return */ public int getMaxImages() { return maxImages; } /** * 設置最大上傳張數 * * @param maxImages */ public void setMaxImages(int maxImages) { this.maxImages = maxImages; } /** * 讓GridView中的數據數目加1最后一個顯示+號 * 當到達最大張數時不再顯示+號 * @return 返回GridView中的數量 */ @Override public int getCount() { int count = datas == null ? 1 : datas.size() + 1; if (count >= maxImages) { return datas.size(); } else { return count; } } @Override public Object getItem(int position) { return null; } @Override public long getItemId(int position) { return 0; } public void notifyDataSetChanged(List<Map<String, Object>> datas) { this.datas = datas; this.notifyDataSetChanged(); } @Override public View getView(final int position, View convertView, ViewGroup parent) { ViewHolder viewHolder = null; if (convertView == null) { convertView = inflater.inflate(R.layout.item_published_grida, parent, false); viewHolder = new ViewHolder(convertView); convertView.setTag(viewHolder); } else { viewHolder = (ViewHolder) convertView.getTag(); } /**代表+號之前的需要正常顯示圖片**/ if (datas != null && position < datas.size()) { final File file = new File(datas.get(position).get("path").toString()); Glide.with(context) .load(file) .priority(Priority.HIGH) .into(viewHolder.ivimage); viewHolder.btdel.setVisibility(View.VISIBLE); viewHolder.btdel.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (file.exists()) { file.delete(); } datas.remove(position); notifyDataSetChanged(); } }); } else { /**代表+號的需要+號圖片顯示圖片**/ Glide.with(context) .load(R.mipmap.image_add) .priority(Priority.HIGH) .centerCrop() .into(viewHolder.ivimage); viewHolder.ivimage.setScaleType(ImageView.ScaleType.FIT_XY); viewHolder.btdel.setVisibility(View.GONE); } return convertView; } public class ViewHolder { public final ImageView ivimage; public final Button btdel; public final View root; public ViewHolder(View root) { ivimage = (ImageView) root.findViewById(R.id.iv_image); btdel = (Button) root.findViewById(R.id.bt_del); this.root = root; } }} |
6.用法
主布局文件activity_main.xml
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
<?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:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#FFFFFF" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="cn.bluemobi.dylan.gridviewaddimage.MainActivity"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:text="說點什么" android:textColor="#000000" /> <GridView android:layout_marginTop="10dp" android:id="@+id/gw" android:numColumns="5" android:horizontalSpacing="6dp" android:columnWidth="60dp" android:layout_width="match_parent" android:layout_height="match_parent" /></LinearLayout> |
gridview的item布局文件item_published_grida.xml
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="66dp" android:layout_height="66dp"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/iv_image" android:layout_width="match_parent" android:gravity="center" android:layout_height="match_parent" android:scaleType="centerCrop"/> <Button android:id="@+id/bt_del" android:layout_width="20dp" android:layout_height="20dp" android:layout_alignParentRight="true" android:background="@drawable/bt_dynamic_del" /> </RelativeLayout></RelativeLayout> |
彈出拍照和從相冊選擇的對話框布局文件dialog_add_picture.xml
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="5.0dip" android:layout_marginRight="5.0dip" android:background="@android:color/transparent" android:orientation="vertical"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="30px" android:orientation="vertical"> <TextView android:id="@+id/tv_camera" android:layout_width="wrap_content" android:layout_height="144px" android:background="@mipmap/btn_top_arc" android:gravity="center" android:text="拍照" android:textColor="#666666" android:textSize="48px" /> <ImageView android:layout_width="1022px" android:layout_height="4px" android:background="#666666" /> <TextView android:id="@+id/tv_gallery" android:layout_width="wrap_content" android:layout_height="144px" android:gravity="center" android:background="@mipmap/btn_bottom_arc" android:text="從手機相冊選擇" android:textColor="#666666" android:textSize="48px" /> </LinearLayout> <TextView android:id="@+id/tv_cancel" android:layout_width="wrap_content" android:layout_height="144px" android:layout_marginTop="20px" android:layout_marginLeft="30px" android:layout_marginRight="30px" android:layout_gravity="center_horizontal" android:background="@mipmap/btn_top_arc" android:gravity="center" android:text="取消" android:textColor="#666666" android:textSize="48px" /></LinearLayout> |
MainActivity
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
|
package cn.bluemobi.dylan.gridviewaddimage;import android.app.Dialog;import android.content.Intent;import android.database.Cursor;import android.net.Uri;import android.os.Bundle;import android.os.Environment;import android.os.Handler;import android.os.Message;import android.provider.MediaStore;import android.support.v7.app.AppCompatActivity;import android.util.Log;import android.view.Display;import android.view.Gravity;import android.view.LayoutInflater;import android.view.View;import android.view.WindowManager;import android.widget.AdapterView;import android.widget.GridView;import android.widget.TextView;import android.widget.Toast;import net.bither.util.NativeUtil;import java.io.File;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;public class MainActivity extends AppCompatActivity { private GridView gw; private List<Map<String, Object>> datas; private GridViewAddImgesAdpter gridViewAddImgesAdpter; private Dialog dialog; private final int PHOTO_REQUEST_CAREMA = 1;// 拍照 private final int PHOTO_REQUEST_GALLERY = 2;// 從相冊中選擇private static final String PHOTO_FILE_NAME = "temp_photo.jpg"; private File tempFile; private final String IMAGE_DIR = Environment.getExternalStorageDirectory() + "/gridview/"; /* 頭像名稱 */ private final String PHOTO_FILE_NAME = "temp_photo.jpg"; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); gw = (GridView) findViewById(R.id.gw); datas = new ArrayList<>(); gridViewAddImgesAdpter = new GridViewAddImgesAdpter(datas, this); gw.setAdapter(gridViewAddImgesAdpter); gw.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) { showdialog(); } }); } /** * 選擇圖片對話框 */ public void showdialog() { View localView = LayoutInflater.from(this).inflate( R.layout.dialog_add_picture, null); TextView tv_camera = (TextView) localView.findViewById(R.id.tv_camera); TextView tv_gallery = (TextView) localView.findViewById(R.id.tv_gallery); TextView tv_cancel = (TextView) localView.findViewById(R.id.tv_cancel); dialog = new Dialog(this, R.style.custom_dialog); dialog.setContentView(localView); dialog.getWindow().setGravity(Gravity.BOTTOM); // 設置全屏 WindowManager windowManager = getWindowManager(); Display display = windowManager.getDefaultDisplay(); WindowManager.LayoutParams lp = dialog.getWindow().getAttributes(); lp.width = display.getWidth(); // 設置寬度 dialog.getWindow().setAttributes(lp); dialog.show(); tv_cancel.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View arg0) { dialog.dismiss(); } }); tv_camera.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { dialog.dismiss(); // 拍照 camera(); } }); tv_gallery.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { dialog.dismiss(); // 從系統相冊選取照片 gallery(); } }); } /** * 拍照 */ public void camera() { // 判斷存儲卡是否可以用，可用進行存儲 if (hasSdcard()) { File dir = new File(IMAGE_DIR); if (!dir.exists()) { dir.mkdir(); } tempFile = new File(dir, System.currentTimeMillis() + "_" + PHOTO_FILE_NAME); //從文件中創建uri Uri uri = Uri.fromFile(tempFile); Intent intent = new Intent(); intent.putExtra(MediaStore.EXTRA_OUTPUT, uri); intent.setAction(MediaStore.ACTION_IMAGE_CAPTURE); intent.addCategory(intent.CATEGORY_DEFAULT); // 開啟一個帶有返回值的Activity，請求碼為PHOTO_REQUEST_CAREMA startActivityForResult(intent, PHOTO_REQUEST_CAREMA); } else { Toast.makeText(this, "未找到存儲卡，無法拍照！", Toast.LENGTH_SHORT).show(); } } /** * 判斷sdcard是否被掛載 */ public boolean hasSdcard() { return Environment.getExternalStorageState().equals( Environment.MEDIA_MOUNTED); } /** * 從相冊獲取2 */ public void gallery() { Intent intent = new Intent( Intent.ACTION_PICK, MediaStore.Images.Media.EXTERNAL_CONTENT_URI); startActivityForResult(intent, PHOTO_REQUEST_GALLERY); } @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (resultCode == RESULT_OK) { if (requestCode == PHOTO_REQUEST_GALLERY) { // 從相冊返回的數據 if (data != null) { // 得到圖片的全路徑 Uri uri = data.getData(); String[] proj = {MediaStore.Images.Media.DATA}; //好像是android多媒體數據庫的封裝接口，具體的看Android文檔 Cursor cursor = managedQuery(uri, proj, null, null, null); //按我個人理解 這個是獲得用戶選擇的圖片的索引值 int column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA); //將光標移至開頭 ，這個很重要，不小心很容易引起越界 cursor.moveToFirst(); //最后根據索引值獲取圖片路徑 String path = cursor.getString(column_index); uploadImage(path); } } else if (requestCode == PHOTO_REQUEST_CAREMA) { if (resultCode != RESULT_CANCELED) { // 從相機返回的數據 if (hasSdcard()) { if (tempFile != null) { uploadImage(tempFile.getPath()); } else { Toast.makeText(this, "相機異常請稍后再試！", Toast.LENGTH_SHORT).show(); } Log.i("images", "拿到照片path=" + tempFile.getPath()); } else { Toast.makeText(this, "未找到存儲卡，無法存儲照片！", Toast.LENGTH_SHORT).show(); } } } } } Handler handler = new Handler() { @Override public void handleMessage(Message msg) { super.handleMessage(msg); if (msg.what == 0xAAAAAAAA) { photoPath(msg.obj.toString()); } } }; /** * 上傳圖片 * * @param path */ private void uploadImage(final String path) { new Thread() { @Override public void run() { if (new File(path).exists()) { Log.d("images", "源文件存在" + path); } else { Log.d("images", "源文件不存在" + path); } File dir = new File(IMAGE_DIR); if (!dir.exists()) { dir.mkdir(); } final File file = new File(dir + "/temp_photo" + System.currentTimeMillis() + ".jpg"); NativeUtil.compressBitmap(path, file.getAbsolutePath(), 50); if (file.exists()) { Log.d("images", "壓縮后的文件存在" + file.getAbsolutePath()); } else { Log.d("images", "壓縮后的不存在" + file.getAbsolutePath()); } Message message = new Message(); message.what = 0xAAAAAAAA; message.obj = file.getAbsolutePath(); handler.sendMessage(message); } }.start(); } public void photoPath(String path) { Map<String,Object> map=new HashMap<>(); map.put("path",path); datas.add(map); gridViewAddImgesAdpter.notifyDataSetChanged(); }} |
7.GitHub源碼 ：GridViewAddImage
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持服務器之家。
原文鏈接：https://blog.csdn.net/linglongxin24/article/details/53034123
