最新新的需求對即時通信里面的群組及成員頭像顯示有了新的需求更改叔收,顯然需求跟微信的效果差不多,自然我也是對微信群組頭像顯示的規(guī)則做了簡單的分析最后做出一個基本和微信差不多的控件,效果圖如下:
group_avatar效果圖
1:需求分析
對于這種需求其效果完全可以參照微信群組頭像顯示的規(guī)則來做喊括,當(dāng)只有一張圖的時候那直接就是顯示一張完整的圖像胧瓜,當(dāng)有兩個成員那么需要將兩個成員頭像均分控件的寬度,中間需要考慮間隔值郑什,并且需要在控件居中顯示府喳,當(dāng)有三個成員頭像時群成員排成一排居中在控件中顯示,當(dāng)有4個成員是需要將控件4等分并且考慮間隔值蘑拯,當(dāng)超過4個小余7個時則是需要將群員頭像劃成兩排居中顯示在控件中并且考慮間隔值钝满,最后一種情況就是9宮格那種形式將控件3*3等分控件,對這寫情況進(jìn)行一一實(shí)現(xiàn)申窘,最終的實(shí)現(xiàn)效果如上弯蚜;
2:具體實(shí)現(xiàn)
因?yàn)樯婕暗蕉鄨D顯示及考慮到最終需要網(wǎng)絡(luò)請求頭像則必然是選擇自定義ViewGroup來實(shí)現(xiàn),只需對加入的視圖控件進(jìn)行重新測量及排版即可偶洋;
1:自定義ViewGroup
繼承VIewGroup需要重寫兩個重要的方法一個是onMeause,一個是onLayout,先看onMeause方法該這么重寫熟吏,首先咱們肯定是要處理控件的wrap_context屬性,如下:
如果為wrap_content時將他們的寬高固定為100像素玄窝,接下來最重要的當(dāng)然是對子View的處理