Shawn
Reputation: 1372
Change on Color of toggle button
Is there a way to programmatically change the Toggle on color of a toggle button, not the background color.
I don't see a reference to it in the documentation.
Upvotes: 0
Views: 2951
Answers (4)
user12872232
Reputation: 1
[Change the color of toggle button][1]
<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New ToggleButton"
android:id="@+id/toggleButton"
android:textColor="#f26e08"
android:textSize="30dp"
android:padding="20dp"
android:background="@drawable/selector"
android:layout_gravity="center_horizontal" />
<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New ToggleButton"
android:id="@+id/toggleButton2"
android:textColor="#f26e08"
android:background="@drawable/selector"
android:textSize="30dp"
android:padding="20dp"
android:layout_gravity="center_horizontal" />
selector.xml:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="@drawable/toggleon"
android:state_checked="true"/>
<item
android:drawable="@drawable/toggleoff"
android:state_checked="false"/>
</selector>
toggleon.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<stroke android:color="#0a8e9b"
android:width="6dp"/>
</shape>
</item>
<item android:bottom="6dp">
<shape android:shape="rectangle">
<solid
android:color="#b5f4f2"/>
</shape>
</item>
</layer-list>
toggleoff.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<stroke android:color="#f26e08"
android:width="6dp"/>
</shape>
</item>
<item android:bottom="6dp">
<shape android:shape="rectangle">
<solid android:color="#56fd58"/>
</shape>
</item>
</layer-list>````
[1]: https://i.sstatic.net/R2oOV.png
Upvotes: 0
Shawn
Reputation: 1372
What about changing style?
styles.xml
<style name="ToggleButton" parent="Base.Widget.AppCompat.Button">
<item name="colorAccent">select your color</item>
<style>
Now set the style on the Toggle button in the layout.
<ToggleButton
android:id="@+id/toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:theme="@style/ToggleButton"/>
Upvotes: 1
Ankit Jain
Reputation: 30
<ToggleButton
android:background="@drawable/toggle_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
use the below drawable in the above toggle button
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Drop Shadow Stack -->
<item>
<selector>
<item android:state_pressed="true">
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="#00CCCCCC" />
</shape>
</item>
</selector>
</item>
<item>
<selector>
<item android:state_pressed="true">
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="#10CCCCCC" />
</shape>
</item>
</selector>
</item>
<item>
<selector>
<item android:state_pressed="true">
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="#20CCCCCC" />
</shape>
</item>
</selector>
</item>
<item>
<selector>
<item android:state_pressed="true">
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="#30CCCCCC" />
</shape>
</item>
</selector>
</item>
<item>
<selector>
<item android:state_pressed="true">
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<corners android:radius="3dp" />
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
<solid android:color="#50CCCCCC" />
</shape>
</item>
</selector>
</item>
<item>
<selector>
<item android:state_checked="false">
<shape>
<corners android:radius="3dp" />
<padding android:bottom="5dp" />
<solid android:color="@android:color/black" />
</shape>
</item>
<item android:state_checked="true">
<shape>
<corners android:radius="3dp" />
<padding android:bottom="5dp" />
<solid android:color="@android:color/white" />
</shape>
</item>
</selector>
</item>
<!-- Background -->
<item android:id="@+id/toggle_background">
<shape>
<corners
android:topLeftRadius="3dp"
android:topRightRadius="3dp" />
<padding android:bottom="5dp" />
<solid android:color="@android:color/holo_orange_dark" />
</shape>
</item>
</layer-list>
Upvotes: -1
Parth Pitroda
Reputation: 997
ToggleButton Btn=new ToggleButton(this);// or get it from the layout by ToggleButton Btn=(ToggleButton) findViewById(R.id.IDofButton);
Btn.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
// TODO Auto-generated method stub
if(isChecked)
buttonView.setBackgroundColor(Color.GREEN);
else buttonView.setBackgroundColor(Color.RED);
}
});
In drawable folder, create a xml file my_btn_toggle.xml:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:drawable="@color/red" />
<item android:state_checked="true" android:drawable="@color/green" />
</selector>
and in xml section define your toggle button:
<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New ToggleButton"
android:id="@+id/toggleButton"
android:background="@drawable/my_btn_toggle"/>
last but not least :)
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/bg_selected" android:state_checked="true" android:state_pressed="true"/>
<item android:drawable="@drawable/bg_selected" android:state_checked="true" android:state_focused="false"/>
<item android:drawable="@drawable/bg_normal" android:state_checked="false" android:state_pressed="true"/>
<item android:drawable="@drawable/bg_normal" android:state_checked="false" android:state_focused="false"/>
Upvotes: 1
Related Questions
- Change "on" color of a Switch
- Toggle button to change the background color of the layout of the android app
- change color of my ToggleButton when clicked
- How to change ToggleButton color using android:color?
- how to change the toggle button color without a code behind
- How to change the background color of the toggle button on Android
- Change toggleButton color
- Android Toggle Button - Background Color
- Change color of button on toggle
- Android: toggle text color of ToggleButton