Как сохранить согласованность с XML-элементами на разных экранах?

Question

Я пытаюсь создать свои собственные кнопки для приложения калькулятора.

Моя проблема в том, что мне трудно поддерживать все размеры экрана.

В основном у меня есть несколько кнопок, созданных следующим образом

<Button android:text="Button" android:id="@+id/button1"
    android:background="@drawable/test"
    android:layout_height="60dip" android:layout_width="60dip" android:layout_margin="5dip"></Button>

Мой фон - это отрисовываемый XML

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Bottom 2dp Shadow -->
<item>
    <shape android:shape="rectangle">
        <gradient android:startColor="#E0E0E0" 
        android:endColor="#373737"
            android:angle="315" />
        <corners android:radius="20dip" />
    </shape>
</item>
<!-- White Top color -->
<item android:top="5dip" android:left="5dip" android:right="5dip"
    android:bottom="5dip">
    <shape android:shape="rectangle">
        <gradient android:startColor="#9E9E9E" android:endColor="#C5C5C5"
            android:angle="270" />
        <corners android:radius="20dip" />
    </shape>
</item>

В основном фонс закругленными углами и чем-то похожим на скос и несколькими градиентами, чтобы он выглядел красиво!

на 3.2 HVGA кнопки имеют правильный размер

Но когда я смотрю на кнопкив 3.7 FWVGA соотношение сторон теряется, и размер там равен размеру 3.2, но поскольку на этом экране больше пикселей для работы, изображения имеют неправильный размер.

Есть ли способ сохранить согласованностьв этом случае???

Answer 1

Проблема

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

Здесь вы используете dp юнитов, что абсолютно нормально и является хорошей практикой при определении макетов. Но в этом случае он говорит макету «эта вещь имеет фиксированный размер XX dp» (вы можете думать о dp как о фиксированной единице, фиксированное количество определяется устройством, отображающим макет), Вы не хотите фиксированный размер. Вы хотите, чтобы кнопки растягивались динамически.

Решение

Чтобы обеспечить решение для вышеприведенного макета: Вы можете использовать LinearLayout и его атрибут layout_weight. Вот несколько коротких (неполных) примеров кода, иллюстрирующих принцип:

<LinearLayout android:orientation="horizontal"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content">

    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />

</LinearLayout>

Что здесь происходит?

Сначала мы создаем внешний LinearLayout, который заполняет всю родительскую ширину (= всю ширину экрана) и регулирует его высоту в зависимости от содержимого. Стандартный материал.

Затем мы добавляем 4 кнопки. Соответствующий кусок здесь layout_weight. Это говорит каждой кнопке «заполнить доступное пространство как можно больше». Так как каждый пытается растянуть сейчас, мы должны определить, сколько места занимает каждая кнопка. Это число, данное layout_weight. Здесь у нас есть равное число один для каждой кнопки. Это означает, что каждая кнопка будет такого же размера, как и любая другая. Итак, как макет определяет, сколько места это? Он вычисляет общий вес своих детей, который здесь равен 4, и дает каждому ребенку пространство в соответствии с отношением child_weight / total_weight. Таким образом, каждая кнопка занимает 1/4 ширины. (Вы также можете назначить любой другой номер, если вы дадите каждой кнопке вес 3, каждая кнопка получит 3/12 ширины, что по-прежнему составляет 1/4 в соответствии с математикой :))

Остается один вопрос: почему layout_width="0dp"? Это только предотвращает некоторые ненужные внутренние вычисления внутри, насколько я знаю. Все, что вам нужно знать, это использовать 0dp для измерения масштабирования при использовании атрибута layout_weight. Вы можете немного изучить, если хотите узнать больше.

Образцы

Вот два скриншота этого на практике:

2,7 "QVGA

3,7 "FWVGA

Answer 2

Вы можете использовать «квалификаторы конфигурации» и объявлять различные макеты в зависимости от разрешения, просто создайте подпапки, как это:

drawable-mdpi
drawable-hdpi

Так вы можете лучше выровнять по плотности.будет расширять класс «Button» и создавать собственный виджет, который выравнивается в соответствии с размером экрана, вызывая getWindowManager (). getDefaultDisplay () и изменяя его размер во время метода «onCreate ()».