How to highlight row in table layout? - android

I have created dynamic text view at table row in table layout.
I want to highlight theh current row while I click row in table layout.
How can this be done?

Below 2 lines should work fine. When creating the rows in a method
row.setFocusable("true");
row.setFocusableInTouchMode("true");

The following layout options worked for me to make a table row clickable and respond visually like a button:
<TableRow style="#style/PlanAttribute" xmlns:android="http://schemas.android.com/apk/res/android"
android:focusable="true"
android:focusableInTouchMode="true"
android:onClick="onRowSelected"
android:clickable="true">
...
PlanAttribute style:
<style name="PlanAttribute">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:background">#drawable/divider_drawable</item>
</style>
divider_drawable.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/divider_down"
android:gravity="fill"/>
</item>
<item android:state_focused="true">
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/divider_selected"
android:gravity="fill"/>
</item>
<item
android:state_focused="false"
android:state_pressed="false">
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/divider"
android:gravity="fill"/>
</item>
</selector>

Related

Button pressed and two images xml android

I have two images. In one is a number, the other is shadow. I need to show this two images as can be seen in the second photo.
This is my code. Right now it only shows or the number (when is not pressed), or the shadow(when is pressed).
How is possible to show both images when the user press the button?
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_select" android:state_pressed="true"
android:alpha="0.75"/>
<item android:drawable="#drawable/number_1" android:state_enabled="true" />
<item android:drawable="#drawable/number_1" android:state_pressed="false"
/>
</selector>
this are the two images
this is the goal
Also I was trying using layerDrawable in this way, but didn't work:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_select" android:state_pressed="true"
android:alpha="0.75"/>
<item android:drawable="#drawable/number_1" android:state_enabled="true" />
</selector>
</item>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/number_1" android:state_pressed="false"
/>
</selector>
</layer-list>
You should use two different images...
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/pressed_image" android:state_pressed="true"/>
<item android:drawable="#drawable/normal_image" android:state_pressed="false"/>
</selector>
You can use Relative Layout for that
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/iv_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/button_select"/>
<ImageView
android:id="#+id/iv_img"
android:layout_width="wrap_content"
android:padding="5dp"
android:layout_height="wrap_content"
android:background="#drawable/number_1"/>
</RelativeLayout>
Just change image of iv_img id GOOD LUCK
please change the drawable selector file with this code..
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<layer-list>
<item android:drawable="#drawable/number_1" />
<item android:bottom="#dimen/margin_5" android:left="#dimen/margin_5" android:right="#dimen/margin_5" android:top="#dimen/margin_5">
<bitmap android:src="#drawable/button_select" />
</item>
</layer-list>
</item>
<item android:drawable="#drawable/number_1" android:state_pressed="false"/>
Limitation ::
It can use for single image of number ..for multiple numbers you have to create different selector.xml for each one..
Please tell if need more explanation or help..

Selector drawables

I have the following definition of an android style and selector applied to ListView, however I see no effect of gray gradient applied when I click on it. On click it immediately displays blue gradient.
As author of this example has written:
We want to apply this to our list selector. Instead of always showing
the same gradient, we want the gradient to change its start color from
grey to a light blue whenever a list item is pressed. Because we now
have two different list selectors—one for default state one for
pressed state—we need to keep them in separate files.
Can someone explain how it should be displayed properly ? Or I'm missing something ?
More general, what exactly I should expect to see on display screen ? Something like fluent transition from gray gradient to blue gradient on list item click ?
Update: this is how author 'sees' it, but when I click on item it looks only like on right side of picture. May I assume that author wants to see all items in list to be gray by default ? Or this state is not applicable to list view items ?
list_item_default.xml -> GRAY GRADIENT
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:angle="0"
android:endColor="#FFFF"
android:startColor="#AFFF" />
<stroke
android:width="1dip"
android:color="#CCC" />
<corners android:radius="5px" />
</shape>
list_item_pressed.xml -> BLUE GRADIENT
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:angle="0"
android:endColor="#FFFF"
android:startColor="#AA66CCFF" />
<stroke
android:width="1dip"
android:color="#CCC" />
<corners android:radius="5px" />
</shape>
list_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/list_item_default" android:state_pressed="false"/>
<item android:drawable="#drawable/list_item_pressed" android:state_pressed="true"/>
</selector>
styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyMoviesTheme" parent="#android:style/Theme.Black">
<item name="android:listViewStyle">#style/MyMoviesListView</item>
<item name="android:windowBackground">#drawable/film_bg</item>
</style>
<style name="MyMoviesTextAppearance" parent="#android:style/TextAppearance">
<!--<item name="android:textStyle">bold</item>-->
</style>
<style name="MyMoviesListView" parent="#android:Widget.ListView">
<item name="android:background">#color/list_background</item>
<item name="android:listSelector">#drawable/list_selector</item>
<item name="android:cacheColorHint">#android:color/transparent</item>
<item name="android:fastScrollEnabled">true</item>
<item name="android:footerDividersEnabled">false</item>
</style>
</resources>
Try adding a sentence:
<item
android:state_enabled="true"
android:drawable="#drawable/list_item_default"/>
<item
android:state_enabled="true"
android:drawable="#drawable/list_item_pressed"
android:state_pressed="true"/>

ListView item color in XML file

I am using the Xamarin sample at the following link:
Part 3 - Customizing a ListView's Appearance
The sample code is from the following file: CustomRowView.zip
Here is a screenshot of my running code: Emulator screenshot
The background color of the ListView items are in yellow.
May I please have some help to change this color to be the default color, or to choose this color?
I am not sure where to find this in code. I have looked in the XML layout files, but cannot find the correct item.
In the RelativeLayout, there is a reference to the following:
android:background="#drawable/CustomSelector"
And this is the contents of the file:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"
android:state_selected="false"
android:drawable="#color/cellback" />
<item android:state_pressed="true" >
<shape>
<gradient
android:startColor="#E88A93"
android:endColor="#E88A93"
android:angle="270" />
</shape>
</item>
<item android:state_selected="true"
android:state_pressed="false"
android:drawable="#color/cellback" />
</selector>
Is this code relevant to the question?
Thanks in advance
The "yello background color" is the custom listview item's background color. In the toturial you referenced, you can find it in "/Resources/Layout/CustomView.axml" :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#FFDAFF7F"
android:padding="8dp">
<LinearLayout android:id="#+id/Text"
android:orientation="vertical"
...
...
android:layout_height="48dp"
android:padding="5dp"
android:src="#drawable/icon"
android:layout_alignParentRight="true"
/>
</RelativeLayout >
the android:background="#FFDAFF7F" is what you want to modify.
Your ListView is using CustomView.axml for each row. in CustomView.axml parent element (RelativeLayout) is using CustomSelector.xml from Drawable folder in android:background attribute. In this file you can change colors of three states (pressed, pressed & selected, none) as you wish.
Create a color.xml in your values file and defines your color(which color you wnt to set to your listview ite) here
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="magenta">#FF00FF</color>
<color name="yellow">#FFFF00</color>
<color name="light_grey">#ffb9b8bb</color>
</resources>
and then use these colors in your custom selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/light_grey" android:state_pressed="false" android:state_selected="false"/>
<item android:state_pressed="true"><shape>
<gradient android:angle="270" android:endColor="#E88A93" android:startColor="#E88A93" />
</shape></item>
<item android:drawable="#color/light_grey" android:state_pressed="false" android:state_selected="true"/>
</selector>
I never get it yellow, which should come after pressing an item in the list.
(I changed your sample to yellow for state_pressed=true.
Tks
Seli
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/light_grey" android:state_pressed="false" android:state_selected="false"/>
<item android:state_pressed="true">
<shape>
<gradient android:angle="270" android:endColor="#E88A93" android:startColor="#E88A93" />
</shape>
</item>
<item android:drawable="#color/yellow" android:state_pressed="false" android:state_selected="true"/>
</selector>

Dashboard pattern does't display properly in album orientation

I'm trying to implement DashboardLayout (Pattern 3).
All ok when orientation is portrait:
But when orientation of app changes to album it looks like:
Here is the source code of DashboardLayout.java
Activity layout file as in example:
<?xml version="1.0" encoding="utf-8"?>
<com.example.ui.DashboardLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dashboard_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/white" >
<Button
android:id="#+id/posts"
style="#style/DashboardButton"
android:drawableTop="#drawable/ic_db_posts"
android:onClick="onClick"
android:text="posts" />
***and four same buttons***
</com.example.ui.DashboardLayout>
style/DashboardButton:
<style name="DashboardButton">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:layout_gravity">center_vertical</item>
<item name="android:background">#drawable/db_buttons</item>
<item name="android:textStyle">bold</item>
<item name="android:textSize">16sp</item>
<item name="android:textColor">#000000</item>
</style>
Background only for button pressed state:
<?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/db_button_bd_pressed" />
</selector>
Pressed:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<padding
android:left="10dp"
android:top="20dp"
android:right="10dp"
android:bottom="20dp" />
<corners android:radius="10dp" />
<solid android:color="#a6cee1" />
</shape>
Where is the problem? Help me, please.
The Dashboardlayout just works if the number of buttons is even. You have an odd number, just insert an extra button with:
android:background="#null" or "#ffffffff"//transparent
So it will handle it like a extra button but it is transparent.

Can't use default ListView selector

I'm developing a ListView app for Android. I want to use the default ListView selector, for example the one in Market when you touch an item.
I don't get a highlight in my ListView, where's the way to correctly implement it? I've read about the "Touch mode" although I can't get it to work.
Thanks in advance!
<ListView
android:id="#id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
You have to assign to each row layout a background composed by a selector that assign a different background for each state. Suppose that your item row layout is a RelativeLayout defined in a xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="2dip"
android:background="#drawable/transparent_selector"> ...
and transparent_selector is defined here: watch that carefully one drawable shape belongs to a single state.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#drawable/shape_7"/>
<item android:state_pressed="true" android:drawable="#drawable/shape_7" />
<item android:state_pressed="false" android:drawable="#drawable/transparent_shape" />
</selector>
and a shape is defined here:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#FF4FDBD5"
android:endColor="#FF1AA6A1"
android:type="linear"
android:angle="90"/>
</shape>
or in the other way when you construct the ListView items you can assign the selector to the 'convertView'
cheers
For your id attribute, change it to android:id="#android:id/list. This is the default ID for the ListView.
Try this selector. It works for me
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_selected="true" android:drawable="#android:color/transparent" />
<item android:state_selected="true" android:drawable="#android:color/transparent" />
<item android:state_pressed="true" android:state_selected="false" android:drawable="#android:color/transparent" />
<item android:state_selected="false" android:drawable="#drawable/list_item_back" />
</selector>

Categories

Resources