简体   繁体   中英

How do I align these buttons in Android?

I want these buttons to be aligned on top of each other. As you can see, since the text in the second row is shorter, the buttons take up a little more space to fill everything up. I'd rather have button 5 directly below and aligned with button 1.

错位的按钮

Here's my xml for the layout:

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingBottom="10dp">
        <TextView android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:gravity="center_vertical"
            android:text="Start Corner:"
            />

        <Button
            android:id="@+id/start_corner_btn_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/start_corner_btn_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/start_corner_btn_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="3"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/start_corner_btn_4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4"
            android:layout_weight="15"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingBottom="10dp">
        <TextView android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:gravity="center_vertical"
            android:text="2nd Corner:"
            />

        <Button
            android:id="@+id/second_corner_btn_5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="5"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/second_corner_btn_6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="6"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/second_corner_btn_7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="7"
            android:layout_weight="15"/>

        <Button
            android:id="@+id/second_corner_btn_8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="8"
            android:layout_weight="15"/>
    </LinearLayout>

As always, I'll bet I am close, but probably missing one thing!

您可以使用两个垂直的线性布局来分隔该空间,在左侧放置您的textViews,在右侧放置您的Buttons

Instead of using "wrap_content" for width, use some fixed value for the textviews. Or, better yet, replace the entire thing with RelativeLayout and align Button 5 to be aligned to the left of Button 1 using android:layout_alignLeft directive.

Try TableLayout:

剪断

<TableLayout
    android:id="@+id/tableBtns"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dip" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_weight="15"
            android:text="Start Corner:"/>

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="1" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="2" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="3" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="4" />
    </TableRow>

    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dip" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_weight="15"
            android:text="2nd Corner:" />

        <Button
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="5" />

        <Button
            android:id="@+id/button6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="6" />

        <Button
            android:id="@+id/button7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="7" />

        <Button
            android:id="@+id/button8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="15"
            android:text="8" />
    </TableRow>
</TableLayout>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM