2拓の切り替えのSwitch系が3種類、Switch, SwitchCompat, SwitchMaterial があります
簡単なON/OFFならどれもあまり変わりませんが、それなりに意味があることもあります
2021.2.1
SwitchMaterial
SwitchMaterialはSwitchCompatを継承しているのですが
Switchを継承してはいない
ただSwitchはCompoundButtonを継承しているのもあるので似た感じで使えます
java.lang.Object | ||||||
↳ | android.view.View | |||||
↳ | android.widget.TextView | |||||
↳ | android.widget.Button | |||||
↳ | android.widget.CompoundButton | |||||
↳ | androidx.appcompat.widget.SwitchCompat | |||||
↳ | com.google.android.material.switchmaterial.SwitchMaterial |
基本設定
基本的な設定はSwitchCompatと同じように作成できます
MainActivity.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
//package com.example.testswithmaterial; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import com.google.android.material.switchmaterial.SwitchMaterial; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); SwitchMaterial sw0 = findViewById(R.id.switch0); sw0.setOnCheckedChangeListener((buttonView, isChecked) -> { if (isChecked) { Log.v("debug","The SwitchMaterial is enabled"); } else { Log.v("debug","The SwitchMaterial is disabled"); } }); } } |
activity_main.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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" tools:context=".MainActivity"> <com.google.android.material.switchmaterial.SwitchMaterial android:id="@+id/switch0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/app_name" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout> |
色の変更
SwitchCompatとほぼ同じですが色合いに関しては微妙に異なります
それぞれのSwitchを比較してSwitchMaterialの色合いを変更してみます
MainActivity.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
//package com.example.testswitchmaterial; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import com.google.android.material.switchmaterial.SwitchMaterial; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); SwitchMaterial sm = findViewById(R.id.switch_material); sm.setOnCheckedChangeListener((buttonView, isChecked) -> { if (isChecked) { sm.setText(R.string.enabled); } else { sm.setText(R.string.disabled); } }); } } |
activity_main.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 |
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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" tools:context=".MainActivity"> <Switch android:layout_width="200dp" android:layout_height="wrap_content" android:text="@string/sw" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.35" tools:ignore="UseSwitchCompatOrMaterialXml" /> <androidx.appcompat.widget.SwitchCompat android:layout_width="200dp" android:layout_height="wrap_content" android:text="@string/sc" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.4" /> <com.google.android.material.switchmaterial.SwitchMaterial android:layout_width="200dp" android:layout_height="wrap_content" android:text="@string/sm" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.45" /> <com.google.android.material.switchmaterial.SwitchMaterial style="@style/SwitchMaterialStyle" android:id="@+id/switch_material" android:layout_width="200dp" android:layout_height="wrap_content" android:text="@string/smc" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.55" /> </androidx.constraintlayout.widget.ConstraintLayout> |
strings.xml
1 2 3 4 5 6 7 8 9 |
<resources> <string name="app_name">TestSwitchMaterial</string> <string name="sw">Switch:</string> <string name="sc">SwitchCompat:</string> <string name="sm">SwitchMaterial:</string> <string name="smc">SwitchMaterial:</string> <string name="enabled">enabled</string> <string name="disabled">disabled</string> </resources> |
res\drawable\thumb_selector.xml
1 2 3 4 5 6 |
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="false" android:color="#00f"/> <item android:state_checked="true" android:color="#f00" /> <item android:color="#00f" /> </selector> |
res\drawable\track_selector.xml
1 2 3 4 5 6 |
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="false" android:color="#88f"/> <item android:state_checked="true" android:color="#faa" /> <item android:color="#88f" /> </selector> |
res\values\themes\themes.xml
1 2 3 4 5 6 7 8 9 10 11 12 |
<resources xmlns:tools="http://schemas.android.com/tools"> <!-- Base application theme. --> <style name="Theme.TestSwitchMaterial" parent="Theme.MaterialComponents.DayNight.DarkActionBar"> ... </style> <style name="SwitchMaterialStyle" parent="Widget.MaterialComponents.CompoundButton.Switch"> <item name="useMaterialThemeColors">false</item> <item name="thumbTint">@drawable/thumb_selector</item> <item name="trackTint">@drawable/track_selector</item> </style> </resources> |
これで実行してみましょう
SwithとSwitchCompatに比べてSwitchMaterialのthumbの色が多少薄い感じがしますが
どうなんでしょう
References:
切り替えボタン | Android デベロッパー
SwitchCompat – Android Developers
SwitchMaterial – Android Developers