Comment mettre en forme un formulaire qui défile dans Android SDK?

Question

J'ai besoin d'un formulaire utilisateur plus grand que l'écran. La mise en page consiste en une "zone de titre" fixe, le formulaire (dans une vue de défilement éventuellement) et un bouton en bas. J'ai créé trois mises en page et la mise en page du milieu est un ScrollView avec un LinearLayout orienté verticalement. Malheureusement, la forme pousse les boutons de l'écran ?!

Existe-t-il un exemple simple pour cela? Je suppose que je peux utiliser un ListView, mais je pense que mon ScrollView est plus facile à gérer. Voici ma mise en page ...

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    > 

    <!-- Title Area on top --> 
    <LinearLayout 
    android:id="@+id/layout_form" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    > 
    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
    > 
     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="0dip" 
      android:layout_marginBottom="0dip" 
      android:paddingTop="20dip" 
      android:paddingBottom="20dip" 
      android:paddingLeft="5dip" 
      android:paddingRight="10dip" 
      android:src="@drawable/logo" 
      android:layout_gravity="center" 
      android:layout_weight="1" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:layout_weight="2" 
      android:layout_marginTop="0dip" 
      android:layout_marginBottom="0dip" 
      android:layout_marginLeft="4dip" 
      android:layout_marginRight="4dip" 
      android:text="@string/title_create" 
      /> 
    </LinearLayout> 

    <!-- Form entry on top --> 

     <ScrollView 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:fillViewport="true" 
      android:clipChildren="true" 
      > 
      <LinearLayout 
       android:orientation="vertical" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
      > 
     <TextView 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_horizontal" 
      android:layout_marginLeft="8dip" 
      android:layout_marginRight="8dip" 
      android:text="@string/label_field_one" 
      /> 
     <EditText 
      android:id="@+id/edit_field_one" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:singleLine="true" 
      android:layout_marginLeft="10dip" 
      android:layout_marginRight="10dip" 
      android:hint="@string/hint_field_one" 
      /> 
     <TextView 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_horizontal" 
      android:layout_marginLeft="8dip" 
      android:layout_marginRight="8dip" 
      android:text="@string/label_field_two" 
      /> 
     <EditText 
      android:id="@+id/edit_field_two" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:singleLine="true" 
      android:layout_marginLeft="10dip" 
      android:layout_marginRight="10dip" 
      android:hint="@string/hint_field_two" 
      /> 

      <!-- Repeat label-text and edit-text until done ... --> 

      </LinearLayout> 
      </ScrollView> 


    <!-- "spring" between form and wizard buttons. --> 
    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 
    /> 

    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="left" 
     android:layout_weight="2" 
     > 
     <Button 
      android:id="@+id/btn_submit" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="right" 
      android:layout_weight="1" 
      android:text="@string/button_submit" 
     /> 
    </LinearLayout> 
     </LinearLayout> 


</LinearLayout> 

Answer 1

Si je comprends bien, c'est quelque chose qui est assez élevé souvent - ayant un en-tête et pied de page fixe, et remplir le milieu avec tout (dans votre cas, un ScrollView). Est-ce ce que vous cherchez? Si oui, vous aurez envie d'essayer quelque chose comme ci-dessous:

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    > 
    <LinearLayout 
     android:id="@+id/header" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     > 
     //.....stuff here 
    </LinearLayout> 
    <LinearLayout 
     android:id="@+id/footer" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     > 
     //.....stuff here 
    </LinearLayout> 
    <ScrollView 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_above="@id/footer" 
     android:layout_below="@id/header" 
     > 
     //......stuff here 
    </ScrollView> 
</RelativeLayout> 

Fondamentalement, vous définissez un en-tête, lui donner une hauteur fixe (wrap_content dans ce cas), et réglez d'alignement sur la partie supérieure du parent (le RelativeLayout). Ensuite, faites de même pour le bas de page, en l'alignant sur le bas du parent. Vous pouvez substituer juste un bouton pour le LinearLayout pour le pied de page, pour votre situation, ou vous pouvez simplement placer le bouton à l'intérieur du LinearLayout. Il est probablement légèrement plus rapide de gonfler la mise en page sans LinearLayout supplémentaire. Mais de toute façon, ensuite, définissez votre formulaire, la zone de défilement. Définissez la hauteur à fill_parent, et indiquez-le au-dessus du pied de page, et sous l'en-tête. Cela l'amènera à occuper tout l'espace restant entre l'en-tête et le pied de page.