android自定义开关、图片按钮

首先是自定义图片按钮：

创建一个imagebutton.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/iv_myImageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/tv_myTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:text="确定"
        android:textColor="#FF0000" />

</LinearLayout>

写一个MyImageButton.java继承LinearLayout类

package com.yx.mycustomview.myview;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.yx.mycustomview.R;

public class MyImageButton extends LinearLayout {
	private ImageView imageView;
	private TextView textView;

	public MyImageButton(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	public MyImageButton(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		inflater.inflate(R.layout.imagebutton, this);
		imageView = (ImageView) findViewById(R.id.iv_myImageview);
		textView = (TextView) findViewById(R.id.tv_myTextView);

	}

	/** 设置图片资源 */
	public void setImageResource(int resId) {
		imageView.setImageResource(resId);
	}

	/** 设置显示的文本内容 */
	public void setTextViewText(String text) {
		textView.setText(text);
	}
}

然后在main。xml中引用自定义控件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFEEDD"
    android:orientation="vertical" >

    <com.yx.mycustomview.myview.MyImageButton
        android:id="@+id/btn_sure"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:background="@drawable/btn" />

    <com.yx.mycustomview.myview.MyImageButton
        android:id="@+id/btn_cancel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:background="@drawable/btn" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            style="@style/MySettingText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="开启通知" />

        <CheckBox
            style="@style/MyCheckBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            style="@style/MySettingText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="开启震动" />

        <CheckBox
            style="@style/MyCheckBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            style="@style/MySettingText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="开启铃声" />

        <CheckBox
            style="@style/MyCheckBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

</LinearLayout>

自定义控件当然少不了selector，下面是选择器btn.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/button_on" android:state_focused="true" android:state_pressed="false"></item>
    <item android:drawable="@drawable/button_down" android:state_pressed="true"></item>
    <item android:drawable="@drawable/button_down" android:state_checked="true"></item>
    <item android:drawable="@drawable/button_on" android:state_focused="false" android:state_pressed="false"></item>

</selector>

最后是MainActivity.java

package com.yx.mycustomview;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;

import com.yx.mycustomview.myview.MyImageButton;
import com.yx.mycustomview.util.ToastUtils;

public class MainActivity extends Activity implements OnClickListener {
	private MyImageButton btn_sure;
	private MyImageButton btn_cancel;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		init();
		btn_sure.setTextViewText("确定");
		btn_cancel.setTextViewText("取消");
		btn_sure.setOnClickListener(this);
		btn_cancel.setOnClickListener(this);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	private void init() {
		btn_sure = (MyImageButton) findViewById(R.id.btn_sure);
		btn_cancel = (MyImageButton) findViewById(R.id.btn_cancel);

	}

	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		switch (v.getId()) {
		case R.id.btn_sure:
			ToastUtils.showToast(MainActivity.this, "点击的是确认按钮...");
			break;
		case R.id.btn_cancel:
			ToastUtils.showToast(MainActivity.this, "点击的是取消按钮...");
			break;

		default:
			break;
		}
	}
}

到这里，自定义图片按钮就完成了。 截图如下：





接下来的自定义开关按钮就更简单了，控件就在main.xml布局中

<TextView
            style="@style/MySettingText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="开启通知" />

<CheckBox
            style="@style/MyCheckBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

没错， 就是它了。

style="@style/MySettingText"  style="@style/MyCheckBox"

这两句代码引用了style样式，因为很多时候我们需要给控件定义同样的一些属性，这时候我们可以把它们合并为一个自定义的样式添加到style.xml文件中，简化我们的代码，也增加我们的编码效率。

两个style代码分别如下：

<style name="MyCheckBox" parent="@android:style/Widget.CompoundButton.CheckBox">
        <item name="android:button">@drawable/check</item>
        <item name="android:layout_margin">10dp</item>
        <item name="android:layout_weight">1</item>
    </style>

    <style name="MySettingText">
        <item name="android:layout_margin">10dp</item>
        <item name="android:layout_weight">6</item>
    </style>

最后是自定义开关按钮的选择器check.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/on" android:state_checked="true"></item>
    <item android:drawable="@drawable/off" android:state_checked="false"></item>

</selector>

到这里，所有代码就写完了。截个图看看效果




demo源文件下载http://download.csdn.net/detail/yang_xing_/7730849