Android tablelayout hides the top buttons

Question

In my app i have a tablelayout with 26 buttons. I have made a row of two buttons each. My code is as follows:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" 
     android:layout_width="fill_parent" 
     android:scrollbars="vertical">
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_gravity="center"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:scrollbars="horizontal"
android:paddingTop="4.5dp"
android:stretchColumns="**">
<TableRow>
<Button
      android:id="@+id/sp1"
      android:layout_height="40dp"
      android:layout_width="100dp"
       android:background="@drawable/selector3"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:text="Preventing Psoric Taint"/>
<Button 
      android:text="Suffocation and Choking" 
      android:layout_height="40dp"
       android:background="@drawable/selector3"
      android:layout_width="100dp"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:id="@+id/sp2" />
 </TableRow>
 <TableRow>
<Button
      android:text="Spots on the cranum due to collection of blood" 
      android:id="@+id/sp3" 
      android:layout_height="40dp"
       android:background="@drawable/selector3"
      android:layout_width="100dp"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"/>
<Button
      android:id="@+id/sp4" 
      android:layout_height="40dp"
      android:layout_width="100dp"
       android:background="@drawable/selector3"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:text="Monstrocities and Deformities"/>
</TableRow>
<TableRow> 
<Button
      android:id="@+id/sp5" 
      android:layout_marginBottom="7dp"
       android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
      android:layout_width="100dp"
      android:layout_height="40dp" 
      android:text="Marks and Blemishes"/>
<Button 
      android:id="@+id/sp6"
      android:layout_width="100dp"
       android:background="@drawable/selector3"
      android:layout_height="40dp"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp" 
      android:text="Blue discoloration of the skin"/>
   </TableRow>
   <TableRow>
<Button 
      android:id="@+id/sp7"
      android:layout_width="100dp"
      android:layout_height="40dp"
       android:background="@drawable/selector3"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp" 
      android:text="Swelling of the head"/>
<Button 
      android:id="@+id/sp8"
      android:layout_width="100dp"
      android:layout_height="40dp"
      android:layout_marginBottom="7dp"
       android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
      android:text="Congenital Hernia"/>
    </TableRow>
    <TableRow>
<Button 
      android:text="Induration of cellular tissue"
      android:id="@+id/sp9"
      android:layout_width="100dp"
       android:background="@drawable/selector3"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:layout_height="40dp"/>
<Button 
      android:text="Breast swelling"
      android:id="@+id/sp10"
      android:layout_width="100dp"
       android:background="@drawable/selector3"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:layout_height="40dp"/>
   </TableRow>
   <TableRow>
<Button 
      android:text="Coryza"
       android:background="@drawable/selector3"
      android:id="@+id/sp11"
      android:layout_width="100dp"
      android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
      android:layout_height="40dp"/>   
<Button 
android:text="Opthalmia (Inflammation of eyes)"
 android:id="@+id/sp12"
  android:layout_width="100dp"
   android:background="@drawable/selector3"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>   
</TableRow>
<TableRow>
<Button 
android:text="Excoriation"
 android:id="@+id/sp13"
  android:layout_width="100dp"
   android:background="@drawable/selector3"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>
<Button 
android:text="Aphthae"
 android:id="@+id/sp14"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
   android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>   
</TableRow>
<TableRow>
<Button 
android:text="Spasms on the chest"
 android:id="@+id/sp15"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
   android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/> 
   <Button 
android:text="Convulsions"
 android:id="@+id/sp16"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
       android:background="@drawable/selector3"
   android:layout_height="40dp"/>    
</TableRow>
<TableRow>
   <Button 
android:text="Milk Crust"
 android:id="@+id/sp17"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
   android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/> 
   <Button 
android:text="Red gum"
 android:id="@+id/sp18"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
       android:background="@drawable/selector3"
   android:layout_height="40dp"/> 
</TableRow>
<TableRow>   
   <Button 
android:text="Scald Head"
 android:id="@+id/sp19"
  android:layout_width="100dp"
   android:background="@drawable/selector3"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>
   <Button 
android:text="Heat Spots"
 android:id="@+id/sp20"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
   android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>     
</TableRow>
<TableRow>  
  <Button 
android:text="Tetanus"
 android:id="@+id/sp21"
  android:background="@drawable/selector3"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/> 
   <Button 
android:text="Weaning complaints"
 android:id="@+id/sp22"
  android:background="@drawable/selector3"
  android:layout_width="100dp"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/> 
  </TableRow>
  <TableRow>
   
   <Button 
android:text="Erysipelas"
 android:id="@+id/sp23"
  android:layout_width="100dp"
   android:background="@drawable/selector3"
  android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
   android:layout_height="40dp"/>
   <Button 
android:text="Dentition"
 android:id="@+id/sp24"
 android:layout_marginBottom="7dp"
  android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
  android:layout_width="100dp"
   android:layout_height="40dp"/>  
  </TableRow>
  <TableRow>
   
    <Button 
android:text="Bed Wetting"
 android:id="@+id/sp25"
 android:layout_marginBottom="7dp"
  android:background="@drawable/selector3"
      android:layout_marginRight="10dp"
  android:layout_width="100dp"
   android:layout_height="40dp"/>
   
   <Button 
android:text="Worms"
android:layout_marginBottom="7dp"
      android:layout_marginRight="10dp"
       android:background="@drawable/selector3"
 android:id="@+id/sp26"
  android:layout_width="100dp"
   android:layout_height="40dp"/>
     
   </TableRow>                    
</TableLayout>
</ScrollView>

And it looks like this when i run it in the emulator: enter image description here

The top four buttons get completely hidden. Does anyone know why this is happening. Please help. Thanks in advance.

pkk · Accepted Answer · 2011-08-16T20:03:42.777

1

To fix your problem you need to change:

near:

<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_gravity="center"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:scrollbars="horizontal"
android:paddingTop="4.5dp"
android:stretchColumns="**">

from:

android:layout_gravity="center"

to

android:layout_gravity="top"

This will make your TableView be anchored by `ScrollView' from the top and not from the center.

edited Aug 16 '11 at 20:03

answered Aug 16 '11 at 14:51

pkk

3,691
2
21
29

No, this is the image when the scroll bar is touched at the top of the screen. I do not want the layout to fit the screen. The code hides the top portion( top 4 buttons) of the view even when the scroll bar is at the top. – Tejas Tamkahne Aug 16 '11 at 17:11
I copy-pasted your layout to the emulator, and frankly there problem persists, as you explained :) Please excuse my ignorance. The solution is in updated answer. – pkk Aug 16 '11 at 20:04

score 0 · Answer 2 · edited May 23 '17 at 12:04

0

I've ran you code and the problem is the scrollview. If you'd like to fit everything on you screen, you can take a look on this excellent post.

edited May 23 '17 at 12:04

Community

1
1

answered Aug 16 '11 at 14:56

Lior Ohana

3,467
4
34
49

I am not getting it. Please Help. – Tejas Tamkahne Aug 16 '11 at 17:28

Android tablelayout hides the top buttons

2 Answers2