2011-05-19 18 views
16

El diseño que trato de implementar es (creo) bastante simple.botones debajo expanding scrollview

One TextView se expande dependiendo de lo que contenga. Justo debajo hay dos botones (Aceptar/Cancelar).

Puedo hacer que los botones se peguen a la parte inferior de la pantalla y que funcionen bien. Pero me gustaría tener esos botones justo debajo de TextView. He probado un montón de cosas diferentes, pero aquí es mi último diseño:

<?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" 
     > 
    <ScrollView android:id="@+id/Scroll" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:layout_alignParentTop="true" 
      > 
     <TextView 
       android:id="@+id/Text" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       /> 
    </ScrollView> 
    <RelativeLayout android:id="@+id/buttons" 
        android:layout_height="fill_parent" 
        android:layout_width="fill_parent" 
        android:layout_below="@+id/Scroll" 
        android:layout_above="@+id/bottom" 
      > 
     <LinearLayout 
       android:orientation="horizontal" 
       android:layout_height="wrap_content" 
       android:layout_width="fill_parent"> 
      <Button android:id="@+id/ButtonOK" 
        android:layout_height="80dp" 
        android:layout_width="fill_parent" 
        android:text="OK" 
        android:layout_weight="1"/> 
      <Button android:id="@+id/ButtonCancel" 
        android:layout_height="80dp" 
        android:layout_width="fill_parent" 
        android:text="Cancel" 
        android:layout_weight="1"/> 
     </LinearLayout> 
    </RelativeLayout> 
    <LinearLayout android:id="@+id/bottom" 
        android:layout_height="0px" 
        android:layout_width="fill_parent" 
        android:layout_alignParentBottom="true"/> 
</RelativeLayout> 

El LinearLayout vacío al final es un intento (fallido) para evitar que el fin de extenderse más allá de la parte inferior de la pantalla ..

En todo lo que probé, cualquiera de los botones están en la parte inferior de la pantalla o pasarían cuando el TextView es demasiado grande.

Aquí es un boceto de lo que estoy tratando de hacer: enter image description here

+0

Podría ayudar si usted podría proporcionar un boceto de su diseño previsto. –

+0

Pensé que la descripción es lo suficientemente simple ... (segunda línea) – Matthieu

Respuesta

23

¿Es la meta sólo para tener un área de desplazamiento que ocupa toda la página menos la cantidad absorbida por algunos botones en la parte inferior?

Si ese es el caso, se puede utilizar un LinearLayout a nivel externo y hacen uso de los pesos:

<LinearLayout 
    android:layout_height="wrap_content" 
    orientation="vertical"...> 
    <ScrollView 
     android:layout_height="0dp" 
     android:layout_weight="1" 
     .../> 
    <LayoutWithButtons 
     android:layout_height="wrap_content" 
     ..../> 
</LinearLayout> 
+0

Lo siento, creo que no estaba claro ... agregó un boceto ... – Matthieu

+1

Hmm, ¿qué sucede si configura el LinearLayout externo a wrap_content? Si eso no funciona por sí mismo, envuélvalo en otro LinearLayout con un elemento invisible codicioso (altura = 0, peso = 1) debajo de él? –

+0

Aún se expande y empuja los botones fuera de la pantalla ... – Matthieu

0
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:orientation="vertical" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
    > 
    <RelativeLayout android:id="@+id/buttons" 
       android:layout_height="wrap_content" 
       android:layout_width="fill_parent" 
       android:layout_alignParentBottom="true" 
     > 
    <LinearLayout 
      android:orientation="horizontal" 
      android:layout_alignParentTop="true" 
      android:layout_height="wrap_content" 
      android:layout_width="fill_parent"> 
     <Button android:id="@+id/ButtonOK" 
       android:layout_height="80dp" 
       android:layout_width="fill_parent" 
       android:text="OK" 
       android:layout_weight="1"/> 
     <Button android:id="@+id/ButtonCancel" 
       android:layout_height="80dp" 
       android:layout_width="fill_parent" 
       android:text="Cancel" 
       android:layout_weight="1"/> 
    </LinearLayout> 
</RelativeLayout> 
<ScrollView android:id="@+id/ScrollParent" 
      android:layout_above="@id/buttons" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
     > 

<ScrollView android:id="@+id/Scroll" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_alignParentTop="true" 
     > 
    <TextView 
      android:id="@+id/Text" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      /> 
</ScrollView> 
</RelativeLayout> 

creo que sirve

+0

Igual que para Mayra, supongo que mi descripción no fue lo suficientemente buena. Agregué un boceto para hacerlo más explícito. Quiero que los botones estén en la parte inferior solo cuando el campo de texto es lo suficientemente grande ... – Matthieu

+0

y si textView es tan grande ??? sus botones desapareceran, use un ScrollView como padre de todo su diseño, y entonces se asegurará de que los botones estén debajo de textView, ¿eso es lo que quiere? Una cosa más, si su textView se hace cada vez más grande, presione los botones hacia abajo una y otra vez, entonces, ¿cuál es el motivo del scrollView ??? – Houcine

+0

Quiero que los botones siempre estén visibles, ya sea justo debajo del campo de texto cuando no hay mucho texto, o en la parte inferior de la pantalla cuando el campo de texto usa todo el espacio restante. La vista de desplazamiento puede no ser necesaria si el campo de texto es desplazable, pero la idea es desplazarse por el texto cuando sea necesario. – Matthieu

1

Encontré este enlace que realmente me ayudó.

http://www.droidnova.com/layout-technique-static-elements-below-scrollview,123.html

que tienen unas necesidades muy específicas a medida para una solución de teclado - que me exigía para manejar la pantalla y desmontaje del teclado por mi cuenta como un elemento z-capa en un FrameLayout. Utilizo la solución en ese enlace para lograr eso y cambiar el tamaño de scrollView al mismo tiempo. Los botones en la vista de desplazamiento se mueven al ras con la parte inferior de la pantalla para nivelar con la parte superior del teclado.

La clave es tener android: fillViewport = "true" en scrollView. A continuación, establece programáticamente el margen inferior de scrollView y el margen superior del elemento inferior en -height.

Aquí está mi dos métodos que se encargan de que:

private void setMargins_noKeyboard() 
{ 
    ScrollView fieldsScroller = (ScrollView)findViewById(R.id.scroll_fields_view); 
    FrameLayout keyboardFrame = (FrameLayout)findViewById(R.id.keyboard_root); 
    int buttonsKeyboardSize = keyboardFrame.getHeight(); 

    MarginLayoutParams frameParams = (MarginLayoutParams)keyboardFrame.getLayoutParams(); 
    frameParams.setMargins(0, 0, 0, 0); 

    MarginLayoutParams scrollParams = (MarginLayoutParams)fieldsScroller.getLayoutParams(); 
    scrollParams.setMargins(0, 0, 0, 0); 

    keyboardFrame.setLayoutParams(frameParams); 
    fieldsScroller.setLayoutParams(scrollParams); 
} 

private void setMargins_keyboard() 
{ 
    ScrollView fieldsScroller = (ScrollView)findViewById(R.id.scroll_fields_view); 
    FrameLayout keyboardFrame = (FrameLayout)findViewById(R.id.keyboard_root); 
    int buttonsKeyboardSize = keyboardFrame.getHeight(); 

    MarginLayoutParams frameParams = (MarginLayoutParams)keyboardFrame.getLayoutParams(); 
    frameParams.setMargins(0, -buttonsKeyboardSize, 0, 0); 

    MarginLayoutParams scrollParams = (MarginLayoutParams)fieldsScroller.getLayoutParams(); 
    scrollParams.setMargins(0, 0, 0, buttonsKeyboardSize); 

    keyboardFrame.setLayoutParams(frameParams); 
    fieldsScroller.setLayoutParams(scrollParams); 
} 
+0

Después de trabajar con esto un poco más, he encontrado que, aunque la respuesta anterior funciona, re es una mejor solución. Usar un diseño relativo funciona de manera muy confiable sin todos los giros programáticos de esta respuesta. La clave es al menos un elemento que se alinea con la parte superior principal y un elemento que se alinea con la parte inferior principal. El resto de los elementos se alinean con relación a estos dos, la vista de desplazamiento finalmente se intercala entre cualquier cosa que necesite permanecer estacionaria. – alphonzo79

0

este XML está bien para mi aplicación:

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

    <TextView 
     android:id="@+id/nameOfrecipe" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="10sp" 
     android:layout_marginLeft="10sp" 
     android:layout_alignParentTop="true" 
     android:textSize="20sp" 
     android:text="Name of ingredients" /> 

    <TableLayout 
     android:id="@+id/tableOfingredients" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/nameOfrecipe" 
     android:layout_marginTop="40sp" 
     android:layout_marginLeft="10sp" 
     android:layout_marginRight="10sp" > 
    </TableLayout> 
    <RelativeLayout android:id="@+id/l" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/tableOfingredients" 
     >      
    <Button 
     android:id="@+id/addDirectionsB" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true"  
     android:text="Add..." /> 

    <Button 
     android:id="@+id/cancelDirectionsB" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_toRightOf="@id/addDirectionsB" 
     android:text="Cancel" /> 

     <ScrollView 
     android:id="@+id/directionsScroll" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_above="@id/addDirectionsB">   
      <EditText 
       android:id="@+id/directionsET"  
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:inputType="textMultiLine" > 
       <requestFocus /> 
      </EditText> 
    </ScrollView> 
    </RelativeLayout> 
</RelativeLayout> 
Cuestiones relacionadas