RelativeLayout或TableLayout Android 3按钮

Question

I want to do something simple, 3 buttons in 1 column, responsive, like on screen.

Should I create it on RelativeLayout like in my code, or TableLayout would be better idea?

How to link RelativeLayout to the top and to the bottom, to be sure that last button never go out of the bottom of screen?

<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_main"
tools:context=".MainActivity"
android:background="@color/green"
>
<ImageButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="NAGRAJ"
    android:id="@+id/nagraj"
    android:src="@drawable/button_sos"
    android:scaleType="fitStart"
    android:layout_alignParentTop="true"
    android:adjustViewBounds="true"
    android:background="@null"
    android:layout_marginBottom="25px"
    android:tag="nagraj"
    />

<ImageButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="112"
    android:id="@+id/zadzwon"
    android:layout_below="@+id/nagraj"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:src="@drawable/button_112"
    android:scaleType="fitStart"
    android:background="@null"
    android:adjustViewBounds="true"
    android:layout_marginBottom="25px"/>

<ImageButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="ZDJECIE"
    android:id="@+id/foto"
    android:layout_below="@+id/zadzwon"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:src="@drawable/button_foto"
    android:scaleType="fitStart"
    android:background="@null"
    android:adjustViewBounds="true"
    /> 
</RelativeLayout>

Answer 1

Have you tried using LinearLayout vertically and adding layout_weight parameters? This will always keep buttons in the same spacing, regardless the screen size. I think this might be helpful: https://stackoverflow.com/a/4517358/4890826

Edit: New Google Percent Support Library might be also helpful - especially in responsive design - http://www.androidauthority.com/using-the-android-percent-support-library-630715/

Answer 2

You should not use either RelativeLayout or TableLayout for this. You should use a LinearLayout with layout_weight.

The layout_weight parameter basically means that if 2 (or more) layouts have the same value, they get the same amount of screen space. In the code below, all 3 buttons have the same layout_weight (1 in this example), so they each get exactly 1/3 of the space available, without going outside the screen.

This code below should give you what you need.

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/activity_main"
    tools:context=".MainActivity"
    android:background="@color/green"
    android:orientation="vertical">

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="NAGRAJ"
        android:id="@+id/nagraj"
        android:src="@drawable/button_sos"
        android:background="@null"
        android:layout_marginBottom="14dp"
        android:tag="nagraj"/>

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="112"
        android:id="@+id/zadzwon"
        android:src="@drawable/button_112"
        android:background="@null"
        android:layout_marginBottom="14dp"/>

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="ZDJECIE"
        android:id="@+id/foto"
        android:src="@drawable/button_foto"
        android:background="@null"/>

</LinearLayout>

Answer 3

Use both RelativeLayout and LinearLayout like this

RelativeLayout

   LinearLayout (orientation:vertical && weightsum = 3)

      ImageView (weightsum = 1)

      ImageView (weightsum = 1)

      ImageView (weightsum = 1)

   LinearLayout

   Button (align to the bot of the above LinearLayout and android:layout_alignParentBottom="true")

RelativeLayout