Emulate highlight on view click - android

I have ImageView with some icon. Icon, for example, have size: 32 x 32 dip. ImageView have background:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:drawable="#drawable/simple_button_focused_holo" />
<item android:state_pressed="true"
android:drawable="#drawable/simple_button_pressed_holo" />
<item android:drawable="#android:color/transparent" />
</selector>
Then user click on icon, we can see some hightlight on click. All ok: work on 4 and 2 android version. But size 32 is so little for clicking. Therefore, I add hidden view and add onClick for this hidden view. This view have ~ 50dip and user can easy click on icon. But in this case, user don't see highlight on click. I cann't increase size source icon, because parent view have fix size and near icon also exists other views: textviews, progressbar (which not need response on click).

Can you change the background color of the view when it receives a click? Use some transparent color so the user can still see the Button. Then you can setup a Thread to sleep for some certain amount of time, and then use runOnUiThread() and pass a Runnable that will set the background back to transparent?

Related

State selector for a custom button layout (i.e. LinearLayout)

I'm wondering if it's possible to build a custom button layout with different appearance depending on state so it acts like a button. For example, a LinearLayout with an ImageView and TextView, with these states.
When the button is in normal state, display image_normal.png and text in red.
When the button is pressed, display image_pressed.png, background red and text in white.
When the button is disabled, display image_disabled.png and text in grey.
Thank you!
Any view can have any background and any view can be made clickable, so there is nothing preventing you from having a LinearLayout with the background you described. It's worth noting that you don't need a LinearLayout to have an image next to text, you can use the fact that TextView supports drawables on any side of the text using the drawable[Left|Top|Right|Bottom] attributes.
If your question is about the syntax of a selector drawable, I would refer you to the documentation. Note that Android evaluates states top to bottom, so choose the order wisely. The last item should be the "default" state when none of the ones above apply. For the example you gave, you would probably have something like
<selector>
<item android:state_pressed="true" android:drawable="..." />
<item android:state_enabled="true" android:drawable="..." />
<item android:drawable="..." /> <!-- disabled -->
</selector>

GridView item selector checked state not appearing

I have a GridView with a bunch of items that are being populated using a custom adapter. The grid view is set to CHOICE_MODE_MULTIPLE_MODAL in java, and I'm able to select things using the contextual action bar (all of this works fine).
I want the grid items to highlight when pressed and have a different highlight when selected (exactly the behavior you'll see in the Gallery app in ICS).
I have a selector which is being specified in the grid view XML like so: listSelector="#drawable/grid_item_selector". I have also specified android:drawSelectorOnTop="true". Here is the selector XML:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/grid_item_selected" android:state_activated="true"/>
<item android:drawable="#drawable/grid_item_selected" android:state_checked="true"/>
<item android:drawable="#drawable/grid_item_selected" android:state_selected="true"/>
<item android:drawable="#drawable/grid_item_pressed" android:state_pressed="true"/>
<item android:drawable="#android:color/transparent"/>
</selector>
The pressed state works perfectly. However, the checked/selected states never appear.
Even if I set an item to be checked in my java code, the checked state never appears.
I can't set the selector as the background of the grid items themselves because I need the selected state drawable to be the foreground, not the background.
The selector only shows on the thing that you're touching. Once you take your finger off it no longer displays.
So, what I've ended up doing is having a View at the bottom of the layout (so it appears on top) with a background set to a selector.
The selector only has anything for state_selected.
The OS handles the rest.
Not exactly the nicest, but it works...

Android Custom Image Button Does Not Stay Selected

I am currently using an ImageButton, and I want to have the effect like radio button once you select it stays selected, until someone picks another image button. I have setup custom selector like below:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/buttonimagesel" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/buttonimagesel" /> <!-- focused -->
<item android:drawable="#drawable/buttonimage" /> <!-- default -->
</selector>
But this just shows the selected image for as long as the key is pressed down. The effect i want is for it to stay selected like a radio button until the request is processed after which the whole activity including the button is redrawn. So I want one click to put the button in a selected state and unclick does not change this. Also I do not want the other buttons to be selectable after this happens, and I don't certainly don't want them to change images or anything like that.
Thanks
If you need to use an ImageButton, you can add an android:state_selected="true" item and use setSelected() in your onClick() logic. You would have to take care of deselecting all the other buttons when selecting a new one. This question might be useful: Android ImageButton with a selected state?
However you could also just use RadioButtons and customize their look (with android:background and android:button - these and all CompoundButtons have a checked state that work in a toggling way).

How to vertically align text in a button with a background drawable?

I had a simple button set up with a background image defined like
android:background="?attr/button"
where ?attr/button was a reference to a simple 9-patch png. Everything worked fine, text in the button was aligned correctly.
Then I needed to have a different background for a pressed state of the button. So I changed that to
android:background="#drawable/state_button"
where #drawable/state_button is an xml with the following states
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_pressed" /> <!-- focused -->
<item android:drawable="#drawable/button" /> <!-- default -->
</selector>
And after that I can't align the text properly. If I put android:gravity="center_vertical" the text is drawn about 1/4 of the button height from the top.
I double-checked my 9-patch images, everything seems fine with them. And I also tried having regular pngs for the background, it also doesn't change anything.
You should double check the 9 patch drawables you're using. The standard Android buttons include a huge amount of padding at the top and bottom of the buttons, making it look like the text is always centered. You can see this by opening up the 9 patch file, zooming in closely and looking at the difference between the pixels on the left/top and the right/bottom. The left/top sides mark which parts of the image can be stretched to accomodate more text, while the right/bottom sides mark the space that will actually be filled with text. So the difference between the right/bottom side and the left/top will be the padding. It doesn't quite make sense at first, but after playing around with it it's not so bad.
Just in case you aren't familiar with it, a useful tool for editing 9patches is the draw9patch.bat program in your SDK tools folder.
I had the exact same issue however my 9 patch drawables were ok. The cause was still the same though, just i was using custom drawables using the layer-list element.
It seems that when the Button lays out its text it takes into account all of the states in your selector. Once i'd updated all of the states to match each other my text subsequently aligned correctly.

Button draws normal state after pressing

I'm new to Android and just starting the very basics. I implement my custom button skin using .9.png images for norma/focus/pressed states. It works fine, but I noticed that after a pressed the focussed button it visually "lost" focus and draws the normal state frame. I planned to use different state images to highloght what button is selected right now, but it seems that it would not work. I noticed also that the same happens with the default LAF button. Is it OK, or it's just emulator issue? What the good workaroud can be used?
Thanks
I think the following may help. I wanted to have one of the buttons in a list of button to be coloured differently, to highlight the fact you were already in that section.
My buttons android:background field was set to the following drawable (drawable/my_btn.xml)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/btn_pressed" />
<item android:state_focused="true" android:drawable="#drawable/btn_focused" />
<item android:state_selected="true" android:drawable="#drawable/btn_selected" />
<item android:drawable="#color/transparent" />
</selector>
You'll noticed i've got an item with the android:state_selected="true" attribute set.
Then in code you can have
Button mybtn = (Button)findViewById(R.id.my_btn_1);
mybtn.setOnClickListener(new OnClickListener(){
public void onClick(View v) {
Button btn = (Button)findViewById(R.id.nav_secondary_1);
btn.setSelected(true);
}
});
I'm not sure if you can set the selected stat of a Button through a property in the xml. Not sure you would want to.
The order of the item's are also important as it can change the visibility of the other states. The current order will allow you to see the pressed and focused states. however, if you moved the selected item to the top you would find that your pressed and focused states would not be displayed.
I am not sure if you can combine the pressed, focused and selected states to allow for more customised graphics. I haven't tried it but the following would allow for more complicated state based graphical layouts.
<item android:state_selected="true" android:state_focused="true" android:drawable="#drawable/btn_selected_focused" />
Read up on Selectors here http://developer.android.com/guide/topics/resources/drawable-resource.html
This is the default behavior in touch mode, and you should not seek to tamper with it. This is how your users will expect for your app to behave. If you set the focus without touching the screen, such as when using the trackball that's available on most devices, it will indeed remain in focus, but in touch mode there's no visual representation for the state of having focus.

Categories

Resources