I am inflating a layout multiple time as per records.so i want when the user select any particular row.It gets highlighted and after that it comes in normal state as it was before.How can we do this.
Layout that i am inflating multiple times
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainResultLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/request_date"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:singleLine="true"
android:text="25 Sep 2013" />
<TextView
android:id="#+id/trip_date"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:singleLine="true"
android:text="25 Sep 2013" />
<TextView
android:id="#+id/trip_id"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:singleLine="true"
android:text="XXXXXXXXXX" />
<ImageView
android:id="#+id/approval_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:src="#drawable/pending"/>
</LinearLayout>
</LinearLayout>
Please help me how we can do this .Will be thankful to u ..
To highlight a Layout use Selector. Selector can be used to layout,widgets like TextView,Button etc.
artists_list_backgroundcolor.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="#color/grey" />
<item android:state_pressed="true"
android:drawable="#color/itemselected" />
<item android:state_selected="true"
android:state_pressed="false"
android:drawable="#color/itemselected" />
</selector>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="grey">#ffffff</color>
<color name="itemselected">#EDEDED</color>
</resources>
Use selector like this.
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/artists_list_backgroundcolor">
xml selector for layouts whats you need.
try this maybe help you.
See my answer here: how can i get android list view selector items to remember their state off screen?
It's basically using a Checkable RelativeLayout but you can do the same for LinearLayout.
Related
I know there are a lot of subjects about this and i read all of them. But still I couldn't make that selector working on RelativeLayout.
So i need your help. Here is my code.
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/selected_background"/>
<item android:state_pressed="true" android:drawable="#drawable/selected_background" />
<item android:state_selected="true" android:drawable="#drawable/selected_background" />
<item android:drawable="#drawable/unselected_background" />
Layout:
<LinearLayout
android:id="#+id/calendarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="afterDescendants"
android:clickable="false"
android:focusable="false"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:clickable="false"
android:descendantFocusability="afterDescendants"
android:weightSum="3">
<RelativeLayout
android:id="#+id/calendarItem1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/selector_dashboard_calendar_icon"
android:clickable="true"
android:focusable="true"
android:padding="3dp">
<TextView
android:id="#+id/dateTextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
android:clickable="false"
android:lines="2"
android:padding="3dp"
android:textColor="#color/white"
android:textSize="12dp" />
</RelativeLayout>
</LinearLayout>
...
</LinearLayout>
As you can see I made child views not clickable and not focusable, all parent layouts except the one that i put selector has after descendent focusability. What happens is background only changes only when the layout is clicked but i want it to be changed on the selected state.
Please see the layout below. I want to show a selection highlight on the entire LinearLayout if the user touches the ImageView or preferably entire layout. This is like a onclick effect. Although I have a selector its not working. How can I make this work?
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:background="#drawable/layout_selector"
android:orientation="vertical">
<ImageView
android:id="#+id/btnFromEasy"
android:layout_width="#dimen/normal_button_size"
android:layout_height="#dimen/normal_button_size"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:src="#drawable/animals" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/easy"
android:textColor="#color/subtitle_text_color"
android:textSize="#dimen/text_size_small"
android:textStyle="bold" />
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<color android:color="Blue" />
</item>
<item>
<color android:color="White" />
</item>
</selector>
Try this simple code.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/background_image_pressed" /> // image
<item
android:drawable="#drawable/background_image_default" /> // image
</selector>
and inside LinearLayout add android:clickable="true"
<LinearLayout
...
android:clickable="true"
...>
Hope this help.
Add android:clickable="true" to properties of LinearLayout and it work
Your code:
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:background="#drawable/layout_selector"
android:orientation="vertical">
-> add
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:background="#drawable/layout_selector"
android:orientation="vertical"
android:clickable="true">
Line android:layout_width="0dp" makes the layout can't be visible so I change it to "wrap_content"
right now what I have is just a listview with a custom gradient as the background color. When I have 2 items in my list, the rest of the background beneath it is just all black. I can't set a background image anywhere that would make a background show up. My desired outcome is to have a background image in the back of the entire view where a transparent listview would overlay it. How could this be done? Let me know if you guys need more info/code from my project.
Thanks!
This is my listview in main.xml
<ListView
android:id="#+id/store_list2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/store_div2"
android:divider="#000000"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector"/>
This is the list_selector.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>
this is my list_row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/list_selector"
android:orientation="horizontal"
android:padding="10dp" >
<!-- Application Icon -->
<LinearLayout
android:id="#+id/gmg_thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:layout_alignParentLeft="true"
android:background="#drawable/image_bg"
android:layout_marginRight="5dp">
<ImageView
android:id="#+id/gmg_list_image"
android:layout_width="50dp"
android:layout_height="50dp" />
</LinearLayout>
<!-- Title-->
<TextView
android:id="#+id/gmg_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:paddingLeft="10dp"
android:layout_toRightOf="#id/gmg_thumbnail"
android:textColor="#040404"
android:typeface="sans"
android:textSize="15sp" />
<!-- Rightend Arrow -->
<ImageView
android:contentDescription="#string/right_arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scaled_arrow"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"/>
</RelativeLayout>
Set your desired background on the Parent Layout containing ListView.
android:background="#drawable/ic_launcher"
Like this (Assuming RelativeLayout is yout parent layout)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/ic_launcher" >
<ListView
android:id="#+id/store_list2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/store_div2"
android:divider="#000000"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector"/>
</RelativeLayout>
Add this property android:cacheColorHint="#00000000" to ListView
I am using listview's adapter, my code,
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="10dp"
android:background="#android:color/darker_gray"
android:orientation="vertical" >
<TextView
android:id="#+id/tv_position"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:text="position1"
android:textSize="20sp"
/>
<Button
android:id="#+id/btn_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="#drawable/selector_translate_blue"
android:clickable="true" //Add this is to allow this to get focus, but the button can not be clicked.
>
</RelativeLayout>
</FrameLayout>
When i remove android:clickable="true", the button can be clicked, but the RelativeLayout can not focused.
How to achieve a similar effect as Google Plus?
UPDATE
Now only RelativeLayout can be clicked.
I mean how to make the Button also can be clicked?
NOT click them two at the same time.
Try to set android:focusable and android:focusableInTouchMode to false to your button:
<Button
android:id="#+id/btn_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:focusable="false"
android:focusableInTouchMode="false"
/>
UPDATE
You need to set your Button android:focusable as false and also the RelativeLayout. Plus, you need to have a selector for your both Button and RelativeLayout
Here:
<Button
android:id="#+id/btn_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
android:background="#drawable/selector"/>
And Here:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="#drawable/selector_translate_blue"
android:background="#drawable/selector_ll"
android:focusable="false" >
And here is the important thing, in those selectors, at the android:state_pressed, you need to add more the android:state_focused, this way, when the item click, the Button and RelativeLayout can NOT get focusable, so it will NOT trigger this state:
selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#android:color/darker_gray" android:state_pressed="true" android:state_focused="true"></item>
</selector>
selector_ll.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:state_focused="true"
android:drawable="#android:color/darker_gray"/> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#android:color/darker_gray"/> <!-- focused -->
<item android:drawable="#android:color/white"/> <!-- default -->
</selector>
Hope this helps.
Have you tried adding android:focusable="true" or android:focusableInTouchMode="true" to your relativelayout?
i included some linearlayouts in a linear layout. But i want the linear layout on top (the included one) to be greyish, and just the background orange. When i try this, everything is orange! Is there some way i can prevent this?
my ll:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#color/orange">
<include
android:id="#+id/bt_overview_list_places"
layout="#layout/single_overview_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
<include
android:id="#+id/bt_overview_list_agenda"
layout="#layout/single_overview_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
<include
android:id="#+id/bt_overview_list_shopping"
layout="#layout/single_overview_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
<include
android:id="#+id/bt_overview_list_food"
layout="#layout/single_overview_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
</LinearLayout>
the one i include:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lloverview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#color/custom_button_grey"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/ivoverviewimage"
android:layout_width="50dp"
android:layout_height="50dp" android:src="#drawable/ic_launcher" android:scaleType="centerCrop"
android:layout_margin="10dp"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="225dp"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/tvoverviewname"
android:layout_width="225dp"
android:layout_height="wrap_content"
android:layout_gravity="left|top"
android:layout_marginLeft="10dip"
android:text="naam"
android:textSize="16dip"
android:maxLines="1"
android:ellipsize="marquee"
android:textColor="#color/black"/>
<TextView
android:id="#+id/tvoverviewtext"
android:layout_width="225dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dip"
android:maxLines="3"
android:text="tip"
android:textSize="12dip"
android:ellipsize="end"
android:textColor="#color/black"/>
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/iconarrowsmall"
android:layout_gravity="center_vertical"
android:layout_margin="2dip"
/>
</LinearLayout>
<ImageView
android:id="#+id/bottom_border"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/custombuttonlist_bottomborder"
/>
</LinearLayout>
I already tried giving the linear layouts colors programmatically:
lPlaces= (LinearLayout)findViewById(R.id.bt_overview_list_places);
llPlaces.setBackgroundColor(R.color.custom_button_grey);
but everything just stays orange (with some difference in color).
I checked my color, and i think it should be 100% NOT transparent:
<color name="custom_button_grey_text">#585850</color>
even with the FF added in front of it:
<color name="custom_button_grey_text">#FF585850</color>
try like this in xml
android:background="#FF4500"
in place of
android:background="#color/custom_button_grey"
You should override the background parameter for each included layout. You can override any attribute using android:layout_*
Take a look at the official documentation using <include> tag.
Ok i get it:
i created an drawable file:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- focused -->
<item android:state_focused="true" android:drawable="#color/list_even" />
<!-- focused and pressed-->
<item android:state_focused="true" android:state_pressed="true" android:drawable="#color/list_even" />
<!-- pressed -->
<item android:state_pressed="true" android:drawable="#color/list_even" />
<!-- default -->
<item android:drawable="#color/list_odd" />
</selector>
(now i have nice colorchange when i press it too)
and set that as background resource:
llPlaces.setBackgroundResource(R.drawable.overview_background_color_even);