How to build a badminton field layout?

Question

I'm trying to build a badminton field layout for an application of mine.

After some experiments I got a nice looking one, like that (field.xml see below).

I know that it's probably not the best way to create a badminton field layout, but I didn't find a better solution since now. If anyone has a better idea how to build the field I would appreciate any comments.

The main problem is, the fact, that I want to add text to some text fileds. As soon as I add text to the fields, my layout is broken: broken layout.png

When I remove the layout_width attribute: wrap_content from those text elements, the UI editor displays it correctly: wanted layout.png.

But as the layout_width attributes are missing, the application will not load this layout on my device.

Any ideas how to add text to the fields without damaging the layout?

field.xml:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row1"
    style="@style/topborder"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.1"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field11"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal" />

    <TextView
        android:id="@+id/field12"
        style="@style/rightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center"
        android:text="Team 1" />

    <TextView
        android:id="@+id/field13"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field14"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row2"
    style="@style/bottomborder"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.7"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field21"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field22"
        style="@style/rightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center"
        android:text="21"
        android:textSize="50dp" />

    <TextView
        android:id="@+id/field23"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field24"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row3"
    style="@style/bottomborder"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.3"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field31"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field32"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="2"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field33"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row4"
    style="@style/bottomborder"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.3"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field41"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field42"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="2"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field43"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:id="@+id/row5"
    android:layout_height="wrap_content"
    android:layout_weight="0.7"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field51"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field52"
        style="@style/rightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field53"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center"
        android:text="10"
        android:textSize="50dp" />

    <TextView
        android:id="@+id/field54"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    style="@style/bottomborder"
    android:id="@+id/row6"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.1"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/field61"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field62"
        style="@style/rightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />

    <TextView
        android:id="@+id/field63"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#000000"
        android:gravity="center"
        android:text="Team 2" />

    <TextView
        android:id="@+id/field64"
        style="@style/leftrightborder"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="0.3"
        android:background="#000000"
        android:gravity="center_horizontal"
        android:text="" />
</LinearLayout>

Have you tried setting all of the widths to android:layout_width="match_parent"? Both on Layouts and on TextViews — DecodeGnome, Jun 18 '12 at 11:32
@DecodeGnome As far as I know match_parent is just a renamed variant of fill_parent. — Matthias B, Jun 18 '12 at 11:56

score 0 · Accepted Answer · edited May 23 '17 at 12:15

0

As mentioned in this post, I just found, I just had to set layout_width:0dp on each text view. Not it's working fine!

edited May 23 '17 at 12:15

Community

1
1

answered Jun 18 '12 at 11:58

Matthias B

5,523
3
45
47

score 0 · Answer 2 · answered Jun 18 '12 at 12:15

In your layout layout_weight have incorrect values. If one row should use 0.1 of the screen and second row should use 0.9 of the screen. Then you will set the layout_weight of the first row to 0.9 and the layout_weight of the second to 0.1. Here is layout with correct weights:

    <LinearLayout
        android:id="@+id/row1"
        style="@style/topborder"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="2.1"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field11"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal" />

        <TextView
            android:id="@+id/field12"
            style="@style/rightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center"
            android:text="Team 1" />

        <TextView
            android:id="@+id/field13"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field14"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row2"
        style="@style/bottomborder"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1.5"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field21"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field22"
            style="@style/rightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center"
            android:text="21"
            android:textSize="50dp" />

        <TextView
            android:id="@+id/field23"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field24"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row3"
        style="@style/bottomborder"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1.9"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field31"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field32"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="0.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field33"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row4"
        style="@style/bottomborder"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1.9"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field41"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field42"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="0.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field43"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row5"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1.5"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field51"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field52"
            style="@style/rightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field53"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center"
            android:text="10"
            android:textSize="50dp" />

        <TextView
            android:id="@+id/field54"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row6"
        style="@style/bottomborder"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="2.1"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/field61"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field62"
            style="@style/rightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />

        <TextView
            android:id="@+id/field63"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.6"
            android:background="#000000"
            android:gravity="center"
            android:text="Team 2" />

        <TextView
            android:id="@+id/field64"
            style="@style/leftrightborder"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="2.3"
            android:background="#000000"
            android:gravity="center_horizontal"
            android:text="" />
    </LinearLayout>

</LinearLayout>

hmm, I don't think this is a mistake, as it renders nicely. I just had to set layout_width to 0dp. BTW: is there any documentation describing the behavior you mentioned? — Matthias B, Jun 20 '12 at 06:42
http://www.chess-ix.com/2012/01/17/the-use-of-layout_weight-with-android-layouts/ It's very tricky theme. If `layout_width` is set to 0dp `layout_weight` works in one way, if `layout_width` is `wrap_content` or `fill_parent`/`match_parent` then it works in another. — vasart, Jun 20 '12 at 13:27

How to build a badminton field layout?

2 Answers2