Как правильно создать макет, чтобы dsplay правильно отображался на разных экранах?

Question

Я занимаюсь разработкой приложения для Android. В моем приложении у меня есть макет таблицы для создания имитации клавиатуры. Каждое письмо имеет свое изображение, для его отображения. Для обтекания строки изображения до текущего размера экрана я использую параметр "android: layout_height =" wrap_content "", но он не подгоняет изображения под размер экрана.

Вот фрагмент моего макета:

<TableLayout android:id="@+id/keyBoard"
    android:layout_height="wrap_content"
        android:layout_width="wrap_content" android:layout_gravity="center"
        android:stretchColumns="*">
    <TableRow android:id="@+id/action_buttons"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" android:gravity="center_horizontal"
        android:paddingBottom="5px">
        <ImageView android:id="@+id/let_q" android:src="@drawable/q"
            android:padding="1px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_w" android:src="@drawable/w"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_e" android:src="@drawable/e"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_r" android:src="@drawable/r"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_t" android:src="@drawable/t"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_y" android:src="@drawable/y"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_u" android:src="@drawable/u"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_i" android:src="@drawable/i"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_o" android:src="@drawable/o"
            android:padding="3px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_p" android:src="@drawable/p"
            android:padding="1px" android:layout_gravity="center" />
    </TableRow>
    <TableRow android:id="@+id/action_buttons"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:gravity="center_horizontal" android:paddingBottom="5px">
        <ImageView android:id="@+id/let_a" android:src="@drawable/a"
            android:padding="5px" />
        <ImageView android:id="@+id/let_s" android:src="@drawable/s"
            android:padding="5px" />
        <ImageView android:id="@+id/let_d" android:src="@drawable/d"
            android:padding="5px" />
        <ImageView android:id="@+id/let_f" android:src="@drawable/f"
            android:padding="5px" />
        <ImageView android:id="@+id/let_g" android:src="@drawable/g"
            android:padding="5px" />
        <ImageView android:id="@+id/let_h" android:src="@drawable/h"
            android:padding="5px" />
        <ImageView android:id="@+id/let_j" android:src="@drawable/j"
            android:padding="5px" />
        <ImageView android:id="@+id/let_k" android:src="@drawable/k"
            android:padding="5px" />
        <ImageView android:id="@+id/let_l" android:src="@drawable/l"
            android:padding="5px" />
    </TableRow>
    <TableRow android:id="@+id/action_buttons"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:gravity="center_horizontal" android:paddingBottom="5px">
        <ImageView android:id="@+id/let_z" android:src="@drawable/z"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_x" android:src="@drawable/x"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_c" android:src="@drawable/c"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_v" android:src="@drawable/v"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_b" android:src="@drawable/b"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_n" android:src="@drawable/n"
            android:padding="5px" android:layout_gravity="center" />
        <ImageView android:id="@+id/let_m" android:src="@drawable/m"
            android:padding="5px" android:layout_gravity="center" />
    </TableRow>
</TableLayout>

Что я делаю не так? Потому что я получаю этот результат для некоторых телефонов: Вид порта:

А для Land view:

Answer 1

Мой способ создания макетов заключается в предоставлении ширины и высоты в «dip», а не в «px».

А также вам может понадобиться использовать «Relative Layout», что было бы удобно

Answer 2

Похоже, изображения, которые вы используете, имеют большой размер.Итак, wrap_content не дает ожидаемого результата.

Вам необходимо изменить размер изображения алфавитов, напр.если текущее изображение буквы Q 180 х 130 пикселей, измените его размер до меньшего.Допустим, 140 X 80 пикселей.

Попробуйте его в свой код.Если вы измените размер изображения и примените wrap_content, то это сработает!Дайте мне знать, если существует какая-либо проблема.Спасибо.