android pr button,Android RadioButton 实现选项卡效果 (笔记)

要养成记笔记的好习惯。。。

效果图，  随便做了两个图片，样子有点。。。

Xml  就是拖了个RadioGroup 方向水平，子控件平分宽度。

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="vertical" >

android:id="@+id/radioGroup1"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:orientation="horizontal" >

android:id="@+id/radio0"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_weight="1"

android:background

android:button="@null"

android:gravity="center_horizontal"

android:text="今天" />

android:id="@+id/radio1"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_weight="1"

android:button="@null"

android:background="@android:color/transparent"

android:gravity="center"

android:text="昨天" />

android:id="@+id/radio2"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_weight="1"

android:background="@android:color/transparent"

android:button="@null"

android:gravity="center"

android:text="前天" />

给每个radiobutton 设置了背景 ， 当不设置背景在2.3上运行时是这个样子的，设置了背景就好了。知道为什么的请告知下小弟

Activity代码有注释。

package com.example.radiobuttontest;

import android.annotation.SuppressLint;

import android.graphics.Rect;

import android.graphics.drawable.Drawable;

import android.os.Bundle;

import android.support.v7.app.ActionBarActivity;

import android.view.ViewTreeObserver.OnPreDrawListener;

import android.widget.CompoundButton;

import android.widget.RadioButton;

import android.widget.RadioGroup;

import android.widget.RadioGroup.OnCheckedChangeListener;

public class MainActivity extends ActionBarActivity {

private RadioGroup group;

private RadioButton rb1,rb2,rb3;

private Drawable bottomDrawableNormal;

private Drawable bottomDrawableChecked;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

group = (RadioGroup) this.findViewById(R.id.radioGroup1);

rb1 = (RadioButton) this.findViewById(R.id.radio0);

rb2 = (RadioButton) this.findViewById(R.id.radio1);

rb3 = (RadioButton) this.findViewById(R.id.radio2);

//处理点击事件

group.setOnCheckedChangeListener(new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(RadioGroup group, int checkedId) {

}

});

rb1.setOnCheckedChangeListener(rbCheckedChangeListener);

rb2.setOnCheckedChangeListener(rbCheckedChangeListener);

rb3.setOnCheckedChangeListener(rbCheckedChangeListener);

rb1.setChecked(true);

bottomDrawableNormal = getResources().getDrawable(R.drawable.radiobutton_normal);

bottomDrawableChecked = getResources().getDrawable(R.drawable.radiobutton_checked);

//Activity中可以在onWindowFocusChanged 时获取控件的真正尺寸。

//Fragment中就要再ViewTreeObserver中监听OnPreDrawListener 通过getMeasuredWidth() 获取真正尺寸

//这个种实现方式Activity和Fragment中都可以，但是Activity中有回调

//so.这个方法推荐在Fragment中使用

rb1.getViewTreeObserver().addOnPreDrawListener(new OnPreDrawListener() {

@Override

public boolean onPreDraw() {

//如果draw的Bounds = rb1.getMeasuredWidth() 就代表已经设置过了。

if(!(bottomDrawableChecked.getBounds().right == rb1.getMeasuredWidth())){

Rect rect = new Rect(0, 0,rb1.getMeasuredWidth(), 10);

//设置图片边框

bottomDrawableNormal.setBounds(rect);

bottomDrawableChecked.setBounds(rect);

//设置图片

rb1.setCompoundDrawables(null, null, null, bottomDrawableChecked);//第一个是选中状态

rb2.setCompoundDrawables(null, null, null, bottomDrawableNormal);

rb3.setCompoundDrawables(null, null, null, bottomDrawableNormal);

//设置图片与文字的间距

rb1.setCompoundDrawablePadding(10);

rb2.setCompoundDrawablePadding(10);

rb3.setCompoundDrawablePadding(10);

}

return true;

}

});

}

// Activity中的实现方式

//@Override

//public void onWindowFocusChanged(boolean hasFocus) {

//super.onWindowFocusChanged(hasFocus);

//

//if(hasFocus){

上左，下右 两个点能确定一个矩形。

//Rect rect = new Rect(0, 0,rb1.getWidth(), 10);

设置图片边框

//bottomDrawableNormal.setBounds(rect);

//bottomDrawableChecked.setBounds(rect);

设置图片

//rb1.setCompoundDrawables(null, null, null, bottomDrawableChecked);//第一个是选中状态

//rb2.setCompoundDrawables(null, null, null, bottomDrawableNormal);

//rb3.setCompoundDrawables(null, null, null, bottomDrawableNormal);

设置图片与文字的间距

//rb1.setCompoundDrawablePadding(10);

//rb2.setCompoundDrawablePadding(10);

//rb3.setCompoundDrawablePadding(10);

//}

//}

//处理radioButton状态改变时样式变化

private CompoundButton.OnCheckedChangeListener rbCheckedChangeListener = new CompoundButton.OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

if(isChecked){

buttonView.setCompoundDrawables(null, null, null, bottomDrawableChecked);

}else{

buttonView.setCompoundDrawables(null, null, null, bottomDrawableNormal);

}

}

};

}

android 4.3 以后可以在Fragment中 这样处理 ，ViewTreeObserver 的 addOnWindowFocusChangeListener 是在API Level 18才有的， 低版本运行下面的代码会crash。上么的写法通用， 我是先这样写了之后做适配出了问题 ， 不过也写出来当笔记咯

rb1.getViewTreeObserver().addOnWindowFocusChangeListener(new OnWindowFocusChangeListener() {

@Override

public void onWindowFocusChanged(boolean hasFocus) {

//上左，下右 两个点能确定一个矩形。

Rect rect = new Rect(0, 0,rb1.getWidth(), 10);

//设置图片边框

bottomDrawableNormal.setBounds(rect);

bottomDrawableChecked.setBounds(rect);

//设置图片

rb1.setCompoundDrawables(null, null, null, bottomDrawableChecked);//第一个是选中状态

rb2.setCompoundDrawables(null, null, null, bottomDrawableNormal);

rb3.setCompoundDrawables(null, null, null, bottomDrawableNormal);

//设置图片与文字的间距

rb1.setCompoundDrawablePadding(10);

rb2.setCompoundDrawablePadding(10);

rb3.setCompoundDrawablePadding(10);

}

});