Редактирование текста на экране с помощью GridLayout

#android #android-layout #textfield #android-gridlayout

#Android #android-макет #текстовое поле #android-gridlayout

Вопрос:

У меня есть следующий макет, в котором редактируемые тексты исчезают с экрана, по-видимому, без причины. Я пытался найти похожую проблему, но не смог. Это должно быть легко, но я пробовал много вещей, но безуспешно.

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <GridLayout
        android:id="@ id/gridLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"
        android:columnCount="2"
        android:orientation="horizontal" >

        <TextView
            android:id="@ id/titleTextView"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:paddingBottom="10dp"
            android:paddingTop="10dp"
            android:text="dsgsdgsd"
            android:textColor="@color/red"
            android:textStyle="bold" />

        <View
            android:layout_width="fill_parent"
            android:layout_height="2dip"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:background="@color/red" />

        <TextView
            android:id="@ id/textTitle"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:paddingLeft="15dp"
            android:text="Title"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editTitle"
            android:layout_gravity="right"
            android:inputType="text">
        </EditText>

        <View
            android:layout_height="1dip"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:background="#E6E6E6" />

        <TextView
            android:id="@ id/textCategory"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:gravity="left"
            android:paddingLeft="15dp"
            android:text="Category"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editCategory"
            android:layout_width="225dp"
            android:layout_gravity="right"
            android:inputType="text" />            

        <Button
            android:id="@ id/btnCreateAccount"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="#ffffff"
            android:onClick="createExpense"
            android:text="Done"
            android:textColor="@color/red" />
    </GridLayout>
  

Ответ №1:

Проверьте обновленный код:

Вам не хватало некоторых атрибутов width, height, и вы использовали match_parent в более раннем элементе, таком как View, что не позволило любому последующему элементу занять место на экране.

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <GridLayout
        android:id="@ id/gridLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"
        android:columnCount="2"
        android:orientation="horizontal" >

        <TextView
            android:id="@ id/titleTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:paddingBottom="10dp"
            android:paddingTop="10dp"
            android:text="dsgsdgsd"
            android:textColor="@color/red"
            android:textStyle="bold" />

        <View
            android:layout_width="wrap_content"
            android:layout_height="2dip"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:background="@color/red" />

        <TextView
            android:id="@ id/textTitle"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:paddingLeft="15dp"
            android:text="Title"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editTitle"
            android:layout_gravity="right"
            android:inputType="text" >
        </EditText>

        <View
            android:layout_width="wrap_content"
            android:layout_height="1dip"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:background="#E6E6E6" />

        <TextView
            android:id="@ id/textCategory"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:gravity="left"
            android:paddingLeft="15dp"
            android:text="Category"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editCategory"
            android:layout_width="225dp"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:inputType="text" />

        <Button
            android:id="@ id/btnCreateAccount"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="#ffffff"
            android:onClick="createExpense"
            android:text="Done"
            android:textColor="@color/red" />
    </GridLayout>

</LinearLayout>
  

Вывод без цвета и фона, поскольку он выдает ошибку из-за отсутствия ресурса, является:

введите описание изображения здесь

Здесь вы можете увидеть оба ваших редактируемых текста на экране.

Комментарии:

1. отлично, это сработало! Как я могу разместить кнопку «Готово» в центре? Layout_gravity = center не работает, как это видно на вашей картинке.

2. @Rafag это связано с его паретным расположением в сетке, если вы просто уберете эту кнопку из макета сетки, она будет располагаться по центру 🙂

Ответ №2:

попробуйте это, может быть, это поможет вам

 <GridLayout
    android:id="@ id/gridLayout"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    android:columnCount="2"
    android:orientation="horizontal" >

    <TextView
        android:id="@ id/titleTextView"
        android:layout_columnSpan="2"
        android:layout_gravity="left"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:paddingBottom="10dp"
        android:paddingTop="10dp"
        android:text="dsgsdgsd"
        android:textColor="@color/red"
        android:textStyle="bold" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="2dip"
        android:layout_columnSpan="2"
        android:layout_gravity="left"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:background="@color/red" />

    <TableRow android:id="@ id/tableRow1" >

        <TextView
            android:id="@ id/textTitle"
            android:background="#ffffff"
            android:paddingLeft="15dp"
            android:text="Title"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editTitle"
            android:layout_width="250dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/activity_horizontal_margin"
            android:layout_weight="1"
            android:inputType="text" >

            <requestFocus />
        </EditText>

    </TableRow>

    <View
        android:layout_height="1dip"
        android:layout_columnSpan="2"
        android:layout_gravity="left"
        android:background="#E6E6E6" />

    <TextView
        android:id="@ id/textCategory"
        android:layout_gravity="left"
        android:background="#ffffff"
        android:gravity="left"
        android:paddingLeft="15dp"
        android:text="Category"
        android:textColor="@color/grey" />

    <EditText
        android:id="@ id/editCategory"
        android:layout_width="225dp"
        android:layout_gravity="right"
        android:inputType="text" />            

    <Button
        android:id="@ id/btnCreateAccount"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#ffffff"
        android:onClick="createExpense"
        android:text="Done"
        android:textColor="@color/red" />
</GridLayout>
  

Ответ №3:

Измените свою часть EditText на эту:

 <EditText
        android:id="@ id/editTitle"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_column="0"
        android:layout_gravity="center_horizontal|top"
        android:layout_row="4"
        android:ems="10"
        android:inputType="text" />
  

Ответ №4:

Попробуйте этот способ, надеюсь, это поможет вам решить вашу проблему.

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <GridLayout
        android:id="@ id/gridLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"
        android:columnCount="2"
        android:orientation="horizontal" >

        <TextView
            android:id="@ id/titleTextView"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:paddingBottom="10dp"
            android:layout_row="0"
            android:paddingTop="10dp"
            android:text="dsgsdgsd"
            android:textColor="@color/red"
            android:textStyle="bold" />

        <View
            android:layout_width="match_parent"
            android:layout_height="2dp"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_marginLeft="20dp"
            android:layout_row="1"
            android:layout_marginRight="20dp"
            android:background="@color/red" />

        <TextView
            android:id="@ id/textTitle"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:paddingLeft="15dp"
            android:layout_row="2"
            android:layout_column="0"
            android:text="Title"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editTitle"
            android:layout_width="225dp"
            android:layout_gravity="right"
            android:layout_row="2"
            android:layout_column="1"
            android:inputType="text">
        </EditText>

        <View
            android:layout_height="2dp"
            android:layout_columnSpan="2"
            android:layout_gravity="left"
            android:layout_row="3"
            android:background="#E6E6E6" />

        <TextView
            android:id="@ id/textCategory"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:gravity="left"
            android:layout_row="4"
            android:layout_column="0"
            android:paddingLeft="15dp"
            android:text="Category"
            android:textColor="@color/grey" />

        <EditText
            android:id="@ id/editCategory"
            android:layout_width="225dp"
            android:layout_column="1"
            android:layout_gravity="right"
            android:layout_row="4"
            android:inputType="text" />

        <Button
            android:id="@ id/btnCreateAccount"
            android:layout_width="match_parent"
            android:layout_gravity="center"
            android:background="#ffffff"
            android:layout_row="5"
            android:layout_columnSpan="2"
            android:onClick="createExpense"
            android:text="Done"
            android:textColor="@color/red" />
    </GridLayout>

</LinearLayout>
  

Ответ №5:

В качестве общего комментария, вы никогда не сможете использовать wrap_content with EditText , он всегда будет принимать размер содержимого и не соблюдать никаких других границ, поэтому пользователь всегда может испортить макет, просто набрав лишний текст. Мне потребовалась целая вечность, чтобы осознать это очень простое наблюдение о том, как Android расставляет приоритеты в различных ограничениях.

В этом контексте, когда GridLayout решает, что он не может вместить столбец в пределах своих родительских границ, он сдается и выдает ошибочный результат, поэтому, как правило, мы привязываем GridLayout по ширине экрана, первый столбец, который превышает ширину, будет удален с экрана.

Если вы хотите иметь большие и маленькие поля ввода, соответствующие размерам данных, самый простой способ — определить фиктивные столбцы с весами, которые можно использовать для того, чтобы занимать место на экране, или распределять для полей большего размера.