How to line up intger output in custom Android dia

Question

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>

Answer 1

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...)

Answer 2

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!