版權聲明:本文爲博主原創文章,轉載請註明出處。android
UISegmentControl在IOS平臺的App中很是常見,其控件以下圖所示:git
這種控件的主要做用是動態的更改界面的顯示內容,通常應用於內容較多的界面,且分屏顯示不一樣種類的內容。github
在Android開發過程當中,有時須要實現相似UISegmentControl的效果,這裏我將本身的代碼開源在github上了,命名爲SegmentControlView,下面是實現的效果: 數組
項目地址可點擊以下連接:
https://github.com/Carbs0126/AndroidSegmentControlView微信
1 SegmentControlView extends View
這個SegmentControlView是繼承自View的,而非組合控件,所以實現起來雖然有點繁瑣,可是靈活性反而比組合控件要高不少,而且能夠加上過分效果等,且比組合控件更加輕量化。app
我實現的這個SegmentControlView具備以下特色:ide
1.SegmentControlView可設置與ViewPager聯動,在segment切換時具備顏色漸變效果,相似微信。 2.能夠自定義SegmentControlView的四個corner的半徑。 3.自定義背景顏色與字體顏色、字體大小等等。 4.在xml中設置SegmentControlView中的多個titles,自動按照titles生成多個segment。 5.設置按下顏色與normal顏色的色值對比度。 6.具備AT_MOST的適配功能,即具備wrap_content模式 7.能夠設置回調響應事件
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="SegmentControlView"> <attr name="scv_BackgroundSelectedColor" format="reference|color" />//選中segment的背景顏色 <attr name="scv_BackgroundNormalColor" format="reference|color" />//未選中segment的背景顏色 <attr name="scv_TextSelectedColor" format="reference|color" />//選中segment的文字顏色 <attr name="scv_TextNormalColor" format="reference|color" />//未選中segment的文字顏色 <attr name="scv_FrameColor" format="reference|color" />//segment邊框的顏色 <attr name="scv_FrameWidth" format="reference|dimension" />//segment邊框的寬度 <attr name="scv_FrameCornerRadius" format="reference|dimension" />//segment四個圓角的半徑大小 <attr name="scv_TextSize" format="reference|dimension" />//文字大小 <attr name="scv_TextArray" format="reference" />//string數組,每個string都會填充到一個segment中 <attr name="scv_SelectedIndex" format="reference|integer" />//默認選中的segment <attr name="scv_SegmentPaddingHorizontal" format="reference|dimension" />//每個segment內部的水平padding <attr name="scv_SegmentPaddingVertical" format="reference|dimension" />每個Segment的豎直方向的padding <attr name="scv_Gradient" format="reference|boolean" />//Segment改變時是否使用顏色漸變效果 </declare-styleable> </resources>
<cn.carbs.android.segmentcontrolview.library.SegmentControlView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:paddingLeft="10dp" android:paddingRight="10dp" app:scv_FrameCornerRadius="6dp" app:scv_FrameWidth="1dp" app:scv_Gradient="true" app:scv_SegmentPaddingVertical="5dp" app:scv_TextArray="@array/segment_control_arrays_0"/>
使用方法佈局
dependencies {
compile 'cn.carbs.android:SegmentControlView:1.0.0'
}
segmentcontrolview.setOnSegmentChangedListener(new SegmentControlView.OnSegmentChangedListener() { @Override public void onSegmentChanged(int newSelectedIndex) { if(viewpager != null){ //change the second argument to true if you want the gradient effect when viewpager is changing viewpager.setCurrentItem(newSelectedIndex, false);//viewpager changing without animation } } }); //set viewpager to change segment according to the state of viewpager segmentcontrolview.setViewPager(viewpager); //set the selected index of segments initiatively segmentcontrolview.setSelectedIndex(); //set gradient effect if you want segmentcontrolview.setGradient(true);
https://github.com/Carbs0126/AndroidSegmentControlView字體
git clone https://github.com/Carbs0126/AndroidSegmentControlView.gitspa