Android : 5 Buttons positions : The better way?

Question

I want to fix 5 Buttons like the pictures. But I place the five Buttons with the position of Nexus 6. I realize I lost 1 hour when i try this code on Nexus 10 : All the buttons were in a different positions !

What is the better way to fix 5 buttons and all positions will be ok with all devices /screen .

Will the following layout work?

RelativeLayout
   Linear1  ( for the first 2 buttons )
   Linear 2 ( for the 2 buttons next buttons )
   Linear 3 ( for the last button  )
/RelativeLayout

I repeat my question because I was not clear : How can I put a Button on a specific position ? For example : I want to put My GreenButton at 70% of the screen from the top, and 50 of the screen from the right / left

The best way is not using xml files. take a look at this: http://stackoverflow.com/questions/29956014/why-should-we-use-xml-layouts — Nanoc, Nov 11 '15 at 14:29

score 2 · Answer 1 · answered Nov 10 '15 at 22:57

Try using a RelativeLayout with attributes such as android:layout_alignParentTop, android:layout_centerVertical and other similar alignment attributes. They allow you to specifically place the buttons in your layout to get the desired effect. Here is the result:

And here is the code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" 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"
    tools:context="com.yourpackage.FiveButtonActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"
        android:id="@+id/button1"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button2"
        android:id="@+id/button2"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button3"
        android:id="@+id/button3"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button4"
        android:id="@+id/button4"
        android:layout_alignBottom="@+id/button5"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button5"
        android:id="@+id/button5"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" />
</RelativeLayout>

Thanks, but i have a problem. I have a back ground picture, and I Have to put the button Exactly on a specific position of the background picture. For exemple : I have to put the first button at X =100 ,y = 350. I have an idea : How can I take the Actual Device Screen size. Then I can do the followings things : Button.X = ScreenDevice * 0.60 Button.Y = ScreenDevice * 0.60 — winston_smith, Nov 11 '15 at 14:28

Oğuzhan Döngül · Answer 2 · 2015-11-11T14:41:23.230

1

Try using PercentRelativeLayout. You can give percentage for views, very useful for your case. Recently added to support library.

http://developer.android.com/reference/android/support/percent/PercentRelativeLayout.html

Example:

 <android.support.percent.PercentRelativeLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent">

     <ImageView
         app:layout_widthPercent="50%"
         app:layout_heightPercent="50%"
         app:layout_marginTopPercent="25%"
         app:layout_marginLeftPercent="25%"/>

 </android.support.percent.PercentRelativeLayout>

The attributes that you can use are:

layout_widthPercent
layout_heightPercent
layout_marginPercent
layout_marginLeftPercent
layout_marginTopPercent
layout_marginRightPercent
layout_marginBottomPercent
layout_marginStartPercent
layout_marginEndPercent
layout_aspectRatio

edited Nov 11 '15 at 14:41

answered Nov 11 '15 at 13:43

Oğuzhan Döngül

7,856
4
38
52

Thank you very much. I will try this, i juste update androïd studio because I think I did not have the recent library – winston_smith Nov 11 '15 at 14:08
Did you notice the Layout start with ? That make an error on Androïd Studio – winston_smith Nov 11 '15 at 14:38
@user198948 Copied from http://developer.android.com/reference/android/support/percent/PercentRelativeLayout.html Maybe there is a mistake, try closing it with **** – Oğuzhan Döngül Nov 11 '15 at 14:40
I am sorry, i begin in Android programming. When I paste the PercentRelativeLayout code, a rendering problem appear " the The following classes could not be found:" – winston_smith Nov 11 '15 at 15:53
@user198948 Did you add Support Library to your Project? – Oğuzhan Döngül Nov 11 '15 at 15:54
I am a beginner, so I read this http://developer.android.com/tools/support-library/setup.html, I Install it, but I think it is not the good Support library. ( sorry for my poor english ) It is not enough http://hpics.li/b335ea5 – winston_smith Nov 11 '15 at 16:17
@user198948 I can see you are a beginner, you need to read more tutorials about android developing before starting a real application development. This platform is for more specific programming questions. – Oğuzhan Döngül Nov 11 '15 at 16:21

Android : 5 Buttons positions : The better way?

2 Answers2