Android GridView仿微信朋友圈顯示圖片
最近項(xiàng)目要求上傳多圖并且多圖顯示,而且要規(guī)則的顯示,就像微信朋友圈的圖片顯示一樣。
利用GridView再適合不過了,GridView可以動(dòng)態(tài)加載圖片的數(shù)量,而且還比較規(guī)律,下面說一下自己的思路:
- 1.獲取網(wǎng)絡(luò)圖片
- 2.初始化gridview,自定義適配器
- 3.根據(jù)圖片數(shù)量設(shè)置gridview的列數(shù)
- 4.更新適配器
下面貼上部分源碼并給大家解析一下
一、首先是GridView的item
<com.view.SquareLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" > <ImageView android:id="@+id/item_grida_image" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="fitXY" android:layout_margin="@dimen/tinyest_space"> </ImageView> </com.view.SquareLayout>
這里的SquareLayout布局是自定義的下面會(huì)給大家詳細(xì)講解。
子項(xiàng)中是一個(gè)正方形布局里面嵌套著圖片
二、接下來自定義適配器
因?yàn)轫?xiàng)目需求不同,自己定義的適配器和平時(shí)用的不太一樣,這里就不貼源碼了。大體上也是將圖片下載到本地,用Imageloader加載,不過我這里有上傳失敗的和新建的,所以不太一樣。
三、最后在用到的Activity中設(shè)置
noScrollgridview = (GridView) findViewById(R.id.noScrollgridview);
noScrollgridview.setNumColumns(3); //默認(rèn)設(shè)置在3列圖片
//上傳成功傳值給adapter
picAdapter = new PictureAdapter(this, 1, appItem_file);
noScrollgridview.setAdapter(picAdapter);
//根據(jù)圖片數(shù)量設(shè)置圖片的列
int size = appItemFile.getFiles().split(",").length;
if (size==1){
noScrollgridview.setNumColumns(1);
}
else if (size==2){
noScrollgridview.setNumColumns(2);
}
else if (size>2){
noScrollgridview.setNumColumns(3);
}
picAdapter.notifyDataSetChanged();
默認(rèn)設(shè)置GridView的列數(shù)為3,根據(jù)圖片的數(shù)量動(dòng)態(tài)設(shè)置列數(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) {
// For simple implementation, or internal size is always 0.
// We depend on the container to specify the layout size of
// our view. We can't really know what it is since we will be
// adding and removing different arbitrary views and do not
// want the layout to change as this happens.
setMeasuredDimension(getDefaultSize(0, widthMeasureSpec),
getDefaultSize(0, heightMeasureSpec));
// Children are just made to fill our space.
int childWidthSize = getMeasuredWidth();
int childHeightSize = getMeasuredHeight();
// 高度和寬度一樣
heightMeasureSpec = widthMeasureSpec = MeasureSpec.makeMeasureSpec(
childWidthSize, MeasureSpec.EXACTLY);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
這里主要重寫了onMeasure()方法,設(shè)置了高寬,需要注意的是在用SquareLayout的時(shí)候要設(shè)置它的高寬都是match_parent。這樣就可以填滿GridView的每一項(xiàng)了。
接下來貼圖給大家看:

ImgeView的scaleType的屬性如果設(shè)置FitXY就會(huì)充滿方形布局,如果center就會(huì)居中顯示
詳細(xì)說一下吧:
1)center:保持原圖的大小,顯示在ImageView的中心。當(dāng)原圖的size大于ImageView的size,超過部分裁剪處理。
2)centerCrop:以填滿整個(gè)ImageView為目的,將原圖的中心對(duì)準(zhǔn)ImageView的中心,等比例放大原圖,直到填滿ImageView為止(指的是ImageView的寬和高都要填滿),原圖超過ImageView的部分作裁剪處理。
3)centerInside:以原圖完全顯示為目的,將圖片的內(nèi)容完整居中顯示,通過按比例縮小原圖的size寬(高)等于或小于ImageView的寬(高)。如果原圖的size本身就小于ImageView的size,則原圖的size不作任何處理,居中顯示在ImageView。
4)matrix:不改變?cè)瓐D的大小,從ImageView的左上角開始繪制原圖,原圖超過ImageView的部分作裁剪處理
5)fitCenter:把原圖按比例擴(kuò)大或縮小到ImageView的ImageView的高度,居中顯示
6)fitEnd:把原圖按比例擴(kuò)大(縮小)到ImageView的高度,顯示在ImageView的下部分位置
7)fitStart:把原圖按比例擴(kuò)大(縮小)到ImageView的高度,顯示在ImageView的上部分位置
8)fitXY:把原圖按照指定的大小在View中顯示,拉伸顯示圖片,不保持原比例,填滿ImageView.
本文已被整理到了《Android微信開發(fā)教程匯總》,歡迎大家學(xué)習(xí)閱讀。
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助。
- Android仿微信發(fā)朋友圈瀏覽圖片效果
- Android實(shí)現(xiàn)微信朋友圈發(fā)本地視頻功能
- Android 仿微信朋友圈點(diǎn)贊和評(píng)論彈出框功能
- Android自定義SwipeRefreshLayout高仿微信朋友圈下拉刷新
- Android 高仿微信朋友圈動(dòng)態(tài)支持雙擊手勢放大并滑動(dòng)查看圖片效果
- Android仿微信朋友圈圖片查看器
- Android仿微信朋友圈點(diǎn)擊加號(hào)添加圖片功能
- Android仿微信朋友圈點(diǎn)贊和評(píng)論功能
- Android+Html5混合開發(fā)仿微信朋友圈
- Android實(shí)現(xiàn)微信朋友圈圖片和視頻播放
相關(guān)文章
Android開發(fā)中使用WebView控件瀏覽網(wǎng)頁的方法詳解
這篇文章主要介紹了Android開發(fā)中使用WebView控件瀏覽網(wǎng)頁的方法,結(jié)合實(shí)例形式較為詳細(xì)的總結(jié)分析了Android WebView控件的功能、布局、設(shè)置、常用方法及相關(guān)操作技巧,需要的朋友可以參考下2017-10-10
Android自定義狀態(tài)欄顏色與應(yīng)用標(biāo)題欄顏色一致
看IOS上的應(yīng)用,應(yīng)用中狀態(tài)欄的顏色總能與應(yīng)用標(biāo)題欄顏色保持一致,用戶體驗(yàn)很不錯(cuò),對(duì)于這種效果怎么實(shí)現(xiàn)的呢?下面小編給大家分享android自定義狀態(tài)欄顏色與應(yīng)用標(biāo)題欄顏色一致的實(shí)現(xiàn)方法,一起看看吧2016-09-09
Android自動(dòng)化如何獲取視圖元素屬性(最新推薦)
在做Android自動(dòng)化時(shí)候,我們需要知道視圖有哪些元素,元素都有哪些屬性,獲取到屬性我們才能獲取到元素從而做自動(dòng)化控制,所以做Android自動(dòng)化獲取元素屬性是必要的第一步,這篇文章主要介紹了Android自動(dòng)化如何獲取視圖元素屬性(最新推薦),需要的朋友可以參考下2024-07-07
Kotlin學(xué)習(xí)教程之函數(shù)的默認(rèn)參數(shù)
這篇文章主要給大家介紹了關(guān)于Kotlin學(xué)習(xí)教程之函數(shù)的默認(rèn)參數(shù),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
Android TextView的TextWatcher使用案例詳解
這篇文章主要介紹了Android TextView的TextWatcher使用案例詳解,本篇文章通過簡要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08
Android中socket通信的簡單實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了Android中socket通信的簡單實(shí)現(xiàn),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-04-04
Android實(shí)現(xiàn)二維碼掃描和生成的簡單方法
這篇文章主要介紹了Android實(shí)現(xiàn)二維碼掃描和生成的簡單方法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07
基于RxJava2實(shí)現(xiàn)的簡單圖片爬蟲的方法
本篇文章主要介紹了基于RxJava2實(shí)現(xiàn)的簡單圖片爬蟲的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-02-02

