[Kotlin]Spinnerの実装のやり方、Spinnerの表示サイズを小さくする

5 min read読了の目安(約4600字

目的

  • spinner(コンボボックス)を実装する
  • spinnerの表示フォントを自由に変更する(今回はデフォルトよりも小さくする)
  • (応用)最初は空白を選択させて何か選択された場合は空白を選べないようにする

必要な準備

  • 選択肢の描画時に参照されるレイアウトファイルを作成する
  • 選択後、spinnerに表示する際の参照レイアウトファイルを作成する
  • 上記を指定してspinnerを初期化する

実装:選択肢の描画時に参照されるレイアウトファイルを作成する

res/layout階下にspinner_drop_item.xmlを作成する。

<?xml version="1.0" encoding="utf-8"?>
<!--
/* //device/apps/common/assets/res/any/layout/simple_spinner_item.xml
**
** Copyright 2006, The Android Open Source Project
**
** Licensed under the Apache License, Version 2.0 (the "License");
** you may not use this file except in compliance with the License.
** You may obtain a copy of the License at
**
**     http://www.apache.org/licenses/LICENSE-2.0
**
** Unless required by applicable law or agreed to in writing, software
** distributed under the License is distributed on an "AS IS" BASIS,
** WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
** See the License for the specific language governing permissions and
** limitations under the License.
*/
-->
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    style="?android:attr/spinnerItemStyle"
    android:singleLine="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:textAlignment="inherit"/>

実装:選択後、spinnerに表示する際の参照レイアウトファイルを作成する

res/layout階下にspinner_small_item.xmlを作成する。

<?xml version="1.0" encoding="utf-8"?>
<!--
/* //device/apps/common/assets/res/any/layout/simple_spinner_item.xml
**
** Copyright 2006, The Android Open Source Project
**
** Licensed under the Apache License, Version 2.0 (the "License");
** you may not use this file except in compliance with the License.
** You may obtain a copy of the License at
**
**     http://www.apache.org/licenses/LICENSE-2.0
**
** Unless required by applicable law or agreed to in writing, software
** distributed under the License is distributed on an "AS IS" BASIS,
** WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
** See the License for the specific language governing permissions and
** limitations under the License.
*/
-->
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    style="?android:attr/spinnerItemStyle"
    android:singleLine="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:textSize="12dp"
    android:textAlignment="inherit"/>

android:textSize="12dp"でデザインを変更しています。

上記を指定してspinnerを初期化する

class MainActivity : AppCompatActivity() {

    private val spinnerItems = arrayOf("","A","B","C")

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_input_size)
        supportActionBar!!.hide() // acitionBarを非表示にする

        var spinnerAdapter = ArrayAdapter(this, R.layout.spinner_small_item, spinnerItems)
        spinnerAdapter.setDropDownViewResource(R.layout.spinner_drop_item)
        spinner.adapter = spinnerAdapter
        spinner.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
            // 項目が選択された時に呼ばれる
            override fun onItemSelected(parent: AdapterView<*>?, view: View?, position: Int, id: Long) {
                }

            }
            // 基本的には呼ばれないが、何らかの理由で選択されることなく項目が閉じられたら呼ばれる
            override fun onNothingSelected(parent: AdapterView<*>?) {
            }
        }
    }

応用:最初は空白を選択させて何か選択された場合は空白を選べないようにする

    // コンボボックス(Spinner)で一度選択した場合は空白を選択できないように更新する
    fun removeEmptyChoise() {
        val spinnerItems = arrayOf("サイズA", "サイズB", "サイズC", "サイズD", "サイズE","自由入力")
        var spinnerAdapter = ArrayAdapter(this, R.layout.spinner_small_item, spinnerItems)
        spinnerAdapter.setDropDownViewResource(R.layout.spinner_drop_item)
        spinner.adapter = spinnerAdapter
    }

    // コンボボックス(Spinner)で空白を選択できないように更新して空白をセットする
    fun setDefaultSpinner() {
        val spinnerItems = arrayOf("","規格A", "規格B", "規格C", "規格D", "規格E")
        var spinnerAdapter = ArrayAdapter(this, R.layout.spinner_small_item, spinnerItems)
        spinnerAdapter.setDropDownViewResource(R.layout.spinner_drop_item)
        spinner.adapter = spinnerAdapter
        spinner.setSelection(0)
    }

removeEmptyChoiseメソッドをoverride fun onItemSelected(parent: AdapterView<*>?, view: View?, position: Int, id: Long) {内で呼び出せば問題ないです

本記事含め他の記事は「長時間1人で悩んで不安やストレスフルな方を解決したい」という一心で更新しております。少額でも構いませんのでサポートしていただけますと記事更新のモチベーションになりますので、御援助いただけますと助かります。