[原创]自定义控件之AndroidSegmentControlView,仿IOS平台UISegmentControlView,继承自View...

版权声明:本文为博主原创文章,转载请注明出处。

控件简介

UISegmentControl在IOS平台的App中非常常见,其控件如下图所示:

IOS平台的UISegmentControl

这种控件的主要作用是动态的更改界面的显示内容,一般应用于内容较多的界面,且分屏显示不同种类的内容。

      在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

转载于:https://www.cnblogs.com/carbs/p/5520116.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可自定义样式、功能全面的分段控件。项目地址:https://github.com/klongmitre/android-segmented-control-view效果图:如何使用xml中直接创建<org.mitre.ascv.AndroidSegmentedControlView         android:id="@ id/androidSegmentedControlView"         android:layout_width="match_parent"         android:layout_height="wrap_content"         ascv:ascv_defaultSelection="0"         ascv:ascv_unselectedTextColor="@color/test_attr_unselected_text_color"         ascv:ascv_selectedTextColor="@color/test_attr_selected_text_color"         ascv:ascv_selectedColor="@color/test_attr_selected_color"         ascv:ascv_unselectedColor="@color/test_attr_unselected_color"         ascv:ascv_items="@array/three_state_option"/>2. java中添加监听器,监听item的切换ascv = (AndroidSegmentedControlView)this.findViewById(R.id.androidSegmentedControlView); ascv.setIdentifier("ascv01"); //ascv.setItems(new String[]{"Test1aaaaa", "Test2", "Test3"}, new String[]{"1", "2", "3"}); ascv.setOnSelectionChangedListener(new OnSelectionChangedListener(){     @Override     public void newSelection(String identifier, String value) {//当item切换时触发  Toast.makeText(MainActivity.this, "identifier:" identifier "  value:" value, Toast.LENGTH_SHORT).show();     } });参数identifier是当有多个分段控件时,同时使用一个监听器时,用于区别是哪个触发了事件。属性说明属性名类型使用说明ascv_unselectedTextColorreference未选中的item的文字颜色ascv_unselectedColorreference未选中的item的背景颜色,不包括边框ascv_selectedColorreference选中的item背景的颜色以及边框的颜色ascv_selectedTextColorreference选中的item的文字颜色ascv_itemsreference控件item上显示的文字ascv_valuesreference控件item的值,会被传给监听器。未设置时,默认使用ascv_items。ascv_equalWidthboolean当item上的文字,即ascv_items设置的文字,长度不一致时,item的宽度是否还等长。ascv_stretchboolean是否被拉伸。即控件是否填充整个父容器。ascv_defaultSelectioninteger默认哪个item被选中,下标从0开始ascv_identifierstring控件的ID
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值