Android RadioGroup多行多列顯示

最近做的一個項目中的業務需要一個單選框顯示多個選擇項,而且需要多行多列顯示。

研究了一下谷歌給的demo,需要多個radiogroup協同控制, 這樣增加了許多邏輯判斷,不是很方便。從網上搜尋到了一些方法結合自己的實際測試,發現一個比較方便的實現方法。

參考:https://blog.csdn.net/nihaoqiulinhe/article/details/53943249

效果如下:

源碼如下:

佈局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginTop="20dp"
        android:background="#000000" />

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <RadioButton
            android:id="@+id/rb_1"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio1" />

        <RadioButton
            android:id="@+id/rb_2"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio2" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#000000" />

        <RadioButton
            android:id="@+id/rb_3"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio3" />

        <RadioButton
            android:id="@+id/rb_4"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio4" />

        <RadioButton
            android:id="@+id/rb_5"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio5" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#000000" />

        <RadioButton
            android:id="@+id/rb_6"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio6" />

        <RadioButton
            android:id="@+id/rb_7"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio7" />

        <RadioButton
            android:id="@+id/rb_8"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio8" />

        <RadioButton
            android:id="@+id/rb_9"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio9" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#000000" />

        <RadioButton
            android:id="@+id/rb_10"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio10" />

        <RadioButton
            android:id="@+id/rb_11"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio11" />

        <RadioButton
            android:id="@+id/rb_12"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio12" />

        <RadioButton
            android:id="@+id/rb_13"
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:text="radio13" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#000000" />
        
    </RadioGroup>

</LinearLayout>

Activity文件

package app.licy.rg.radiogroup;

import android.content.Context;
import android.graphics.Point;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.WindowManager;
import android.widget.LinearLayout;
import android.widget.RadioButton;

import butterknife.BindView;
import butterknife.ButterKnife;

/**
 * MainActivity
 *
 * @author : Licy
 * @date : 2019年4月9日
 * email :[email protected]
 */
public class MainActivity extends AppCompatActivity {

    @BindView(R.id.rb_1)
    RadioButton rb1;
    @BindView(R.id.rb_2)
    RadioButton rb2;
    @BindView(R.id.rb_3)
    RadioButton rb3;
    @BindView(R.id.rb_4)
    RadioButton rb4;
    @BindView(R.id.rb_5)
    RadioButton rb5;
    @BindView(R.id.rb_6)
    RadioButton rb6;
    @BindView(R.id.rb_7)
    RadioButton rb7;
    @BindView(R.id.rb_8)
    RadioButton rb8;
    @BindView(R.id.rb_9)
    RadioButton rb9;
    @BindView(R.id.rb_10)
    RadioButton rb10;
    @BindView(R.id.rb_11)
    RadioButton rb11;
    @BindView(R.id.rb_12)
    RadioButton rb12;
    @BindView(R.id.rb_13)
    RadioButton rb13;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);

        initRadioButtons();

    }

    public void initRadioButtons() {

        WindowManager windowManager = getWindowManager();
        Point point = new Point();
        windowManager.getDefaultDisplay().getSize(point);
        int width = point.x;
        // 這裏設置的是radio button的高度
        int height = dpToPx(this, 30);

        LinearLayout.LayoutParams params2 = (LinearLayout.LayoutParams) rb2.getLayoutParams();
        params2.setMargins(width / 2, -height, 0, 0);
        rb2.setLayoutParams(params2);

        LinearLayout.LayoutParams params4 = (LinearLayout.LayoutParams) rb4.getLayoutParams();
        params4.setMargins(width / 3, -height, 0, 0);
        rb4.setLayoutParams(params4);

        LinearLayout.LayoutParams params5 = (LinearLayout.LayoutParams) rb5.getLayoutParams();
        params5.setMargins((width / 3) * 2, -height, 0, 0);
        rb5.setLayoutParams(params5);

        LinearLayout.LayoutParams params7 = (LinearLayout.LayoutParams) rb7.getLayoutParams();
        params7.setMargins(width / 4, -height, 0, 0);
        rb7.setLayoutParams(params7);

        LinearLayout.LayoutParams params8 = (LinearLayout.LayoutParams) rb8.getLayoutParams();
        params8.setMargins((width / 4) * 2, -height, 0, 0);
        rb8.setLayoutParams(params8);

        LinearLayout.LayoutParams params9 = (LinearLayout.LayoutParams) rb9.getLayoutParams();
        params9.setMargins((width / 4) * 3, -height, 0, 0);
        rb9.setLayoutParams(params9);

        LinearLayout.LayoutParams params11 = (LinearLayout.LayoutParams) rb11.getLayoutParams();
        params11.setMargins(width / 4, -height, 0, 0);
        rb11.setLayoutParams(params11);

        LinearLayout.LayoutParams params12 = (LinearLayout.LayoutParams) rb12.getLayoutParams();
        params12.setMargins((width / 4) * 2, -height, 0, 0);
        rb12.setLayoutParams(params12);

        LinearLayout.LayoutParams params13 = (LinearLayout.LayoutParams) rb13.getLayoutParams();
        params13.setMargins((width / 4) * 3, -height, 0, 0);
        rb13.setLayoutParams(params13);

    }

    /**
     * 根據手機的分辨率從 dp 的單位 轉成爲 px(像素)
     */
    public static int dpToPx(final Context context, final float dp) {
        return (int) (dp * context.getResources().getDisplayMetrics().density);
    }


}

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章