[原創]自訂控制項之AndroidSegmentControlView，仿IOS平台UISegmentControlView，繼承自View

標籤：

著作權聲明：本文為博主原創文章，轉載請註明出處。

控制項簡介

UISegmentControl在IOS平台的App中非常常見，其控制項如所示：

這種控制項的主要作用是動態更改介面的顯示內容，一般應用於內容較多的介面，且分屏顯示不同種類的內容。

      在Android開發過程中，有時需要實作類別似UISegmentControl的效果，這裡我將自己的代碼開源在github上了，命名為SegmentControlView，下面是實現的效果： 

 

項目地址可點擊如下連結： 
https://github.com/Carbs0126/AndroidSegmentControlView

 

控制項說明

1 SegmentControlView extends View

      這個SegmentControlView是繼承自View的，而非群組控制項，因此實現起來雖然有點繁瑣，但是靈活性反而比群組控制項要高很多，並且可以加上過度效果等，且比群組控制項更加輕量化。

控制項特點

      我實現的這個SegmentControlView具有如下特點：

　　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>

 

布局檔案建立SegmentControlView

<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：

git clone https://github.com/Carbs0126/AndroidSegmentControlView.git

[原創]自訂控制項之AndroidSegmentControlView，仿IOS平台UISegmentControlView，繼承自View