Inconsistent view position in ListView - android

I have a ListView which uses a custom adapter to display rows of data. Each row contains two TextViews; one is left-justified and one is right-justified.
Ideally what I want is for each TextView to take up at most half of the width of the row. I've accomplished this using the following row xml layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/description"
style="#style/ProductSpecNameFont"
android:layout_width="fill_parent"
android:layout_gravity="left"
android:layout_weight="1"
android:padding="#dimen/margin_sides"
android:text="Display Size" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/value"
style="#style/ProductSpecValueFont"
android:layout_alignParentRight="true"
android:padding="#dimen/margin_sides"
android:text="3.5 Inches" />
</RelativeLayout>
This "almost" works perfectly. The problem is that the rows which contain text on the right-side TextView that takes up multiple lines are not right-justified. The single-line rows are right-justified as I would like. Here is a screenshot of what I'm talking about:
Why aren't the multiple-line TextViews right-justified, and how can I make them so?

Try setting the gravity of the TextView. It looks like what's happening is the TextView is aligned to the right, but the text itself is left justified.
android:gravity="right"

Try using android:weightSum on your LinearLayout. Like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0">
<TextView
android:id="#+id/description"
style="#style/ProductSpecNameFont"
android:layout_width="fill_parent"
android:layout_gravity="left"
android:layout_weight="0.5"
android:padding="#dimen/margin_sides"
android:text="Display Size" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5" >
<TextView
android:id="#+id/value"
style="#style/ProductSpecValueFont"
android:layout_alignParentRight="true"
android:padding="#dimen/margin_sides"
android:text="3.5 Inches" />
</RelativeLayout>

Related

One of two Android ListView filling too much space

I would like to obtain this layout for an Android app for mobile phones:
Icon - Object1
List with entries related to Object1
Icon - Object2
List with entries related to Object2
So far I have used the following layout tree (edited graphically with the editor in Android Studio):
Root-LinearLayout
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
May be this is not the best way to organize such layout (may be I should use lists with header, but suggestions very welcome), however it can be a good case for understanding deeper how ListView works.
This is the graphical layout generated:
the blue row corresponds to the first LinearLayout. As you can see from the second screenshot that follows, the second list goes all the way down to Hell, bringing me with her. Is there any way to make the lists respect the wrap_content+ weight behaviour?
The XML code follows. I have tried several combos (both reasonable and unreasonable) of layout:weights but none works. I also tried to set the min-width of the first LinearLayout (the hidden one), but nothing changes.
Could you please help me?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:minHeight="50dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_weight="1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView16"
android:src="#drawable/abc_ic_commit_search_api_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object2"
android:id="#+id/textView25"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_weight="1" />
</LinearLayout>
It should work if you put your ListViews inside of the child LinearLayouts which hold the LinearLayout that has the TextView and ImageView. You also should be using "0dp" for the height when using weight with a vertical layout.
Something like this, I believe, should work
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:gravity="center_vertical"
android:minHeight="50dp"
android:layout_weight=".2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:id="#+id/listView2"
android:layout_weight=".8" />
</LinearLayout>
Note the other changes: I gave the inner-LinearLayout an arbitrary weight of ".2" then the ListView a weight of ".8". And, of course, set the height to "0dp". You may need to play with those weights a bit but I think doing something like that for both first child LinearLayouts should get you close.
That may get your current layout to work but using headers and/or an ExpandableListView may be a better option.

Android Development - Graphical Layout looks different from actual XML

Alright so I quickly created an XML file with the following contents:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 1"
android:textSize="30dp" />
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</ListView>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 2"
android:textSize="30dp" />
<ListView
android:id="#+id/listView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</ListView>
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 3"
android:textSize="30dp" />
<ListView
android:id="#+id/listView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</ListView>
</LinearLayout>
</ScrollView>
</LinearLayout>
And the question is, is that why does it look so much different when I click on the "Graphical Layout" tab? What I imagined the graphical layout to look like would basically be 3 labels right under each other (this is because I set everything to wrap content, and because there are no items inside either of the ListViews, so I'd think that it wouldn't even be visible). But anyway, the graphical layout shows it to be:
I'm not sure if that's correct or not, and if I run it will it look like I imagine it to look? I basically want (everything inside 1 ScrollView) 3 TextView's, and 1 ListView immediately following each TextView. So the layout will look like this:
ScrollView
TextView
ListView
TextView
ListView
TextView
ListView
End of ScrollView
Something exactly like the layout shown above. Could someone please tell me what is wrong within my XML file for all the other labels not be showing on it?
Note: When I click on the components on the side, it seems that a few things are shifting. (When I tried clicking on the TextView2 (to try to search for the blue bounds box) it seemed like the TextView1 label got pushed down a bit, and the second TextView was still not visible. If anyone could please help me achieve the layout that I want, it would be greatly appreciated.
EDIT: take a look at this approach.
<?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:orientation="vertical" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 1"
android:textSize="30dp" />
</ScrollView>
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/scrollView1">
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 2"
android:textSize="30dp" />
</ScrollView>
<ScrollView
android:id="#+id/scrollView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/scrollView2" >
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text View 3"
android:textSize="30dp" />
</ScrollView>
</RelativeLayout>
As for the ListView you should not put a ListView inside a ScrollView. Here is an explanation of why you should not put a ListView inside a ScrollView: Listview inside ScrollView

Center list item vertically on ListView

I'm developing an Android application.
On one activity I have a List with list items. Those list items will have a TextView (I'm using my own layout because probably I will need to add more widgets to it).
This is ListActivity xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="469dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="40dp">
</ListView>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/orderErrorMsg"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="16dp" >
</TextView>
</RelativeLayout>
</LinearLayout>
And this is ListItem xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<TextView
android:id="#+id/orderToFillName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textSize="20dp" />
</LinearLayout>
And, finally, this is the result:
Why TextView is not centered vertically?
You have "wrap_content" on the layout_height of the TextView = there is no space to center vertically on since the TextView is wrapped tightly.
Try changing the layout_height to "match_parent" or place gravity="center_vertical" attribute in the LinearLayout instead.
<TextView
android:id="#+id/orderToFillName"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:textSize="20dp" />
the answer is really simple: you have to add this to your TextView's XML:
android:gravity="center"
Currently you're not setting the text's position in the TextView but just the View's position.
Best wishes,
Tim
Try this way:
<TextView
android:id="#+id/orderToFillName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity= "center_vertical|center_horizontal"
android:textSize="20dp" />
or
android:gravity="center"

Why my text is always located on the top of screen not center?

I have a simple layout like below (which only shows a text "TEST"):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="TEST"
android:textColor="#0099cc"
/>
</LinearLayout>
</LinearLayout>
I suppose with this layout, my text "TEST" should be located in the middle of the screen. But the text "TEST" is located on the top of the screen. Why?
I used layout_gravity and gravity with value center, why my "TEST" text located on the top?
use android:gravity="center" in your main layout
just try it.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:gravity="center"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="TEST"
android:textColor="#0099cc"
/>
</LinearLayout>
</LinearLayout>
Hi leem android:gravity consult with the content of specific view that means your android:gravity="middle" place the text middle of text view not a middle of screen. your layout_gravity define the where should your view is going to be place? mean you have to set android:layout_gravity="center_vertical|center_horizontal" of textview to view your text middle of screen
Very simple.. In the first linear layout section of your xml file. Just add android:gravity="center" and it will work..

How to line up intger output in custom Android dialog

I am displaying integer data from an SQLite database using a SimpleCursorAdaptor.
Everything shows up but the alignment is all wrong:
The dialog looks like this:
<?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">
<ListView android:id="#+id/lvwScores"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btnOK "
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="OK" android:layout_below="#id/lvwScores">
</Button>
</RelativeLayout>
With the row xml file:
<?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">
<TableLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:stretchColumns="0,1,2,3">
<TableRow >
<TextView android:id="#+id/tvwPlayer1Score" xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer2Score" xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer3Score" xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer4Score" xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="right"/>
</TableRow>
</TableLayout>
</RelativeLayout>
TableLayout is a bad choice. It's inherent fluidity will cause the columns to vary in width based on the content inside of them (although the stretching does minimize some of this), which you have no control over (see below). Also, the namespace declaration only needs to be on the root element of the XML, not each one ;)
Simplify your row layout drastically by using this instead:
<?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="wrap_content"
android:orientation="horizontal">
<TextView android:id="#+id/tvwPlayer1Score"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer2Score"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer3Score"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"/>
<TextView android:id="#+id/tvwPlayer4Score"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"/>
</LinearLayout>
The combination of layout_width="fill_parent" and layout_weight="1" on each element tells the system to lay out all four elements, equally spaced (since they have the same weight sum) to fill the row. I almost always use nested LinearLayout in place of TableLayout whenever possible (that's all TableLayout really is anyway).
Another thing from the row XML you posted: it's not a good idea to set the root element of a list item's layout with layout_height=fill_parent like you have in the RelativeLayout tag. Depending on where this layout get's drawn, the layout manager might actually listen to you and one row might end up taking the entire window!
NOTE ABOUT TABLELAYOUT PARAMS:
If you insist on sticking with TableLayout, know that you can (and should) omit all the layout_width and layout_height attributes from every child of TableLayout and TableRow. Those two widgets ignore what you say and set the values of their children to MATCH_PARENT and WRAP_CONTENT (respectively), so adding them to your code will only serve to confuse you if you think they're supposed to take effect.
Hope that Helps!
you should specify the android:gravity attribute:
<TextView android:gravity="right" />
more about this: Android TextView
Update:
I've modified a bit the row.xml layout.
changed the TextViews' width to
fill_parent (they are stretched
anyway, so it shouldn't do any harm),
and
added some attributes to the
TableRow tag
So it looks like:
[...]
<TableRow android:orientation="horizontal"
android:layout_width="fill_parent" android:layout_height="match_parent">
<TextView android:id="#+id/tvwPlayer1Score"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:gravity="right" />
<TextView android:id="#+id/tvwPlayer2Score"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:gravity="right" />
<TextView android:id="#+id/tvwPlayer3Score"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:gravity="right" />
<TextView android:id="#+id/tvwPlayer4Score"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:gravity="right" android:layout_margin="2dp" />
</TableRow>
[...]
And the output looks right now:
Please let me know if this helped (still very embarrassed...)

Categories

Resources