天天看點

仿天貓安卓用戶端Banner的Indicator

今天來說說類似天貓的banner中的小圓點是怎麼做的(圖中綠圈部分)

仿天貓安卓用戶端Banner的Indicator

在學習自定義控件之前,我用的是非常二的方法,直接在布局中放入多個imageview,然後代碼中根據pager切換來改變圖檔。這種方法雖然可以在切換完成後正确顯示小圓點,但是卻做不到如下圖中的切換中的狀态顯示:

仿天貓安卓用戶端Banner的Indicator

今天學到了自定義控件,正好可以把這個坑填上。

說一下思路:

在viewpager翻動的時候,會調用

其中positionoffset為翻動的百分比,是以隻要将這個參數傳入自定義控件,就可以計算出實心圓點的坐标

實戰:

pagerindicator.java

布局的設定:

仿天貓安卓用戶端Banner的Indicator

xml:

在使用到的地方:

初始化的方法,反正隻要比使用早調用到就行

設定viewpager監聽器:

完成的效果:

仿天貓安卓用戶端Banner的Indicator

顔色選得比較随意,覺得難看自己換掉吧,畢竟我沒有美工qaq。。。

最後吐槽下,原來csdn有私信啊。。。之前完全就沒注意過。。。是以一些資訊現在才看到也就不回了,畢竟都過去好久了,抱歉啦。。。。。。。。。。。