ラジオボタン-02（カスタマイズ編）

ラジオボタンをカスタマイズして、ちょっとそれっぽくしてみようと思います。

xmlで作成した、レイアウトファイルを読み込んでそれっぽく作ります。

なお、ラジオボタンの使い方に関しては、
ラジオボタン-01（RadioGroup, RadioButton）

xmlで背景を作成する方法に関しては
xmlで背景を変更(android:shape=)

を参照してください。

■サンプル
●MainActivity

package com.example.sample;

import android.os.Bundle;
import android.view.Gravity;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
import android.widget.Toast;
import android.app.Activity;

public class MainActivity extends Activity implements OnCheckedChangeListener {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
　      //レイアウトの生成
        LinearLayout layout=new LinearLayout(getApplicationContext());
        //上から下にオブジェクトを配置するよう設定
        layout.setOrientation(LinearLayout.VERTICAL);

        //画面表示の設定
        setContentView(layout);

        //レイアウトパラム定数(縦横の長さの定数)の格納
        int WC = ViewGroup.LayoutParams.WRAP_CONTENT;
        int MP = ViewGroup.LayoutParams.MATCH_PARENT;
        
        //ラジオグループの登録
        RadioGroup oRadiGrop = new RadioGroup(getApplicationContext());
        //チェック時の処理を通知させる　
        oRadiGrop.setOnCheckedChangeListener(this);
        //左から右へとオブジェクトを配置
        oRadiGrop.setOrientation(LinearLayout.HORIZONTAL);
        oRadiGrop.setGravity(Gravity.CENTER_HORIZONTAL);

        //ラジオグループをレイアウトに追加
        layout.addView(oRadiGrop, new LinearLayout.LayoutParams(MP, MP);

        //レイアウトパラムの作成
        LayoutParams oLayPar = new LinearLayout.LayoutParams(WC, WC);
        
        //ラジオグループにラジオボタンを追加
        oRadiGrop.addView(Make_RadioButton(0, "ROW"), oLayPar);
        oRadiGrop.addView(Make_RadioButton(1, "MID"), oLayPar);
        oRadiGrop.addView(Make_RadioButton(2, "HIGH"), oLayPar);
        
    }
 
    @Override
    public void onCheckedChanged(RadioGroup oRG, int Id) {
     //無選択状態のidは-1
        if (Id ==-1)return;
        //IDに紐づくテキストを取得
        String sText = String.valueOf(((RadioButton)findViewById(Id)).getText());
        //現在チェックされているidを取得
        int iActiveID = oRG.getCheckedRadioButtonId();
        //選択されたIDに紐づくテキストを表示
        Toast.makeText(getApplicationContext(), sText ,Toast.LENGTH_SHORT).show();
        //アクティブなIDを表示
        Toast.makeText(getApplicationContext(), String.valueOf(iActiveID),Toast.LENGTH_SHORT).show();
    }

    private RadioButton Make_RadioButton(int id, String sTitle){
        //ラジオボタンの生成
        RadioButton oRadioBtn = new RadioButton(this);
        //ラジオボタンにIDを設定
        oRadioBtn.setId(id);
        //ラジオボタンに文字列を設定
        oRadioBtn.setText(sTitle);
        //ラジオボタンを消す
        oRadioBtn.setButtonDrawable(android.R.id.empty);
        //作成したxmlを背景に設定
        oRadioBtn.setBackgroundResource(R.drawable.stylebutton);

        //ラジオボタンを返す
        return oRadioBtn;
    }
}

●xmlファイル
stylebutton.xml

■実行結果

メインの処理は特に変わったことはしていませんが、

//左から右へとオブジェクトを配置
oRadiGrop.setOrientation(LinearLayout.HORIZONTAL);
ラジオボタンを横に並べる記述です。
何も記述しないと縦に縦にラジオボタンが配置されます。

oRadiGrop.setGravity(Gravity.CENTER_HORIZONTAL);
ラジオボタンを真ん中に集める処理です。

Make_RadioButton関数の
//ラジオボタンを消す
oRadioBtn.setButtonDrawable(android.R.id.empty);
//作成したxmlを背景に設定
oRadioBtn.setBackgroundResource(R.drawable.stylebutton);

が今回のポイントで
//ラジオボタンを消す
oRadioBtn.setButtonDrawable(android.R.id.empty);
で、ラジオボタンのチンチクリンの丸いチェックを表示させないようにしています。
これをすると、ラジオボタンらしさは消えます。

//作成したxmlを背景に設定
oRadioBtn.setBackgroundResource(R.drawable.stylebutton);
この処理で、なくしたラジオボタンらしさに、新たな個性を付け加えます。


ではでは、xmlファイルを見ていきましょう。

<!-- 選択時 -->
<item
  android:state_checked="true"
  android:shape="rectangle">

<!-- 未選択時 -->
  <item
    android:state_checked="false"
    android:shape="rectangle">

この記述で、ラジオボタン選択中に呼ぶアイテムとラジオボタン未選択時に呼ぶ
アイテムとを区別しています。

<corners 
　　android:radius="1dip" />
この処理によって、ボタンの4角を少しだけ、曲げています。

また、選択時に
<stroke
android:width="2dp"

をすることで、ボタンを少し小さく見せています。ほんの少しですが。。。
押されている感を出しています。

グラデーションも自分なりに工夫してみましたが。。。どうでしょうか？？


デザインとか何かいろいろ面倒なことが多いのですが、
これを用いることで、iPhone風のAndroidアプリも
作成できます。

「iPhoneとまったく同じで作って！！」

みたいな仕様が来たときはこんな感じでパワープレイで乗り切りましょう！！


てか、そんな仕様を私は絶対に認めないけど。。

と言いつつも、結局折れてしまいますが。。