Dynamically Changing List Row Background When Selected - android

I've searched around online for a solution to this problem and have tried out different ways of doing this but haven't come up with an answer. I have a list view and a custom row layout for the rows of the list. In my list row xml file there is a relative layout with an ImageView and text. Along with that I set the background of this relative layout to a certain shape and this works fabulous. Now at runtime I want to change this list row background to appear pressed inwards ( I was thinking just make the padding a little smaller or something). I have tried making another xml file for a pressed shape but it hasn't worked. I also tried to code this up by doing something such as this:
RelativeLayout rl = (RelativeLayout)view.findViewById(R.id.relativerow);
rl.setBackgroundResource(R.drawable.item_shape_pressed);
I'm guessing I'd have to make my own onPressed method for this to work?
Here is the shape xml file I am using for each list row background:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/item_shape">
<padding android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
<corners android:radius="20dp" />
<solid android:color="#FFF" />
</shape>
Here is the XML for each row in the list view. See where I sit the background attribute at the top.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativerow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/item_shape"
android:padding="5dip" >
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip">
<ImageView
android:id="#+id/list_image"
android:layout_width="60dip"
android:layout_height="60dip"/>
</LinearLayout>
<TextView
android:id="#+id/articletitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/thumbnail"
android:layout_toRightOf="#+id/thumbnail"
android:textColor="#040404"
android:typeface="sans"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/articldesc"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/articletitle"
android:textColor="#343434"
android:textSize="13sp"
android:textStyle="italic"
android:layout_marginTop="1dip"
android:layout_toRightOf="#+id/thumbnail"
/>
</RelativeLayout>
So, is there any way for me at runtime to change the background in this relative view from the normal item_shape to another pressed in item shape? If anyone could show me how to do this I would certainly appreciate it. This is just a small part of the app that has been bugging me recently but it would be a nice touch to make the app look more complete.

Try with create your own selector for the ListView, for example listview_item_selector.xml in res/drawable folder and add this selector in the background of your RelativeLayout.
The following code will be: listview_item_selector.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/item_shape_pressed" android:state_pressed="true" />
<item android:drawable="#drawable/item_shape_focused" android:state_focused="true" />
<item android:drawable="#drawable/item_shape" />
</selector>
And in your RelativeLayout put:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativerow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/listview_item_selector"
android:padding="5dip" >
.....

Related

Inline alignment title in circular custom button

I created a simple circular button to create - and + buttons for a custom dialog picker.
As seen in the screenshot the - and the + are shifted a little bit down and not centered in the middle of the custom background.
My custom background in the drawable/circular_button.xml looks like this.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke android:color="#color/colorPrimaryDark" android:width="1dp" />
<solid android:color="#color/colorPrimary" />
<size android:width="30sp" android:height="30sp"/>
</shape>
The button is configured like this inside the LinearLayout
<Button
android:id="#+id/decrease_one"
android:layout_width="40sp"
android:layout_height="40sp"
android:layout_marginRight="20sp"
android:background="#drawable/rounded_button"
android:text="-"
android:textColor="#color/white"
android:textSize="30sp"
android:textStyle="bold" />
In one of the posts I read about the tag minHeight but it didn't solve my problem.Any ideas ?
Batter to use FloatingActionButton mini
<android.support.design.widget.FloatingActionButton
android:id="#+id/activity_my_digital_executor_fabDigitalex"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
card_view:fabSize="mini"
card_view:srcCompat="#drawable/ic_new_plus" />
Add 'com.android.support:design:26.0.+' in your App dependencies
This is happen because of your Button's android:textSize="30sp" if you set 50sp its goes down the line more,
Just convert your Buttons to Textviews and set android:gravity="center" also keep your textsize 30sp
<TextView
android:id="#+id/decrease_2"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginRight="20dp"
android:background="#drawable/rounded_button"
android:text="+"
android:gravity="center"
android:textColor="#color/white"
android:textSize="30sp"
android:textStyle="bold" />
If you are use a Imageview instead of Textview than your problem is solved.

Android xml drawable is bigger first time

I have two clickable text views with the same drawable left image. When I open fragment first time the first image looks bigger then second one. After clicking on first text view the next fragment is opening and then when I return back two images have the same size. What's wrong? Please help to find out reason of this bug.
This is my layout:
<include layout="#layout/toolbar" />
<RelativeLayout
android:id="#+id/dmvLawyers"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true">
<TextView
style="#style/DashBtnStyle"
android:drawableLeft="#drawable/lawyer_selected"
android:text="#string/dmv_lawyers"
android:textAllCaps="false" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:paddingRight="#dimen/add_friends_padding_left"
android:src="#drawable/add" />
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="#dimen/divider"
android:background="#color/lineColor" />
<RelativeLayout
android:id="#+id/tlcLawyers"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true">
<TextView
style="#style/DashBtnStyle"
android:drawableLeft="#drawable/lawyer_selected"
android:text="#string/tlc_lawyers"
android:textAllCaps="false" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:paddingRight="#dimen/add_friends_padding_left"
android:src="#drawable/add" />
</RelativeLayout>
</LinearLayout>
This is image drawable (lawyer_selected.xml), where femida is png image, and white background is needed for selected state (button in selected state is green and image should be with white frame):
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<padding
android:bottom="#dimen/dash_icon_padding"
android:left="#dimen/dash_icon_padding"
android:right="#dimen/dash_icon_padding"
android:top="#dimen/dash_icon_padding"/>
<solid android:color="#android:color/white"/>
<corners
android:radius="#dimen/dash_icon_radius"/>
</shape>
</item>
<item android:drawable="#drawable/femida"/>
</layer-list>
Image femida.png
Just use nested LinearLayout instead and use android:layout_weight="1" or any required value to you and it will work for sure.
**In your case it will be 1 only, while the main parent LinearLayout can have wrap_content as height

how to create a table with two columns and 12 rows in layout [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I should create a table as shown in the link below, I thought of implementing this in two ways.
I should create a table with borders in static way and update the contents dynamically, I mean static months in first column and dynamic values in second column using activity.
I can dynamically set both columns by supplying month name and values from activity.
My questions are:
How to create this table with white background and borders as shown below ? Since I couldn't spot any blog with a table containing white background and borders.
How to supply dynamic values to each cell of the table from the activity.
Use this code:--
my_drawable.xml(Used for border):-
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<solid android:color="#B8B9B1" />
</shape>
</item>
<item
android:bottom="3px"
android:left="3px"
android:right="3px"
android:top="3px">
<shape android:shape="rectangle" >
<solid android:color="#FFFFFF" />
</shape>
</item>
</layer-list>
xml:--
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/my_drawable"
android:padding="5dp" >
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/home"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="Months" />
<TextView
android:id="#+id/status"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="Number of Visits" />
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="January" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="1" />
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="Februrary" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_drawable"
android:gravity="center"
android:padding="15dip"
android:text="" />
</TableRow>
</TableLayout>
I have just added 3 rows now.I just show you how to do it.
And for white border and all that you need to create Layer-list drawable and set it to your tablelayout.
Enjoy..!
There are so many ways to do that...
The best I can think of is using a ListView.
Then add a border to it by using a 9 patch.
Another 9 patch can be used by its (custom) row elements (two textviews, actually).
Here you are the required 9 patches for external and internal borders:
(external - table borders)
(internal - cell borders)
Save these images in your res/drawable folder, with the extension .9.png
Then add them as your android:background attribute.
For how to make a custom ListView, search on Google - there's a plenty of examples.
Like Klaus66 said there are many ways to do it.
When i had a similar case, i created corresponding table layout in xml, and now the tricky part(since you dont have table borders like in CSS) you can create table cells with background and borders using pure xml styling and drawables.
Try google-ing for list-layers, here is an example i used:(table cell with bottom and left border 1dp width)
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<solid android:color="#004536" />
</shape>
</item>
<item android:left="1dp" android:bottom="1dp" >
<shape android:shape="rectangle">
<solid android:color="#25272f" />
</shape>
</item>
</layer-list>
And just set this drawable as background for your table cell.(your textView-s in your rows,columns...).
Edit 1: As for supplying values to your cells, in your activity use findViewById(R.id...) to get your textViews you used in your layout an place values you like.

How to create a custom view with rounded edges and two textviews?

I want to create a view like image below. My implementation has some linearLayouts. One root with a custom drawable to get the rounded edges and then others for the two textviews and view divider. Is there a faster and easier way to do this?
You can do this with just 1 LinearLayout, the root one. The LinearLayout is used just to order other views. So, what you need to do is to use the vertical orientation and add two text views.
On the first one you set the background color to a light gray. And remember to use the gravity as center so your text will be placed on the center of the text view.
I dont have much time, just tried to give a quick sample. Here's my code for your question:
your_main_layout.xml
<?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/your_bg.xml">
<TextView
android:id="#+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="my text" />
<View
android:id="#+id/seperator
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/tv1" />
<TextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2nd text here"
android:layout_below="#+id/seperator" />
</RelativeLayout>
your_bg.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="5dp"
/>
<solid android:color="#fff" />
<stroke android:color="#000" />
</shape>

Adding a button to the titlebar from xml

I have a problem about the title bar. I want to do 2 buttons in the title bar, but it is seen really bad. First I was thinking I got the button height too big, but when I change the button height nothing is changed. I don't want a custom titlebar and I can't see the text in the button. Can anybody help me?
My code:
<?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="fill_parent"
android:id="#+id/titleLayout">
<Button android:id="#+id/done"
android:layout_width="60dip"
android:layout_height="38dip"
android:text="done"
android:layout_toRightOf="#+id/edit"
>
</Button>
<Button android:id="#+id/edit"
android:layout_width="60dip"
android:layout_height="38dip"
android:text="edit"
>
</Button>
</RelativeLayout>
code nippet:
final boolean customTitle = requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
if ( customTitle ) { Window win = getWindow();
win.setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.title);
Jsut try to make your RelativeLayout's height WRAP_CONTENT
You can do like this. Before initializing setContentView(), write this line of code
requestWindowFeature(Window.FEATURE_NO_TITLE);
Then in your layout XML file, include your custom title bar like this.
<include layout="#layout/title" android:id="#+id/title"/>
What about just using Text and formatting the background, edges, etc. to make it look like a button. I would try using a TextView, wrap_content and then play with paddings, and background.
<RelativeLayout xmlns:android=" http://schemas.android.com/apk/res/android "
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/titleLayout">
<TextView
android:id="#+id/doneBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:background="#drawable/bluebutton"
android:text="Done"
android:textStyle="bold"
android:textColor="#FFFFFFFF"
/>
</RelativeLayout>
and then in your #drawable/bluebutton.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android=" http://schemas.android.com/apk/res/android ">
<item>
<shape>
<gradient
android:startColor="#FFBBDDFF"
android:centerColor="#FF191990"
android:endColor="#FF0000FF"
android:angle="270" />
</shape>
</item>
</selector>
Look at this link for more details I hope it helps...
Standard Android Button with a different color

Categories

Resources