Yellow background on back of image On click - android

I am using GridView to show the gallery images. But when i click on any image, yellow color on back of image is coming. How can i remove it?
Here is the code i am using
<GridView
android:id="#+id/party_gallery_gridview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:horizontalSpacing="#dimen/party_detail_layout_margin"
android:listSelector="#null"
android:numColumns="3"
android:scrollbars="none"
android:verticalSpacing="#dimen/party_detail_layout_margin"
android:visibility="gone" >
</GridView>
You can see the yellow background in the below image

You can a new XML bg_pressed.xml in drawable directory.
And it must contain <selector> tag
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#000" />
</shape>
</selector>
and than
you can in Grid Cell
android:background="#drawable/bg_pressed.xml"
I hope ıt helps :)

Add this line to gridview
android:listSelector="#00000000"

Try to make gridview background trasnparent, like this way :
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridView"
android:numColumns="2"
android:gravity="center"
android:background="#ffffffff"
android:columnWidth="100dp"
android:stretchMode="columnWidth"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>

Find your item view layout file and change its background to a corresponding background drawable.
Here is an example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="#dimen/bb_drawerlayout_menu_item_height"
android:background="#drawable/appkit_drawerlayout_menu_item_bg"
android:clickable="true"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingEnd="12dp"
android:paddingStart="0dp"
tools:background="#color/black"
tools:layout_width="240dp">
The content of appkit_drawerlayout_menu_item_bg is as below:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/bbkit_black" android:state_pressed="true"/>
<item android:drawable="#color/bbkit_black" android:state_activated="true"/>
<item android:drawable="#color/transparent" android:state_pressed="false"/>
<item android:drawable="#color/transparent"/>
</selector>
Hope this makes sense to you.

Related

Android: how to use selector?

I have a problem of using selector that it does not work as what I expect. I wanna click on it then it gives me reaction and I select it(By long click but I probably do it through programmatic way) then it gives me another reaction. However, it reacts nothing in result....
reaction part:
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="10"
android:padding="5dp"
android:background="#drawable/border_bottom"
>
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/grey"
android:text="#string/tel"/>
<TextView
android:id="#+id/telText"
android:layout_width="wrap_content"
android:textSize="18sp"
android:layout_height="wrap_content"
android:text="#string/blank"/>
</LinearLayout>
<ImageButton
android:layout_weight="1"
android:id="#+id/tel_call"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/ic_action_call"
android:background="#drawable/border_left"/>
</TableRow>
selector_row.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="#color/semitransparent_grey"></item>
<item
android:state_selected="true"
android:drawable="#color/semitransparent_blue"></item>
<item
android:drawable="#color/transparent"></item>
</selector>
Thank you to all brothers trying hard to answer me. I have got the answer....just simply by setting android:clickable="true" at LinearLayout. Ha, it's silly.....
I remember dude who provide relating information but I ignored... sorry to him.
Create an XML file and place it in the drawable folder. Open it and write the following code:
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_pressed="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_selected="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_focused="true"/>
</selector>
Then in your main XML file, place android:background="#drawable/selector.xml"
What are you expecting? A reaction only when it's clicked?
Try removing removing:
android:state_selected="true"
Edit:
This should be your selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/my_drawable" android:state_selected="true"></item>
<item android:drawable="#drawable/my_drawable" android:state_pressed="true"></item>
<item android:drawable="#drawable/my_drawable"></item>
</selector>
What is the behaviour that you are experiencing?
Edit:
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row"
android:duplicateParentState=true>
I don't know if it actually solves the problem

Button resizes on > 2.3.6

This is what is happening:
This is the source image:
This is part of the xml layout:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_headers"
android:orientation="horizontal" >
<AutoCompleteTextView
android:id="#+id/etNewItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:completionThreshold="2"
android:dropDownHeight="wrap_content"
android:dropDownWidth="wrap_content"
android:hint="#string/et_newitemhint"
android:inputType="text|textCapSentences"
android:layout_centerVertical="true"
style="#style/DialogEditText"
android:layout_marginRight="10dp"
android:singleLine="true" />
<Button
android:id="#+id/btnAddNew"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/btn_add"
android:layout_centerVertical="true" />
</RelativeLayout>
This is the Selector xml for the button:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_focused="true"
android:drawable="#drawable/btn_add_pressed"/>
<item android:state_pressed="true"
android:drawable="#drawable/btn_add_pressed"/>
<item android:drawable="#drawable/btn_add_normal"/>
</selector>
Why is this button horizontally resizing in 4.x.x? The source graphic did use to be a 9-patch, but it did exactly the same thing, so I changed it to a normal png, with no result.
The odd thing is is that this is the only graphic which exhibits this behaviour. I have it in an actionbar somewhere: same thing; I have it in a dialog too: same thing.
My 2.2.2 and 2.3.6 test devices show the button as it should be, but any of my test devices of 4.x.x show the elongated button.
First, make these:
res/drawable/button_add_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/btn_add_normal"
android:tileMode="disabled"
android:gravity="top" >
</bitmap>
res/drawable/button_add_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/btn_add_pressed"
android:tileMode="disabled"
android:gravity="top" >
</bitmap>
Then use this as selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_focused="true"
android:drawable="#drawable/button_add_pressed"/>
<item android:state_pressed="true"
android:drawable="#drawable/button_add_pressed"/>
<item android:drawable="#drawable/button_add_normal"/>
</selector>
I didn't manage to reproduce this on my devices. However, I still have a solution: you can use exact sizes like this:
android:layout_width="50dp"
android:layout_height="50dp"
This way the image should look the same on every device.

making imagebutton changed when presses

i want to make image button, so when it pressed i will replase the not-pressed image to pressed image of the button, and then go to other activity. i have two different images in drawable.
i have two xml files:
first one- load the main activity: background and image button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/b1_l" />
</RelativeLayout>
second one:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"
android:drawable="#drawable/image_not_pressed" />
<item android:state_pressed="true"
android:drawable="#drawable/image_pressed"" />
</selector>
what is the code that i need to write in addition to my xml?
or can i pass the xml and write it only as code...?
thanks!
you need to usually have drawable for pressed and default(unpressed) state. You can have the xml file like this(below) for that. You need to put this xml file in the drawable folder and then use as src for ImageButton or background source in case of Button.
Lets name it is mybutton.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="true"
android:drawable="#drawable/your image name" />
<item android:state_focused="false" android:state_pressed="true"
android:drawable="#drawable/your image name" />
<item android:drawable="#drawable/your image name" />
</selector>
You layout file for main activity:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/mybutton" />
</RelativeLayout>
You migth want do check out android developer guide on this
http://developer.android.com/guide/topics/ui/controls/button.html

ListView item ListSelector drawable flickering

I have a custom drawable for my listSelection. When I select one Item it gets selected. But on selected when I scroll through the other items (scrolling up/down) the backgroung is flickering and sometimes it is also getting disappeared.
I am including my xml layouts:
ListView:
<ListView
android:id="#id/listView"
android:layout_width="100dp"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:listSelector="#drawable/list_selector"
android:clickable="true"
android:divider="#drawable/separetor_drawable"
android:fastScrollEnabled="true"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:scrollbars="none" >
</ListView>
drawable layout: list_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners android:radius="6dp" />
<solid android:color="#color/grey" />
<size android:width="50dp" />
</shape>
Also I even I specify shape width the shape automatically fill_parent and that goes for height as well.
Any suggestions?
//try in your listview attribute as
android:cacheColorHint = "#00000000"
or
android:cacheColorHint="#android:color/transparent"
at java code, you should use
listView.setCacheColorHint(Color.TRANSPARENT);
Try this in your listview:
android:listSelector="#android:color/transparent"
android:cacheColorHint="#00000000"
android:focusable="false"
android:focusableInTouchMode="false"
Don't know if you got your answer, but we had a similar problem at one point. We fixed it by setting a background on the outer element in our listitem's layout file:
listitem.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#drawable/listselector"
...>
....
</RelativeLayout>
and then the drawable.. listselector.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="#color/blue" />
<item android:state_selected="true" android:state_pressed="false" android:drawable="#color/yellow" />
<item android:state_selected="false" android:state_pressed="false" android:drawable="#color/black" />
</selector>
The background xml file sets values for pressed, selected, and normal states and you can change the colors to other drawable's if you wish. Seemed to fix the weird background flicker problem we were having.

Selector for custom list view "Change ListView background - strange behaviour"

I am using this tutorials and I want to add selectors for this list view. I tried some codes but it doest work. How can I do it.
I used code as list_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:drawable="#drawable/list_selector_background_focus" />
<item android:state_pressed="true"
android:drawable="#drawable/list_selector_background_pressed" />
</selector>
and my List view
<ListView
android:id="#+id/select_names_tags_lv"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:listSelector="#drawable/list_selector"
android:layout_alignParentTop="false"
android:layout_gravity="center_vertical">
</ListView>
Just change a word here from listSelector to background. Because you want it as the background drawable selector, right?
<ListView
android:id="#+id/select_names_tags_lv"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/list_selector"
android:layout_alignParentTop="false"
android:layout_gravity="center_vertical">
</ListView>
EDIT:
try changing your selector file to (I changed the order of the two items):
<?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/list_selector_background_pressed" />
<item android:state_focused="true"
android:drawable="#drawable/list_selector_background_focus" />
</selector>

Categories

Resources