4

に異なるスタイルを設定する最も簡単な方法:最初のため特定のラジオボタン - 私は私のレイアウトでラジオボタンのこの特定のタイプを達成したいと思います/最初の最後のボタン

enter image description here

=異なるグラフィックアイテム、中間のもの、および最後のものには、異なる角の丸いものがあります。 3つのタイプのボタン(カスタムスタイル、ステートフルな描画可能なものを使用しています)では、さまざまなスタイルでこれを行うことができます。

私はこれをカスタムトグルボタンを使って実装しています。私は最初と最後の項目に異なるドローアブルを使用するための描画可能なセレクタを利用したいと思いますので、私は使用します。

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 

    <item android:state_checked="true" android:state_first="true" 
     android:drawable="@drawable/radio_left_act"/> 

    <item android:state_checked="true" android:state_last="true" 
     android:drawable="@drawable/radio_right_act"/> 

    <item android:state_checked="true" 
     android:drawable="@drawable/radio_middle_act"/> 

    <item android:state_checked="false" android:state_first="true" 
     android:drawable="@drawable/radio_left_inact"/> 

    <item android:state_checked="false" android:state_last="true" 
     android:drawable="@drawable/radio_right_inact"/> 

    <item android:state_checked="false" 
     android:drawable="@drawable/radio_middle_inact"/> 

</selector> 

しかし、今、私はstate_firstを述べた問題を、持っている、state_lastは私に自動的に設定されていませんLinearLayoutですので、ボタンをクリックするたびに手動で設定する必要があります。これらの状態が自動的に設定されるいくつかの方法、レイアウトがありますか?何か助けてくれてありがとう。

答えて

3

特別なことは何も見つかりません。ここでは、カスタムトグルボタン付きの「デフォルト」のソリューションです。 、これだけ1つのボタンを同時にチェックインされ、

<!-- Toggle button styles --> 

<style name="CustomToggle"> 
    <item name="android:paddingTop">9dp</item> 
    <item name="android:paddingBottom">9dp</item> 
    <item name="android:layout_height">wrap_content</item> 
    <item name="android:layout_width">0dp</item> 
    <item name="android:layout_weight">1</item> 
</style>    

<style name="FirstToggle" parent="@style/CustomToggle"> 
    <item name="android:background">@drawable/radio_first</item> 
</style>    

<style name="MiddleToggle" parent="@style/CustomToggle"> 
    <item name="android:background">@drawable/radio_middle</item> 
</style>    

<style name="LastToggle" parent="@style/CustomToggle"> 
    <item name="android:background">@drawable/radio_last</item> 
</style> 

そして、トグルボタンのイベントを処理活動のためのショートコード:ここではまず、真ん中のものと最後のボタンの3つの異なるスタイル(styles.xmlに置く)ですボタンをチェックし無効になっています:

public class AktivityActivity extends Activity 
{ 
    ArrayList<ToggleButton> toggle_buttons; 

    public void onCreate(Bundle savedInstanceState) 
    { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.aktivity); 

     initToggleButtons(); 
    } 

    private void initToggleButtons() 
    { 
     toggle_buttons = new ArrayList<ToggleButton>(); 
     toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_1)); 
     toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_2)); 
     toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_3)); 

     // Listen on all toggle buttons 
     for (ToggleButton toggle_button : toggle_buttons) 
      toggle_button.setOnCheckedChangeListener(check_listener); 

     // Check first toggle button 
     updateToggleButtons(toggle_buttons.get(0)); 
    } 

    // Only one toggle can be checked, and checked button must be disabled 
    private void updateToggleButtons(ToggleButton checked_button) 
    { 
     for (ToggleButton toggle_button : toggle_buttons) 
     { 
      toggle_button.setChecked(toggle_button == checked_button); 
      toggle_button.setEnabled(toggle_button != checked_button); 
     } 
    } 

    // Toggle buttons change listener 
    OnCheckedChangeListener check_listener = new OnCheckedChangeListener() 
    { 
     public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) 
     { 
      if (isChecked) 
       updateToggleButtons((ToggleButton) buttonView); 
     } 
    }; 
} 

多分それが誰かのために役に立つことができます...

1

あなたはWordpress Androidプロジェクトをチェックアウトする必要があります。同様の機能を提供する「ToggleButton」を使用します。 .xmlの外観はhereです。完全なソースをダウンロードするにはhereに行きます。

トグルボタンが付いているので、望むものと同じではありませんが、ラジオボタンの必要なスタイルに合わせて調整することができます(まだ組み込まれていない場合)。

Wordpress Androidプロジェクトは私が多くを学ぶのを助けました。テーマ、カスタムボタン、カスタムレイアウト、トグルボタン、xmlrpcなどからのすべて。

+0

はトンいただき、ありがとうございます彼はヒントをする。私はこれらのコードを今チェックしていますが、私の場合に似たものが見えるかどうかわかりません。私は彼らがそこにトグルボタンの1つのスタイルを使用すると思う。しかし、私はスタイルに関する素晴らしい仕事があることに同意します。もし、良い "ready-solution"がなければ、私はそれを自分でやる必要があります。 –

1

enter image description here

SI私はこれを行うために見つけmplest方法は次のとおりです。

1)以下のようにRadioButtonクラスを拡張:

import android.content.Context; 
import android.view.ViewGroup; 
import android.widget.RadioButton; 

public class RoundedButton extends RadioButton { 

    private static final int[] STATE_ONLY_ONE = new int[] { 
      android.R.attr.state_first, 
      android.R.attr.state_last, 
    }; 

    private static final int[] STATE_FIRST = new int[] { 
      android.R.attr.state_first 
    }; 

    private static final int[] STATE_LAST = new int[] { 
      android.R.attr.state_last 
    }; 

    public RoundedButton(Context context) { 
     super(context); 
    } 

    @Override 
    protected int[] onCreateDrawableState(int extraSpace) { 
     ViewGroup parent = (ViewGroup) getParent(); 
     if (parent == null) { 
      return super.onCreateDrawableState(extraSpace); 
     } 

     final int size = parent.getChildCount(); 
     final boolean isFirst = (parent.getChildAt(0) == this); 
     final boolean isLast = (parent.getChildAt(size-1) == this); 

     int[] states = super.onCreateDrawableState(extraSpace + 2); 
     if (isFirst && isLast) { 
      mergeDrawableStates(states, STATE_ONLY_ONE); 
     } else if (isFirst) { 
      mergeDrawableStates(states, STATE_FIRST); 
     } else if (isLast) { 
      mergeDrawableStates(states, STATE_LAST); 
     } 

     return states; 
    } 

} 

2)ラジオのためのXMLコードの下に追加 "のres /描画可能/ rbtn_selector.xml" で1つのXMLファイルを作成します。ボタンの背景。

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <!-- First Checked --> 
    <item android:state_first="true" android:state_checked="true"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_selected_start" 
       android:endColor="@color/radio_button_selected_end" 
       android:type="linear" /> 
      <!--<solid android:color="@android:color/holo_blue_dark" />--> 
      <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"/> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_selected" /> 
     </shape> 
    </item> 

    <!-- First Unchecked --> 
    <item android:state_first="true" android:state_checked="false"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_unselected_start" 
       android:endColor="@color/radio_button_unselected_end" 
       android:type="linear" /> 
      <!--<solid android:color="@android:color/holo_purple"/>--> 
      <corners android:topLeftRadius="10dp" android:topRightRadius="@dimen/radio_button_radius"/> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_unselected" /> 
     </shape> 
    </item> 

    <!-- Last Checked --> 
    <item android:state_last="true" android:state_checked="true"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_selected_start" 
       android:endColor="@color/radio_button_selected_end" 
       android:type="linear" /> 
      <!--<solid android:color="@android:color/holo_green_dark" />--> 
      <corners android:bottomLeftRadius="@dimen/radio_button_radius" android:bottomRightRadius="@dimen/radio_button_radius"/> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_selected" /> 
     </shape> 
    </item> 

    <!-- Last Unchecked --> 
    <item android:state_last="true" android:state_checked="false"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_unselected_start" 
       android:endColor="@color/radio_button_unselected_end" 
       android:type="linear" /> 
      <!--<solid android:color="@android:color/holo_red_dark"/>--> 
      <corners android:bottomLeftRadius="@dimen/radio_button_radius" android:bottomRightRadius="@dimen/radio_button_radius"/> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_unselected" /> 
     </shape> 
    </item> 



    <!-- Default Checked --> 
    <item android:state_checked="true"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_selected_start" 
       android:endColor="@color/radio_button_selected_end" 
       android:type="linear" /> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_selected" /> 
      <!--<solid android:color="@android:color/holo_orange_dark" />--> 
     </shape> 
    </item> 

    <!-- Default Unchecked --> 
    <item android:state_checked="false"> 
     <shape> 
      <gradient 
       android:angle="90" 
       android:startColor="@color/radio_button_unselected_start" 
       android:endColor="@color/radio_button_unselected_end" 
       android:type="linear" /> 
      <stroke android:width="@dimen/radio_button_border" android:color="@color/radio_button_border_unselected" /> 
      <!--<solid android:color="@android:color/holo_green_light"/>--> 
     </shape> 
    </item> 
</selector> 

3)に1つのXMLファイルを作成する "RES// rbtn_textcolor_selector.xml描画可能" ラジオボタンテキストセレクタ色用のXMLコードの下に追加します。(テキストカラーセレクタXMLファイル)

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_checked="true" android:color="@color/radio_text_selected"/> 
    <item android:color="@color/radio_text_unselected"/> 
</selector> 

4)あなたのスタイルをボタンに設定してください:

4。1)プログラムexixsting RADIOGROUPにいくつかのRoundedButtonを追加します。

RoundedButton newRadioButton = new RoundedButton(this.getActivity()); 

if(android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.JELLY_BEAN) { 
    newRadioButton.setBackgroundDrawable(this.getActivity().getResources().getDrawable(R.drawable.rbtn_selector)); 
} else { 
    newRadioButton.setBackground(this.getActivity().getResources().getDrawable(R.drawable.rbtn_selector)); 
} 
newRadioButton.setTextColor(this.getActivity().getResources().getColorStateList(R.color.rbtn_textcolor_selector)); 

4.2)は、XML:

<color name="radio_text_selected">#FFF</color> 
<color name="radio_text_unselected">#222</color> 

<color name="radio_button_selected_start">#5393c5</color> 
<color name="radio_button_selected_end">#6facd5</color> 

<color name="radio_button_unselected_start">#f9f9f9</color> 
<color name="radio_button_unselected_end">#eee</color> 

<color name="radio_button_border_selected">#2373a5</color> 
<color name="radio_button_border_unselected">#aaa</color> 

<RoundedButton 
    android:id="@+id/bt_id_1" 
    android:background="@drawable/rbtn_selector" 
    android:textColor="@drawable/rbtn_textcolor_selector" /> 

5)私は例で使用したものであるあなた自身の色や大きさを選択します。

と:

<dimen name="radio_button_radius">10dp</dimen> 
<dimen name="radio_button_border">0.7dp</dimen>