Android layout inside ListView - android

The row of my ListView is made of two TextViews:
I have to position the first TextView at the leftmost position and the second TextView at the rightmost position. How can I achieve this?
(Minimum API support should be at least 2.3 Gingerbread)

Simple make a layout xml file, which will be inflated into each row and in that layout you can use for example android:gravity="left" and android:gravity="right" for first and second TextView

You need to implement Custom List Adapter and in the Layout add RelativeLayout with two textview one aligning to left with parent and one with right.

See ListView Customization
and Custom List adapter

Best practice it is using RelativeLayout for this purpose
<?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:paddingLeft="16dp"
android:paddingRight="16dp"
android:layout_gravity="center"
>
<TextView
android:id="#+id/txtViewTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/desk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/txtViewTitle"
/>
</RelativeLayout>

Only the following markup worked for me:(tested on Android 2.3 device)
For the 1st TextView:
android:layout_alignParentLeft="true"
android:layout_alignParentRight="false"
For the 2nd TextView:
android:layout_alignParentLeft="false"
android:layout_alignParentRight="true"

Related

Listview in dialog dynamic layout

I have a simple fragment dialog with a listview, EditText and two button (accept and cancel).
I want my layout to look like this:
Listview on top
EditText right below
and
Buttons side by side below edittext.
Now my problem is that listview can have 0 or a 100 elements.
So if I put everythis in a vertical LinearLayout and listview has a lot of elements the edittext and buttons get pushed out of view. And if I use relative layout and say that edit text is aligned parent bottom and below the listview that it looks ok for 100elements but when the listview is empty the dialog uses all of the screen space.
Here is an example of my code when using relativeLayout. Is there another way to make is so that linearLayout with id "below" is below the listview but will still be visible(if list view has a lot of items) without using alignParentBottom="true" because that is the reason the layout stretches to full screen.
<?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="wrap_content"
android:orientation="vertical" >
<ListView
android:id="#+id/ListViewPreNotes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/bottom" />
<LinearLayout
android:id="#+id/below"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:padding="3dp">
<TextView
android:layout_height="#dimen/label_height"
android:layout_width="130dip"
android:text="#string/note"
android:layout_marginLeft="10dip"
android:gravity="center_vertical"
android:textSize="#dimen/text_size_large"/>
<EditText
android:id="#+id/OMnote"
android:layout_height="wrap_content"
android:layout_width="200dp"
android:textSize="#dimen/text_size_large"
android:inputType="textNoSuggestions|textCapSentences"
android:selectAllOnFocus="true"
android:hint="#string/note"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:baselineAligned="false">
<Button
android:id="#+id/dialogButtonClose"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/ok"
style="?android:attr/borderlessButtonStyle"
android:textStyle="bold" />
<Button
android:id="#+id/dialogButtonCancel"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/cancel"
android:textStyle="bold"
style="?android:attr/borderlessButtonStyle" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Set ListView.Visibility to Gone when no records found and use RelativeLayout and align parent bottom.
you can add what you need to show below the ListView in its footer. You can add it like this.
View footerView = ((LayoutInflater) ActivityContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.footer_layout, null, false);
ListView.addFooterView(footerView);
You can use FrameLayout as the root and then you can place your LinearLayouts on top of the ListView.
http://developer.android.com/reference/android/widget/FrameLayout.html
Some credit goes to Arsalan Shah for his suggestions.
This is the final version of how I solved my problem (kind of hacky):
First I check how many elements I have in a list view then depending on that and depending on the device and orientation mode (portrait or landscape) I inflate eather the layout in my question or another layout with listview footer that Arsalan Shah suggested.
Example:
If the device is below 7" and it is in landscape mode and the number of items in my list is above 4 I will use my layout otherwise I will use Arsalan Shah suggestion. I sort of tested for what the number of items on which layout/device should be for what layout to find the best case scenario for my design.
Hope this helps anyone else that might have the same problem.
If anyone has a suggestion how to do all this in only one layout then please comment below.

How to create custom listview for android with margins between 2 elements?

I need to create an application with a list-view activity, but the elements in the list should be separated one from another and have more then one click option:
Here is the image:
so i can click on the on the task to see the task details and i can click on the left side of the task (the colored part) to change it's color, and this way to change it's priority
i would really appreciate if some one could provide me with a tutorial or additional reading information to creating such custom lists.
divider and dividerHeight property of the ListView can make space between your listview items:
<ListView android:id="#+id/list_view"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:divider="#android:color/transparent"
android:dividerHeight="10.0sp"/>
You can find some tutorial on how to build an Android Listview with Multiple Clickable Zones
You need to create a custom xml layout for list item. and in a listview give devider heght..
like i did here.
<ListView
android:id="#+id/lstContact"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/lay"
android:divider="#0000"
android:dividerHeight="6dp"
android:layout_marginTop="3dp"
android:padding="5dp"
android:background="#0000"
android:cacheColorHint="#0000"
android:scrollbars="none" />
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp" >
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Label" />
</LinearLayout>
You can use this as the layout for your list row in your list adapter.
And you can acheive the spacing by increasing and decreasing the margin for the parent layout.
Hope it will help you
I think you need to mention a shape.xml for each styling your row. And then in your row layout use an RelativeLayout for arranging the items. And make sure that you make the android:background="#android:color/transparent" for each button you create there. First one will be an ImageButton.
This is what you can achieve. Let me know if this helps you.

android - last added item to layout is strech vertical. WHY? (Remake)

[Second Edited]
I found where problem is. But i dont know why its doing. It cant be margin on LinearLayout (or just marginLeft). Does anybody know why it cant have ?
[EDITED]
Hello i have xml file in layout like bellow.And iam adding TextViews from any xml layout to horizontal LinearLayout. This layout structure is given and i cant change it.
And last added TextView is streching always verticaly. I dont know why i am in tottaly despair. Too many hours i was try* that but without no idea. I know just its not in programicaly adding TextViews ..
If some body know why its doing i will be thankful.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/back_border"
>
<RelativeLayout
android:id="#+id/manager_view_table_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#drawable/back_border"
>
<!-- horizontal layout, HERE IAM ADDING TEXTVIEWS -->
</LinearLayout>
</RelativeLayout>
<!--What is here its no important
because, there is RelativeLayout with alignBellow relative layout before -->
</RelativeLayout>
and TextView witch iam addig to LinearLayout:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="15sp"
android:paddingRight="7px"
android:paddingLeft="7px"
android:paddingTop="3px"
android:paddingBottom="3px"
android:layout_marginLeft="5px"
android:gravity="center_horizontal"
android:background="#drawable/background_table"
android:textColor="#330033"
android:text="Some text"
/>
Try to replace the android:layout_margin="6px" from the LinearLayout by android:padding="6px".
I think this will solve your problem. I mean the new LInearLayout should be like this:
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#44ff435f"
>
I am confused with your three layouts. Wat's the porpose of all thses nested layouts, try to recreate the text views with a single relative layout, and use the android:layout_above and android:layout_below for placing the text views.
First of all you need to refactor this code.
You might want to use actual ListView to create repeated elements.
and why is xmlns:android="http://schemas.android.com/apk/res/android" declared thrice in this xml code, when it is actually required just once at top root element.
Even with this layout to solve your problem, if other things are not working a nice idea would be to switch to Graphic layout(bottom tab in eclipse when on .xml file) and manually try to set the third TextView (not listview) height manually, you can observe the changes then and finalize them accordingly..

Android ListView and Scroll problem

I have a LinearLayout with a number of TextView followed by a ListView at the bottom - see code below.
The problem is the TextView/CheckBox's take around 75% of the screen - ListView then has a scroll inside it at the bottom, not massively usable - how do I disable the ListView scroll and enable the whole LinearLayout Scroll. Please provide some example code.
<LinearLayout android:orientation="vertical"
android:layout_margin="5dip"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout android:layout_width="fill_parent"
android:layout_margin="5dip"
android:layout_height="wrap_content"
android:background="#CCCCCC">
<TextView android:id="#+id/_text_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/text1"
android:layout_marginTop="14dip"
android:textColor="#FFFFFF"
android:gravity="center_horizontal"
android:textSize="17dip"
android:textStyle="bold" />
<CheckBox ..../>
<CheckBox ..../>
<TextView android:id="#+id/_text_title" ..../>
<CheckBox ..../>
<CheckBox ..../>
<ListView .../>
</LinearLayout>
Never put a scrollable view inside another scrollable view. It will not work. if you run into such a problem you have a UI design flaw. An UI redesign/rethink is imminent.
Ok, So I found the solution to this.
I dont have the code to hand, but roughly speaking what I did was,
create new class extending ListView
Override the onMeasure method,
Using the data set I have - I know the hight of each row, I calculate the height of the list and set this manually.
I also faced the same problem. To remove this you have to put your list view in sap rate layout.

How to get UI to look right

I am having a problem getting the ListView to display properly. It currently looks like this with the following xml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/favs_main">
<Button
android:text="Return to Home"
android:id="#+id/return_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:textSize="15sp"/>
<ListView
android:id="#+id/favsListView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="180dp"
android:layout_above="#id/return_button"/>
</RelativeLayout>
If you notice the list is down on the screen. I want it to be just below the favorites text instead of just above the return to home button. The catch however is that I always want the button to show and the list view to just occupy the space between the favorites text and the button. The text is from the background image so I can't just align below that. So even with 100 items I would still like to show the button.
Thanks for the help
If the word "favorites" is part of a background image as suggested in the RelativeLayout's background attribute, then you won't be able to align an element below it without using hacky margins or something to that effect. If you want to align an element below the word, separate that into a different ImageView and set the layout_below of the ListView to the id of that ImageView. To get an element to align properly in between two other elements, use a combination of layout_above and layout_below.
Couldn't you just align the ListView to the Parents' Top and set a margin for the ListView so that it is below the Text of the Background?
Also you could change the background to provide the Text in an ImageView and align the ListView to be below the ImageView.
Instead of trying to make a persistent View always show up under the ListView and align it (which you can do, see other suggestions), you might want to take a look at using a footerView:
http://developer.android.com/intl/de/reference/android/widget/ListView.html#addFooterView
"Add a fixed view to appear at the bottom of the list."
Note that it can be another layout too if you eventually need to do more than just one Button.
this my listview which have multiple entries and textview and button fixed in the botton. i haven't inserted background. try this hope it will help.
http://www.techuv.com/layout-with-butoon-and-textview-fixed-in-bottom/
You could use a simple LinearLayout and use the weight attribute on the ListView :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#drawable/favs_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<ListView
android:id="#+id/favsListView"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="180dp"/>
<Button
android:text="Return to Home"
android:id="#+id/return_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:textSize="15sp"/>
</LinearLayout>

Categories

Resources