0

i'm trying to develop a calculator app using linear layout, however i'm not familiar with android development so i don't know who to write it... how do i make it so that for example there are 3 buttons in a single row (they take up the entire horizontal space) and then a second row containing also 3 buttons?

Example:

 [ 7   8   9 ]
 [ 4   5   6 ]
 [ 1   2   3 ]
Tharwat7
  • 1
  • 1
  • 5

4 Answers4

1

I recommend using TableLayout because in LinearLayout you will probably encounter a warning "Nested weights bad for performance". You need to use a lot of android:weightSum in this to fill all the spaces. Try the one below.

<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:weightSum="3"
    >
    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:weightSum="3">
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="7"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="8"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="9"
            />
    </TableRow>
    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:weightSum="3">
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="4"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="5"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="6"
            />
    </TableRow>
    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:weightSum="3">
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="3"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="2"
            />
        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="1"
            />
    </TableRow>

</TableLayout>
Community
  • 1
  • 1
Lawrence Gimenez
  • 2,662
  • 4
  • 34
  • 52
0

Don't use LinearLayout. Try RelativeLayouts inside a RelativeLayout instead.

You can also use a TableLayout, but I find that RelativeLayout adjusts better to different screen geometries.

Joe Malin
  • 8,621
  • 1
  • 23
  • 18
  • im sorry but can u show me an example of using relative layouts? how will it be written down? and is there a problem with the linear layouts (just to know) – Tharwat7 Nov 16 '12 at 01:19
0

You will likely want something like this if you want to stick with a LinearLayout. As others have pointed out, a TableLayout may be more robust. I find LinearLayouts pretty simple. Given the simplicity of your app I find it hard to believe it will stress any android device unless are are doing animations and things on the screen. Also, I'm sure you'll need a space for the other components of a calculator which should be pretty simple to put into this layout.. You could either add another level of nesting or change your weights to accommodate a smaller row at the top where the equation/answer are displayed.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <LinearLayout  android:layout_width="match_parent" 
      android:layout_height="0dp" android:layout_weight="1"
      android:orientation="horizontal">
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="7"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="8"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="9"
       />
    </LinearLayout>
    <LinearLayout  android:layout_width="match_parent" 
      android:layout_height="0dp" android:layout_weight="1"
      android:orientation="horizontal">
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="4"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="5"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="6"
       />
    </LinearLayout>

    <LinearLayout  android:layout_width="match_parent" 
      android:layout_height="0dp" android:layout_weight="1"
      android:orientation="horizontal">
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="1"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="2"
       />
       <Button android:layout_width="0dp" 
         android:layout_height="match_parent"
         android:layout_weight="1" 
         android:text="3"
       />
    </LinearLayout>

</LinearLayout>
Matt Wolfe
  • 8,924
  • 8
  • 60
  • 77
  • Just for reference, @user1413755 the same layout_weight divides the space equally between the elements inside the linear layout. – caiocpricci2 Nov 16 '12 at 01:23
  • Thanks for the clarification. I was really surprised when I wrote all that code, copied it into eclipse, and it worked. First time! But yes, weight will distribute based on the total weights of elements inside. You can specify the total in the parent LinearLayout but that's only necessary if you have some dynamic content that you haven't placed yet (AFAIK). – Matt Wolfe Nov 16 '12 at 01:26
  • Welcome to Stack Overflow @user1413755. Thank you's on stack overflows are done with upvotes and/or acceptance. – Matt Wolfe Nov 16 '12 at 01:27
  • one last thing @gameower, what happens if i for example set 7 to a weight of .5, and the rest to 1 ? – Tharwat7 Nov 16 '12 at 01:29
  • assuming you are using eclipse, try it out! No need to even load it on a device to test. – Matt Wolfe Nov 16 '12 at 01:33
  • Assuming you have a 100px linear layout, and 2 20px buttons. Button A has weight .5 button B has 1. 100px - 20px -20px = 60px remaining. 1 is twice as much as .5 so button b will get twice as much of the free space as button A. Therefore your new widths are A:40px B:60px. Filling your layout. Got it? – caiocpricci2 Nov 16 '12 at 11:12
0

I would recommend using a GridLayout. ( http://developer.android.com/reference/android/widget/GridLayout.html )

Since GridLayout is available on android 4 and above, you might want to check this other question to add compatibility for older versions:

How to make Android GridLayout compatible to older version?

Community
  • 1
  • 1
Robert Estivill
  • 12,369
  • 8
  • 43
  • 64