teclado - scrollview android studio

Cómo ajustar el diseño cuando aparece el teclado virtual

Question

Me gustaría ajustar / cambiar el tamaño del diseño cuando se activa el teclado virtual, como se muestra a continuación:

Antes y después de:

Recursos encontrados en pareja en SO:

1. Cómo mantener visibles todos los campos y textos mientras se muestra el teclado virtual
2. el teclado suave de Android estropea el diseño cuando aparece
3. Ajustar el diseño cuando el teclado está encendido

Pero las preguntas y respuestas son bastante ambiguas, esta es la pregunta con una imagen más clara de lo que quiero.

Requisitos:

• Debería funcionar en el teléfono con cualquier tamaño de pantalla.
• Notó que el espacio de margen / relleno en "FACEBOOK" y "Registrarse en Facebook" ha cambiado antes y después.
• No hay vista de desplazamiento involucrada.

Answer 1

Agregue esta línea en su Manifiesto donde se llama su actividad

android:windowSoftInputMode="adjustPan|adjustResize"

o

puedes agregar esta línea en tu onCreate

getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_VISIBLE|WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);

Answer 2

Android Developer tiene la respuesta correcta, pero el código fuente provisto es muy detallado y no implementa el patrón descrito en el diagrama.

Aquí hay una mejor plantilla:

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

    <RelativeLayout android:layout_width="match_parent"
                    android:layout_height="match_parent">

        <LinearLayout android:layout_width="match_parent"
                      android:layout_height="wrap_content"
                      android:orientation="vertical">

                <!-- stuff to scroll -->

        </LinearLayout>

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true">

            <!-- footer -->

        </FrameLayout>

    </RelativeLayout>

</ScrollView>

Depende de usted decidir qué vistas usará para las partes de "desplazamiento" y "pie de página". También sepa que probablemente tenga que configurar ScrollView s fillViewPort .

Answer 3

En mi caso, ayudó.

main_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="com.livewallpaper.profileview.loginact.Main2Activity">

<TextView
    android:layout_weight="1"
    android:layout_width="match_parent"
    android:text="Title"
    android:gravity="center"
    android:layout_height="0dp" />
<LinearLayout
    android:layout_weight="1"
    android:layout_width="match_parent"
    android:layout_height="0dp">
    <EditText
        android:hint="enter here"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>
<TextView
    android:layout_weight="1"
    android:text="signup for App"
    android:gravity="bottom|center_horizontal"
    android:layout_width="match_parent"
    android:layout_height="0dp" />
</LinearLayout>

Use esto en el archivo de manifest

<activity android:name=".MainActivity"
        android:screenOrientation="portrait"
        android:windowSoftInputMode="adjustResize"/>

¡Ahora la parte más importante! Use un tema como este en Activity o Application tag.

android:theme="@style/AppTheme"

Y el tema se tomó así

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="windowActionModeOverlay">true</item>
</style>

Entonces me estaba perdiendo el tema. Lo que me hizo frustrado todo el día.

Answer 4

Hace unos años, esta pregunta se planteó y "Secret Andro Geni" tiene una buena explicación de base y "tir38" también hizo un buen intento por encontrar la solución completa, pero lamentablemente no hay una solución completa publicada aquí. He pasado un par de horas descifrando cosas y aquí está mi solución completa con una explicación detallada en la parte inferior:

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_above="@+id/mainLayout"
            android:layout_alignParentTop="true"
            android:id="@+id/headerLayout">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:gravity="center_horizontal">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/textView1"
                    android:text="facebook"
                    android:textStyle="bold"
                    android:ellipsize="marquee"
                    android:singleLine="true"
                    android:textAppearance="?android:attr/textAppearanceLarge" />

            </LinearLayout>

        </RelativeLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:id="@+id/mainLayout"
            android:orientation="vertical">

            <EditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/editText1"
                android:ems="10"
                android:hint="Email or Phone"
                android:inputType="textVisiblePassword">

                <requestFocus />
            </EditText>

            <EditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:id="@+id/editText2"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword" />

            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:id="@+id/button1"
                android:text="Log In"
                android:onClick="login" />

        </LinearLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_below="@+id/mainLayout"
            android:id="@+id/footerLayout">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:id="@+id/textView2"
                        android:text="Sign Up for Facebook"
                        android:layout_centerHorizontal="true"
                        android:layout_alignBottom="@+id/helpButton"
                        android:ellipsize="marquee"
                        android:singleLine="true"
                        android:textAppearance="?android:attr/textAppearanceSmall" />

                    <Button
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true"
                        android:id="@+id/helpButton"
                        android:text="/?"
                        android:onClick="help" />

                </RelativeLayout>

            </LinearLayout>

        </RelativeLayout>

    </RelativeLayout>

</ScrollView>

Y en AndroidManifest.xml , no te olvides de configurar:

android:windowSoftInputMode="adjustResize"

en la etiqueta <activity> que desea dicho diseño.

Pensamientos:

Me di cuenta de que RelativeLayout son los diseños que abarcan todo el espacio disponible y luego se redimensionan cuando aparece el teclado.

Y LinearLayout son diseños que no se redimensionan en el proceso de cambio de tamaño.

Es por eso que necesita tener 1 RelativeLayout inmediatamente después de ScrollView para abarcar todo el espacio disponible en la pantalla. Y necesita tener un LinearLayout dentro de RelativeLayout si no, su interior se aplastará cuando ocurra el redimensionamiento. Un buen ejemplo es "headerLayout". Si no hubiera un LinearLayout dentro de ese RelativeLayout texto "facebook" se aplastaría y no se mostraría.

En las fotos de inicio de sesión de "facebook" publicadas en la pregunta, también noté que toda la parte de inicio de sesión (mainLayout) está centrada verticalmente en relación con toda la pantalla, de ahí el atributo:

android:layout_centerVertical="true"

en el diseño de LinearLayout . Y debido a que mainLayout está dentro de LinearLayout esto significa que esa parte no se redimensiona (de nuevo, vea la imagen en cuestión).

Answer 5

Para mí funcionaba con esta línea de código:

getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);

Simplemente colóquelo en el método Crear. ¡Mejor!

Answer 6

Simplemente puede establecer estas opciones en el archivo AndroidManifest.xml.

<activity
    android:name=".YourACtivityName"
    android:windowSoftInputMode="stateVisible|adjustResize">

El uso de adjustPan no es recomendado por Google porque el usuario puede necesitar cerrar el teclado para ver todos los campos de entrada.

Más información: Android App Manifest

Answer 7

Solo agrega

android:windowSoftInputMode="adjustResize"

en su AndroidManifest.xml donde declara esta actividad particular y esto ajustará la opción de cambio de tamaño del diseño.

algún código fuente a continuación para el diseño del diseño

<?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"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp"
        android:text="FaceBook"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="30dp"
        android:ems="10"
        android:hint="username" >

        <requestFocus />
    </EditText>

    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/editText1"
        android:layout_marginTop="20dp"
        android:ems="10"
        android:hint="password" />

    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/editText2"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="18dp"
        android:layout_marginTop="20dp"
        android:text="Log In" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginTop="17dp"
        android:gravity="center"
        android:text="Sign up for facebook"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

Answer 8

Puede funcionar para todo tipo de diseño.

1. agréguelo a su etiqueta de actividad en AndroidManyfest.xml android: windowSoftInputMode = "adjustResize" por ejemplo:

2. agrégalo a tu etiqueta de diseño en activitypage.xml que cambiará su posición. android: fitsSystemWindows = "true" y android: layout_alignParentBottom = "true" por ejemplo: