web-dev-qa-db-ja.com

Androidトグルボタンのカスタムルック

トグルボタンの外観をカスタマイズしようとしましたが、成功しませんでした。これが私がどのように見えるようにするかです：

enter image description here

誰か私にチュートリアルを教えてもらえますか？

androidstylescustomizationtogglebutton
45
Mihai Bratulescu

res/drawableにtoggle_selector.xmlを作成します

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
  <item Android:drawable="@drawable/toggle_on" Android:state_checked="true"/>
  <item Android:drawable="@drawable/toggle_off" Android:state_checked="false"/>
</selector>

セレクタをトグルボタンに適用する

<ToggleButton
            Android:id="@+id/chkState"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:background="@drawable/toggle_selector"
            Android:textOff=""
            Android:textOn=""/>

注：上記のコードで使用したテキストを削除するには

textOff=""
textOn=""
103
Melbourne Lopes

これが最善の解決策であるかどうかはわかりませんが、うまくいきました：

1 .-トグルボタンの大きさを決定します。私の場合、幅56dpおよび高さ76dpです。

2 .-アイコンセット56px-76pxをmdpi、84px-113px hdpiに作成、xhdpiおよびxxhdpiにも同じ

.-対応する描画可能フォルダー内のアイコンを移動します。私の場合、各フォルダーに20個のアイコン5、ic_name1_on、ic_name1_off [...] ic_name5_offという名前が付けられています

4 .- drawableという名前の新しいフォルダーに次のxmlファイルを作成します（まだ存在しない場合）。

  • ic_name1_toggle.xml
  • ic_name1_toggle_bg.xml
  • ic_name2_toggle.xml
  • （...）
  • ic_name5_toggle_bg.xml

5 .- ic_name1_toggle.xmlのコードは次のとおりである必要があります。

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item
        Android:state_checked="false"
        Android:drawable="@drawable/ic_name1_off" />
    <item
        Android:state_checked="true"
        Android:drawable="@drawable/ic_name1_on" />
</selector>

6 .- ic_name1_toggle_bg.xmlのコードは次のとおりである必要があります。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
   <item Android:id="@+Android:id/background"
         Android:drawable="@Android:color/transparent" />
   <item Android:id="@+Android:id/toggle"
         Android:drawable="@drawable/ic_name1_toggle" />
</layer-list>

7 .-最後にlayout.xmlで：

<ToggleButton
                Android:id="@+id/toggleButton1"
                Android:layout_width="56dp"
                Android:layout_height="76dp"
                Android:background="@Android:color/transparent"
                Android:button="@drawable/ic_name1_toggle_bg"
                Android:textOff=""
                Android:textOn="" />
7
Iridio

ボタンのカスタム背景を定義する必要があると思います。 ボタンの背景 のカスタマイズに関する開発者ガイドをご覧ください。

ただし、ステップ3では、res/drawable/ directoryに新しいXMLファイルを作成します。このXMLを使用します。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@drawable/button_da"
          Android:state_checked="true" />
    <item Android:drawable="@drawable/button_nu" />
</selector>

要素Android:state_checked="true"は、その状態をチェックされた背景として定義するものです。

これがあなたのために働くかどうか私に知らせてください。

1
Nicholas Marshall

セレクターを作成

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@drawable/btn_da" Android:state_checked="true"/>
    <item Android:drawable="@drawable/btn_nu"/>
</selector>

toggleButtonの背景として使用します。

0
danik