web-dev-qa-db-fra.com

Android Mise en page avec ListView et boutons

D'accord, cette mise en page spécifique m'agace. Et n'arrive pas à trouver le moyen d'avoir un listView, avec une rangée de boutons en bas pour que la liste ne s'étende pas au-dessus des boutons, de sorte que les boutons sont toujours accrochés au bas de l'écran. Voici ce que je veux:

lien ImageShack mort supprimé

Il semble que cela devrait être si facile, mais tout ce que j'ai essayé a échoué. De l'aide?

Voici mon code actuel:

    RelativeLayout container = new RelativeLayout(this);
    container.setLayoutParams(new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));

    //** Add LinearLayout with button(s)

    LinearLayout buttons = new LinearLayout(this);

    RelativeLayout.LayoutParams bottomNavParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
    bottomNavParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
    bottomNavParams.addRule(RelativeLayout.CENTER_HORIZONTAL);
    buttons.setLayoutParams(bottomNavParams);


    ImageButton newLayer = new ImageButton(this);
    newLayer.setImageResource(R.drawable.newlayer);
    newLayer.setLayoutParams(new LinearLayout.LayoutParams(45, LayoutParams.FILL_PARENT));
    buttons.addView(newLayer);

    container.addView(buttons);

    //** Add ListView

    layerview = new ListView(this);

    RelativeLayout.LayoutParams listParams = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
    listParams.addRule(RelativeLayout.ABOVE, buttons.getId());

    layerview.setLayoutParams(listParams);

    container.addView(layerview);
javaandroidlistviewlayout
101
Kleptine

Je pense que c'est ce que vous recherchez.

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

    <Button Android:layout_width="fill_parent"
        Android:layout_height="wrap_content" Android:id="@+id/testbutton"
        Android:text="@string/hello" Android:layout_alignParentBottom="true" />

    <ListView Android:layout_width="fill_parent"
        Android:layout_height="fill_parent" Android:id="@+id/list"
        Android:layout_alignParentTop="true" Android:layout_above="@id/testbutton" />

</RelativeLayout>
135
lars

J'ai eu le même problème pendant des siècles.

La solution pour garder le ListView au-dessus des boutons, mais l'empêcher de les recouvrir lorsque la liste est longue, consiste à définir Android: layout_weight = "1.0" sur le ListView. Laissez le layout_weight sur les boutons non défini afin qu'ils restent à leur taille naturelle, sinon les boutons seront mis à l'échelle. Cela fonctionne avec LinearLayout.

Il y a un exemple dans Android ApiDemos: ApiDemos/res/layout/linear_layout_9.xml)

57
David Ingram

Je cherchais simplement une réponse à cette question et ce fut l'un des premiers résultats. J'ai l'impression que toutes les réponses, y compris celle qui est actuellement choisie comme "meilleure réponse", ne traitent pas du problème sur lequel on se pose. Le problème posé est qu’il existe un chevauchement des deux composants Button et ListView dans la mesure où ListView occupe tout l’écran et que le bouton flotte visuellement au-dessus (devant du) ListView (blocage de la vue/accès du dernier élément du ListView)

Sur la base des réponses que j'ai vues ici et sur d'autres forums, j'ai finalement trouvé une solution pour résoudre ce problème.

À l'origine, j'avais:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:Android="http://schemas.Android.com/apk/res/Android"
  Android:orientation="vertical"
  Android:layout_width="fill_parent"
  Android:layout_height="fill_parent"
  Android:background="#FF394952">

  <ListView
    Android:id="@+id/game_list"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentTop="true"
    />

  <LinearLayout
    Android:orientation="horizontal"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentBottom="true"
    style="@Android:style/ButtonBar">

    <Button
      Android:id="@+id/new_game"
      Android:layout_width="fill_parent"
      Android:layout_height="wrap_content"
      Android:text="@string/new_game"
      Android:textColor="#FFFFFFFF"
      Android:background="@drawable/button_background" />
  </LinearLayout>

</RelativeLayout>

Notez l'utilisation de RelativeLayout en tant que nœud racine.

Ceci est la version finale dans laquelle le bouton ne chevauche pas le ListView:

<?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"
  Android:background="#FF394952">

  <ListView
    Android:id="@+id/game_list"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentTop="true"
    Android:layout_weight="1.0" />

  <LinearLayout
    Android:orientation="horizontal"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentBottom="true"
    style="@Android:style/ButtonBar">

    <Button
      Android:id="@+id/new_game"
      Android:layout_width="fill_parent"
      Android:layout_height="wrap_content"
      Android:text="@string/new_game"
      Android:textColor="#FFFFFFFF"
      Android:background="@drawable/button_background" />
  </LinearLayout>

</LinearLayout>

Il n'y a que deux différences. Premièrement, je suis passé à l’utilisation de LinearLayout. Cela aidera avec le bit suivant, qui ajoutait Android:layout_weight à mon ListView

J'espère que ça aide.

20
Dallas

La meilleure façon est une disposition relative qui définit les boutons sous la vue liste. Dans cet exemple, les boutons ont également une disposition linéaire, car il est plus facile de les placer côte à côte à la même taille.

<RelativeLayout Android:id="@+id/RelativeLayout01" 
Android:layout_width="fill_parent" 
Android:layout_height="fill_parent">

<ListView Android:id="@+id/ListView01" 
Android:layout_alignParentTop="true"
Android:layout_width="fill_parent" 
Android:layout_height="fill_parent">
</ListView>

<LinearLayout Android:id="@+id/LinearLayout01" 
Android:layout_below="@+id/ListView01" 
Android:layout_width="fill_parent" 
Android:layout_height="wrap_content" 
Android:layout_alignParentBottom="true">
<Button Android:id="@+id/ButtonJoin" 
Android:text="Join"
Android:layout_width="fill_parent" 
Android:layout_height="wrap_content"
Android:layout_weight="1"
Android:layout_alignParentBottom="true">
</Button>
<Button Android:id="@+id/ButtonJoin" 
Android:layout_alignRight="@id/ButtonCancel" 
Android:layout_width="fill_parent" 
Android:layout_height="wrap_content"
Android:layout_weight="1"
Android:text="Cancel"
Android:layout_alignParentBottom="true">
</Button>
</LinearLayout>

</RelativeLayout>
8
Patrick Kafka

Je sais que ce message est plutôt ancien, mais, pour répondre à la question de l'affiche originale, le code qui ne fonctionnait pas était Button.getId () renvoie -1. Si vous voulez faire cela, vous devez configurer quelque chose comme les boutons d'appel.setId (10). Si vous faites cela, le code fonctionne parfaitement.

1
Doo Dah

ça devrait marcher. pour que les boutons se trouvent également au-dessus de la liste, placez-les dans une autre disposition linéaire.

<LinearLayout> main container // vertical

<LinearLayout> scrollview must be contained in a linear layout //vertical - height to fill parent

    <ScrollView> set the height of this to fill parent

        <ListView> will be contained in the scrollview
        </ListView>

    </ScrollView>

</LinearLayout>

<LinearLayout> //horizontal - height to wrap content

<Button>

</Button>

</LinearLayout>

</LinearLayout>
0
Rhys

la solution la plus simple consiste à créer deux mises en page linéaires, l’une avec le bouton et l’autre avec la vue Liste (renvoyez le contenu sur la hauteur du bouton et faites correspondre le parent à la hauteur de la liste). alors faites seulement une vue de défilement sur la disposition avec la vue liste et la disposition des boutons sera ignorée. J'espère que ça aide, désolé je n'avais pas envie d'écrire le code.

0
Pete