I have a textview, I set it as clickable and focusable - how do I get it to highlight to orange (like a button) when the user focuses it with the trackwheel etc?:
TextView tv = ...;
tv.setClickable(true);
tv.setFocusable(true);
Thanks
This is quite easy. Here is the solution.
You have an TextView element with its background attribute set to #drawable/tbselector like this.
<TextView android:text="My text"
android:id="#+id/tv01"
android:layout_width="300dip"
android:layout_height="150dip"
android:layout_gravity="center_horizontal"
android:background="#drawable/tbselector"/>
The last attribute android:background is essential the other stuff is up to you.
Now you create a tbselector.xml in your drawable subdirectory. Which looks like this.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/bgdefault"
android:state_focused="false"
android:state_selected="false"/>
<item
android:drawable="#drawable/bgselected"
android:state_focused="true"
android:state_selected="false"/>
</selector>
Now you create a bgdefault.xml in your drawable subdirectory which looks like this.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size
android:width="200dip"
android:height="150dip"
android:color="#00FF00"/>
<solid
android:color="#00FF00"/>
</shape>
Finally create a bgselected.xml in your drawable subdirectory which looks like the other one with other color values like this for example.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size
android:width="200dip"
android:height="150dip"
android:color="#FFFF00"/>
<solid
android:color="#FFFF00"/>
</shape>
And thats it you now have a state dependent TextView background. You can however decide to set your drawables in your selector XML it's totally up to you. My values are just random values to show you the difference.
Hope it helps.
I have no chance to try it at the moment, but what about adding a OnFocusChangeListener to your TextView and then use the setBackgroundColor(int color) method to change the background to orange
Related
I have this:
round_button.xml
<xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#dec60000"/>
<size android:width="150dp" android:height="150dp"/>
</shape>
</item>
<item android:state_pressed="false">
<shape android:shape="oval">
<solid android:color="#860000"/>
<size android:width="150dp" android:height="150dp"/>
</shape>
</item>
My Button:
<Button
android:id="#+id/incrementBTN"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/round_button"
android:onClick="onClick"
android:soundEffectsEnabled="true"
android:text="0"
android:textSize="50sp"
tools:ignore="HardcodedText" />
Dynamically, I want to change the background color (which is defined in the round_button xml) programmatically. Is there a way I can do this?
If you want to define certain states for your button, you could set them all in xml, without having to do it programmatically (if you do, you can indeed set a filter, but it can get messy if you have many states and conditions IMO).
I'll detail the steps here:
1) Creating a xml with the states you want
You can create a xml with a selector in your drawable folder with the defined states. As an example,
button_bkg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/bkg_is_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/bkg_is_disabled" android:state_enabled="false"/>
<item android:drawable="#drawable/bkg_default"/>
</selector>
Let's call this file button_bkg.xml. In the example above, I have listed 3 states: pressed, disabled and default, which means that, when the button is pressed, it will assume the bkg_is_pressed background and, when I set the button to disabled (either in xml or programmatically through setEnabled(boolean), it will assume bkg_is_disabled background.
2) Creating the backgrounds
Now you will define what you want the background to be in the xml files you defined (bkg_is_pressed, bkg_is_default, bkg_is_pressed). In your case, in example, you would take each shape defined in your round_button.xml file and separate them into each one of the xml files you defined for the states. In my case, I defined a layer-list:
bkg_is_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<corners android:radius="#dimen/button_corner_radius"/>
<solid android:color="#color/color_alert"/>
<stroke
android:width="#dimen/universal_1_pixel"
android:color="#color/color_gray_dark"/>
</shape>
</item>
<item>
<shape android:shape="rectangle">
<corners android:radius="#dimen/button_corner_radius"/>
<solid android:color="#color/color_mask_highlighted"/>
</shape>
</item>
</layer-list>
You will do that for each of the states.
It is important to note that, if you are going to build for API 21+, you can define a ripple effect by creating ANOTHER button_bkg.xml file in your drawables-v21 folder, which would be like this:
button_bkg.xml (in your drawable-v21 folder)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/bkg_is_disabled" android:state_enabled="false" />
<item android:drawable="#drawable/bkg_is_pressed" />
To use the ripple, you can define a color as explained below:
bkg_is_pressed.xml (in your drawable-v21 folder)
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/color_mask_highlighted">
<item android:drawable="#drawable/bkg_is_default" />
</ripple>
You only have to put the button_bkg.xml and the bkg_is_pressed.xml into your drawable-v21 folder file. In my case, bkg_is_default and bkg_is_disabled.xml were the same for both 21+ and 21- APIs, so I didn't add it to my drawable-v21 folder, I just created it in the drawable folder.
I want to emphasize that you STILL need the other files in your regular drawable folder so that devices with API 21- will work properly.
3) Assigning that background to your button
Lastly, you just have to define that background to your button:
<Button
...
android:background="#drawable/button_bkg
/>
So, there you have it. This way, you don't need to set the styles programmatically, you can just define all the backgrounds (according to your states) in the xml files.
But, if you also prefer to set them all programmatically, you can do the same, just use setBackground and use the xml files you defined and apply the state logic you want to it (if button is pressed, setBackground(bkg_is_pressed) and so on)
I hope that helps, let me know if that works for you.
I solved it by setting a ColorFilter:
Drawable mDrawable = context.getResources().getDrawable(R.drawable.balloons);
mDrawable.setColorFilter(new PorterDuffColorFilter(0xffff00,PorterDuff.Mode.MULTIPLY));
myButton.setResource(mDrawable);
You could construct the shapes from code, depending on the color you need to use, create a StateListDrawable from those and set it as your buttons background.
I want to make a weekly calendar, where every day is a custom checkbox with objective to look like the image bellow:
(http://i.imgur.com/WjIKCd0.png)
When the user clicks on a day (Monday in this case), the "background" and "button" checkbox changes as well the text color...
I made the drawables and it seems to work fine... check bellow the code:
Checkbox layout:
<CheckBox
android:id="#+id/selectMonday"
android:layout_width="40dp"
android:layout_height="40dp"
android:button="#drawable/ic_none"
style="#style/CheckBoxBackgroundView"
android:onClick="selectDay"
android:text="#string/monday_letter"
android:gravity="center"
android:checked="true"/>
(the drawable "ic_none", is simple a 135x135 "transparent" image with nothing in it...)
Style (CheckBoxBackgroundView):
<style name="CheckBoxBackgroundView">
<item name="android:background">#drawable/background_day_week_picker_box_selector</item>
<item name="android:textColor">#color/text_color_day_week_picker_box_selector</item>
<item name="android:textSize">#dimen/text_spinner_text</item>
<item name="android:textStyle">bold</item>
</style>
Background Selector (background_day_week_picker_box_selector):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false"
android:drawable="#drawable/background_day_of_week_picker_unselected" />
<item android:state_checked="true"
android:drawable="#drawable/background_day_of_week_picker_selected" />
</selector>
Background selected (background_day_of_week_picker_selected):
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- view background color -->
<solid
android:color="#color/red_color" >
</solid>
<!-- view border color and width -->
<stroke
android:width="3dp"
android:color="#color/transparent">
</stroke>
<!-- Here is the corner radius -->
<corners
android:radius="10dp" >
</corners>
</shape>
and finally the color selector (text_color_day_week_picker_box_selector):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false"
android:color="#color/red_color"></item>
<item android:state_checked="true"
android:color="#color/white"></item>
</selector>
I tried this in several devices... in some, it appears like it suppose to, in others the text disappears and it looks like this:
(http://i.imgur.com/Jy9FrPS.png)
probably is coincidence, but all the devices that worked are below 5 inches...
is there anything wrong with my code that I'm not seeing? anyone have any suggestions?
Thanks in advance
The problem is that the 135x135 button drawable is pushing the text out of the bounds of your CheckBox's width. Instead of using a drawable, you can just set android:button="#color/transparent".
In my application, I have to create a list view and each item/row should have same background.
I have referred this http://www.javacodegeeks.com/2013/06/android-listview-background-row-style-rounded-corner-alternate-color.html and this http://androidexample.com/Create_A_Simple_Listview_-_Android_Example/index.php?view=article_discription&aid=65&aaid=90
tutorial.
In this they have created an array having different Images and setting them as a row background.
but I have to set only one Image as a row or listitem background..
So is there any way to achieve this?
go to "row" or the "list item" xml file in layout folder and set attribute to parent view android:background="#drawable/yourBackgroudImage"
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/yourBackgroudImage"
android:orientation="horizontal" >
change the layout background color in
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
v = inflater.inflate(R.layout.row_layout, null);
v.setBackgroundResource(R.drawable.rounded_corner); // change your layout background in your adapter.
You need to first create the following file in the drawable folder as follows:
list_selecter.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected="false"
android:state_pressed="false"
android:drawable="#drawable/gradient_bg" />
<item android:state_pressed="true"
android:drawable="#drawable/gradient_bg_hover" />
<item android:state_selected="true"
android:state_pressed="false"
android:drawable="#drawable/gradient_bg_hover" />
</selector>
If you would like the background color to change, you need to add these two files too. Please note the hex values in the startColor, centerColor and endColor nodes. The hex value there can be changed to any value you feel appropriate for your application:
gradient_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#f1f1f2"
android:centerColor="#e7e7e8"
android:endColor="#cfcfcf"
android:angle="270" />
</shape>
gradient_bg_hover.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- Gradient BgColor for listrow Selected -->
<gradient
android:startColor="#A6A6A6"
android:centerColor="#757575"
android:endColor="#4A4A4A"
android:angle="270" />
</shape>
Then in the actual xml file in the layout folder, you need to add the following line to the LinearLayout:
android:background="#drawable/list_selector"
This question already has an answer here:
How to add border to listview and different row colors at the same time
(1 answer)
Closed 8 years ago.
I have a scrollable listview. I need to highlight the top and bottom border of the row like this .As am a newbie tell me how to do this. Thanks in advance
android:listSelector="#drawable/list_selectorcolor"
In drawable create like this
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<gradient
android:angle="90"
android:endColor="#000000"
android:startColor="#000000"
android:type="linear"/>
<stroke
android:width="1dp"
android:color="#800080"
android:dashWidth="2dp"/>
</shape>
Create a selector file like this for different states of list view under drawable folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/app_tint_pressed"
android:state_selected="true"/>
<item android:drawable="#color/app_tint_pressed"
android:state_pressed="true" />
<item android:drawable="#color/app_tint" />
</selector>
Apply this file like this under ListView in xml
android:listSelector = #drawable/myselector
For different states check state list on this link http://developer.android.com/guide/topics/resources/drawable-resource.html
you can use nine-patch images and color as well for different states in your case the normal state is black color and for pressed state either create a nine-patch image with black and borders you want or you can create it in xml as well
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#android:color/white"/>
<stroke
android:width="2dp"
android:color="#800080"
android:dashWidth="2dp"/>
Just add following detail in the listview in xml file
android:divider="#FF3366"
android:dividerHeight="3dp"
Try this according to your code
viewHolder.imageview.setText(entry.getString("calculator"));
if(position % 2 == 0){
viewHolder.linearLayout.setBackgroundResource(R.color.grey);
}
else{
//viewHolder.linearLayout.setBackgroundResource(R.color.white);
}
It will change the color of row
set the view's background to a xml file. in resource drawable we can use xml files. check the Api demos drawable folder. that xml file contains this code.
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"
android:drawable="#drawable/button_image_in_normal_state" />
<item android:state_pressed="true"
android:drawable="#drawable/button_image_in_pressed_state_with_border" />
</selector>
and assign this xml filename in view's background.
also refer this link
Does any one knows how can i skin an android button to look like this:
a busy cat http://www.11sheep.com/temp/picForSO.jpg
Thanks in advance,
Lior
The following layout files will product a button with 5px radius, of course u input your own color and change the solid color to gradient to match ur screenshots, then on the button change the text colour to white or something.. I dont have time for examples now.. good luck though.
and lastly you have to apply them as background to your button like this
<Button
android:id="#+id/btnLoveThisOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="Love me love u too!"
android:background="#drawable/button_background" <!-- Yes look at me -->
/>
button_background_normal.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/button_background_normal_color"/> <!-- Change this to your own colour -->
<corners android:radius="5px"/>
<stroke android:width="1dp" android:color="#20ffffff"/>
</shape>
button_background_pressed.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/button_background_pressed_color"/> <!-- Change this to your own colour -->
<corners android:radius="5px"/>
</shape>
button_background.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:state_pressed="false"
android:drawable="#drawable/button_background_normal" />
<item android:state_focused="true"
android:state_pressed="true"
android:drawable="#drawable/button_background_pressed" />
<item android:state_focused="false"
android:state_pressed="true"
android:drawable="#drawable/button_background_pressed" />
<item android:drawable="#drawable/button_background_normal" />
</selector>
I know two ways to make it:
a Button or TextView with an image having that engraving rectangle, for stretch, use 9.patch :)
a Button or TextView with transparent background and a selector drawing the shape border
However, I don't know exactly how they did as shown in your picture.