Android: создание кнопки переключения с изображением и без текста

можно ли создать кнопку переключения в Android, которая имеет изображение, но без текста?
В идеале это будет выглядеть так:



Toggle Button With Image



Я видел подобные сообщения, где ответ должен был изменить фон, но я хочу сохранить макет Holo Light и просто поменять текст с изображением.



Мне нужно иметь возможность программно изменять Источник изображения,



есть идеи, как бы я это сделал?



Если это не может быть сделано, это есть способ, которым я могу сделать обычную кнопку включения и выключения?

593   4  

4 ответов:

  1. могу ли я заменить текст переключения на изображение

    нет, мы не можем, хотя мы можем скрыть текст, переопределив стиль по умолчанию кнопки переключения, но все же это не даст нам кнопку переключения, которую вы хотите, поскольку мы не можем заменить текст изображением.

  2. как я могу сделать обычную кнопку переключения

    создайте файл ic_toggle в своем 

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_checked="false"
          android:drawable="@drawable/ic_slide_switch_off" />

    <item android:state_checked="true"
          android:drawable="@drawable/ic_slide_switch_on" />

</selector>

    здесь @drawable/ic_slide_switch_on & @drawable/ic_slide_switch_off образы, которые вы создаете.

    затем создайте другой файл в той же папке, назовите его ic_toggle_bg

    <?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_toggle" />

</layer-list>

    теперь добавьте в свою пользовательскую тему, (если у вас нет одного создать стили.xml-файл в вашем )

    <style name="Widget.Button.Toggle" parent="android:Widget">
   <item name="android:background">@drawable/ic_toggle_bg</item>
   <item name="android:disabledAlpha">?android:attr/disabledAlpha</item>
</style>

<style name="toggleButton"  parent="@android:Theme.Black">
   <item name="android:buttonStyleToggle">@style/Widget.Button.Toggle</item>
   <item name="android:textOn"></item>
   <item name="android:textOff"></item>
</style>

    это создает пользовательскую кнопку переключения для вас.

  3. как использовать

    использовать пользовательские стиль и фон в вашем представлении.

      <ToggleButton
        android:id="@+id/toggleButton"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        style="@style/toggleButton"
        android:background="@drawable/ic_toggle_bg"/>
98  
2016-06-24 18:06:37

ToggleButton наследует от TextView таким образом, вы можете установить чертежи, которые будут отображаться на 4 границах текста. Вы можете использовать это, чтобы отобразить значок, который вы хотите на верхней части текста и Скрыть текст

<ToggleButton
    android:id="@+id/toggleButton1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawableTop="@android:drawable/ic_menu_info_details"
    android:gravity="center"
    android:textOff=""
    android:textOn=""
    android:textSize="0dp" />

результат по сравнению с обычными ToggleButton выглядит так:

enter image description here

опция секунд заключается в использовании ImageSpan фактически заменить текст на изображение. Выглядит немного лучше, так как значок находится в правильном положении, но не может быть сделано с макетом xml напрямую.

вы создаете простой ToggleButton

<ToggleButton
    android:id="@+id/toggleButton3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="false" />

затем установите" текст " программно

ToggleButton button = (ToggleButton) findViewById(R.id.toggleButton3);
ImageSpan imageSpan = new ImageSpan(this, android.R.drawable.ic_menu_info_details);
SpannableString content = new SpannableString("X");
content.setSpan(imageSpan, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
button.setText(content);
button.setTextOn(content);
button.setTextOff(content);

результат здесь в середине-значок помещается немного ниже, так как он занимает место текста.

enter image description here

57  
2013-09-03 22:11:34

создать toggle_selector.xml в res / drawable

<?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=""
47  
2013-11-30 15:26:39

Я знаю, что это немного поздно, однако для тех, кто заинтересован, я создал пользовательский компонент, который в основном является кнопкой переключения изображения, рисование может иметь состояния, а также фон

https://gist.github.com/akshaydashrath/9662072

10  
2014-04-15 20:32:00

Comments

    Ничего не найдено.
Click here to cancel reply.