仿IOS Switch控件

该篇文章从eoeAndroid搬迁过来的，原文地址：仿IOS Switch控件

前几天写了一个仿ios的segmentcontrol控件（ 仿 ios segmentcontrol ），今天突然兴致来了，就写了一个仿ios 的switch控件，由于本人不是学习ps的，所以从ios上截取的图片可能不太完美，希望各位能够见谅。

废话不多少，上代码： 首先是得到自定义的属性，也就一个自定义的属性，就是控件的内容，默认值是on和off，可以在XML文件中引用，填写值的时候需要把打开写在前面，关闭写在后面，并用分号(:)隔开，如(开:关),注意分号是英文的分号。

public SwitchButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
        this.context = context;
        TypedArray typedArray = context.obtainStyledAttributes(attrs,
                R.styleable.SwitchButton);
        onOffString = typedArray.getString(R.styleable.SwitchButton_onOff);
        if (onOffString != null && (!"".equals(onOffString))) {
            String[] contentStr = onOffString.split(";");
            if (contentStr.length >= 2) {
                onString = "".equals(contentStr[0]) ? "on" : contentStr[0];
                offString = "".equals(contentStr[1]) ? "off" : contentStr[1];
            } else if (contentStr.length == 1) {
                onString = "".equals(contentStr[0]) ? "on" : contentStr[0];
                offString = "off";
            } else {
                onString = "on";
                offString = "off";
            }
        } else {
            onString = "on";
            offString = "off";
        }
        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        inflater.inflate(R.layout.view_switchbutton, this);
        switchLayout = (RelativeLayout) findViewById(R.id.switch_layout);
        switchOnBgTextView = (TextView) findViewById(R.id.switch_on_bg_textview);
        switchOffBgTextView = (TextView) findViewById(R.id.switch_off_bg_textview);
        switchOnButtonTextView = (TextView) findViewById(R.id.switch_on_button_textview);
        switchOffButtonTextView = (TextView) findViewById(R.id.switch_off_button_textview);
        switchOnButtonTextView.setTextColor(Color.WHITE);
        switchOnButtonTextView.setText(onString);
        switchOffButtonTextView.setTextColor(Color.GRAY);
        switchOffButtonTextView.setText(offString);
        switchLayout.setOnClickListener(this);
        setView();
    }

然后就是不同的点击事件展示不同的图片

private void setView() {
        if (switchStatues) {
            switchOnBgTextView.setVisibility(View.VISIBLE);
            switchOnButtonTextView.setVisibility(View.VISIBLE);
            switchOffBgTextView.setVisibility(View.GONE);
            switchOffButtonTextView.setVisibility(View.GONE);
        } else {
            switchOnBgTextView.setVisibility(View.GONE);
            switchOnButtonTextView.setVisibility(View.GONE);
            switchOffBgTextView.setVisibility(View.VISIBLE);
            switchOffButtonTextView.setVisibility(View.VISIBLE);
        }
    }

    @Override
    public void onClick(View v) {
        // TODO Auto-generated method stub
        switch (v.getId()) {
        case R.id.switch_layout:
            switchStatues = !switchStatues;
            setView();
            onCheckedChangeListener.onCheckedChange(switchStatues);
            break;

        default:
            break;
        }
    }

最后附上switch的布局

代码中的点击事件和得到当前的状态

button.setOnCheckedChangeListener(new OnCheckedChangeListener() {

            @Override
            public void onCheckedChange(boolean isChecked) {
                // TODO Auto-generated method stub
                if (isChecked) {
                    text.setText("开");
                } else {
                    text.setText("关");
                }
            }
        });

button.getSwitchStatues()

下载地址：项目代码