今回は、AndroidのSpinnerレイアウトをカスタムする記事となります。

具体的には、プルダウンで表示されるメニューの文字サイズを項目毎に変更する方法について書いていきたいと思います。

 

完成イメージは以下となります。

プルダウンで表示される項目をそれぞれ

小:12dp

中:15dp

大:18dp

特大:21dp

として設定しています。

 

では、以下から実装について書いていきます。

 

1.レイアウトファイルにSpinnerを定義する

以下のように、画面レイアウトファイルにSpinnerを定義します。

<TextView
	android:id="@+id/textSizeView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="テキストサイズ変更"
	android:textSize="15dp"
	android:layout_weight="1" />

<Spinner
	android:id="@+id/textSizeSpinner"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="サイズ"
	android:layout_gravity="center_vertical"
	android:gravity="right" />

2.プルダウンメニューに設定するアダプタを実装

プルダウンメニューに設定する文字サイズを変更するためにカスタマイズする必要があるために、以下のようにレイアウトとAdapterクラスを作成します。
まず、レイアウトファイルrow_text_size.xmlを以下のように定義します。

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

    <TextView
        android:id="@+id/select_text_size_view"
        android:textColor="@android:color/black"
        android:textSize="15dp"
        android:layout_gravity="center_vertical"
        android:gravity="center"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_width="match_parent"
        android:layout_height="45dp" />

</LinearLayout>
 
次に、TextSizeAdapterクラスを以下のように実装します。
getViewはプルダウンメニューの項目毎に呼び出されるメソッドですが、その中でsetTextSizeをすることでテキストサイズを変更するようにしています。

public class TextSizeAdapter extends BaseAdapter {

    private final LayoutInflater inflater;
    private final int layoutID;
    private final String[] names;
    private final int[] sizes;

    static class TextSizeViewHolder {
        TextView textView;
    }

    public TextSizeAdapter(Context context,
                    int itemLayoutId,
                    String[] spinnerItems,
                    int[] spinnerSizes ){

        inflater = LayoutInflater.from(context);
        layoutID = itemLayoutId;
        names = spinnerItems;
        sizes = spinnerSizes;
    }

    @Override
    public int getCount() {
        return names.length;
    }

    @Override
    public Object getItem(int position) {
        return position;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        TextSizeViewHolder holder;
        if (convertView == null) {
            convertView = inflater.inflate(layoutID, null);
            holder = new TextSizeViewHolder();

            holder.textView = convertView.findViewById(R.id.select_text_size_view);
            convertView.setTag(holder);
        } else {
            holder = (TextSizeViewHolder) convertView.getTag();
        }

        holder.textView.setText(names[position]);
        holder.textView.setTextSize(TypedValue.COMPLEX_UNIT_DIP, sizes[position]);

        return convertView;
    }
}

3.Adapterを利用するUtilityクラスを実装

プルダウンメニューに表示する項目と対応するテキストサイズをAdapterを利用して生成するTextSizeUtilクラスを以下のように実装します。

public class TextSizeUtil {
    public static final int TEXT_SIZE_SMALL = 12;
    public static final int TEXT_SIZE_MEDIUM = 15;
    public static final int TEXT_SIZE_LARGE = 18;
    public static final int TEXT_SIZE_EXTRA_LARGE = 21;


    private String[] textNames;
    private static final int[] textSizes = { TEXT_SIZE_SMALL, TEXT_SIZE_MEDIUM, TEXT_SIZE_LARGE, TEXT_SIZE_EXTRA_LARGE };

    private TextSizeAdapter mTextSizeAdapter;

    public TextSizeUtil(Context context) {
        textNames = new String[4];
        textNames[0] = "小";
        textNames[1] = ”中”;
        textNames[2] = ”大”;
        textNames[3] = ”特大”;
        mTextSizeAdapter = new TextSizeAdapter(context, R.layout.row_text_size, textNames, textSizes);
    }

    public void createTextSizeSpinner(Spinner spinner) {
        spinner.setAdapter(mTextSizeAdapter);
        spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                Log.d("SELECT", "選択されたサイズは" + textNames[position]);
            }

            @Override
            public void onNothingSelected(AdapterView<?> parent) {

            }
        });
    }

    public int getSpecifiedValuePosition(float size) {
        int position = 0;

        for (int i = 0; i < textSizes.length; i++) {
            if (textSizes[i] == size) {
                position = i;
                break;
            }
        }

        return position;
    }
}

4.Utilityクラスを利用してSpinnerを実装

上記で実装したTextSizeUtilクラスを利用して、Spinnerを以下のように実装します。

public class SettingActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_setting);

        Spinner textSizeSpinner = (Spinner) findViewById(R.id.textSizeSpinner);
        TextSizeUtil textSizeUtil = new TextSizeUtil(getApplicationContext());
        textSizeUtil.createTextSizeSpinner(textSizeSpinner);
        textSizeSpinner.setSelection(textSizeUtil.getSpecifiedValuePosition(15));
    }
}
 
以上となります。
この実装をしたパスワードメモ 画面ロック付きのパスワード管理ツールで動作確認をする事が出来ます。無料で提供していますので是非インストールしてみて下さい!