How to change color of Seekbar, Checkbox, and Switch in Sketchware?
1 minute read
The color of various widgets can be changed programmatically with simple codes. Provided below are a few codes which can be used in Sketchware to change the color of Seekbar, Checkbox and Switch.
Codes for Seekbar
To change color of Seekbar progress and Seekbar thumb use the codes provided below in add source directly block in onCreate event.
seekbar1.getProgressDrawable().setColorFilter(Color.parseColor("#FF00FF"), PorterDuff.Mode.SRC_IN);
seekbar1.getThumb().setColorFilter(Color.parseColor("#FF00FF"), PorterDuff.Mode.SRC_IN);
Note that in the code above seekbar1 is the name or id of the Seekbar inserted in VIEW area.
The Seekbar thumb can be made invisible by using 00 for AA in code #AARRGGBB in color code. So code for no thumb may look like:
seekbar1.getThumb().setColorFilter(Color.parseColor("#00FF00FF"), PorterDuff.Mode.SRC_IN);
We can also use an image as Seekbar progress and Seekbar thumb, by using following code:
seekbar1.setProgressDrawable(getResources().getDrawable(R.drawable.submit));
seekbar1.setThumb(getResources().getDrawable(R.drawable.i_black));
Note that in this code 'submit' and 'i_black' are name of images being used. The images have to be added using image manager, before using this code.
Codes for Checkbox
To change color of Checkbox button use the codes provided below in add source directly block in onCreate event.
checkbox1.getButtonDrawable().setColorFilter(Color.parseColor("#FF00FF"), PorterDuff.Mode.SRC_IN);
Note that here checkbox1 is id of the Checkbox widget inserted in VIEW area (xml).
Codes for Switch
To change color of Switch use the codes provided below in add source directly block in onCreate event.
switch1.getTrackDrawable().setColorFilter(Color.parseColor("#FF00FF"), PorterDuff.Mode.SRC_IN);
switch1.getThumbDrawable().setColorFilter(Color.parseColor("#FF00FF"), PorterDuff.Mode.SRC_IN);
For using a custom image as track or thumb of switch, add the image using image manager in your Sketchware project, then use following code in onCreate.
switch1.setTrackResource(R.drawable.image_name);
switch1.setThumbResource(R.drawable.image_name);
Note that here switch1 is id of the Switch widget inserted in VIEW area (xml).