Как правильно поддерживать несколько размеров экрана
У меня есть пункт рециркуляции с фиксированной высотой, поэтому на устройстве 2560x1440 это выглядит круто, а на 1280x720 это выглядит ужасно. Я прочитал об этом документы Google, и они говорят, что нужно просто использовать "wrap_content", "match_parent" и использовать только dp и sp. Как вы можете видеть ниже, мой cardView имеет высоту 500dp. Я не могу использовать "wrap_content" или "match_parent", потому что мне нужно, чтобы моя кнопка оставалась в центре | внизу cardview. Мне нужно сделать разные значения измерений или что-то подобное, чтобы это исправить проблема? Если вам нужны экраны, чтобы увидеть проблему, пожалуйста, оставьте комментарий, но я думаю, что вы понимаете мою проблему
Мой предмет:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="@android:color/transparent"
android:layout_height="match_parent"
android:layout_margin="@dimen/activity_vertical_margin"
>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="500dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="@+id/ticketQrCodeImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/ticketDescriptionLayout"
/>
<include layout="@layout/view_underline"
android:layout_below="@+id/ticketQrCodeImage"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />
<RelativeLayout
android:id="@+id/ticketDescriptionLayout"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="@dimen/activity_vertical_margin"
>
<ImageView
android:id="@+id/ticketMainImage"
android:layout_width="110dp"
android:scaleType="centerCrop"
android:layout_height="145dp"
/>
<LinearLayout
android:layout_toEndOf="@id/ticketMainImage"
android:layout_marginStart="@dimen/activity_vertical_margin"
android:layout_width="match_parent"
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<TextView
style="@style/TextViewBlackCustom"
android:textSize="@dimen/title_text_size"
android:id="@+id/ticketEventName"
android:text="Иван Дорн"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<RelativeLayout
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/tickets_date"
/>
<TextView
android:id="@+id/ticketDataText"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="07.10 в 21:00"
android:layout_height="wrap_content" />
</RelativeLayout>
<RelativeLayout
android:layout_marginTop="3dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/ticket_place"
/>
<TextView
android:id="@+id/ticketPlace"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="Фан-зона"
android:layout_height="wrap_content" />
</RelativeLayout>
<RelativeLayout
android:layout_marginTop="3dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/ticket_price"
/>
<TextView
android:id="@+id/ticketPriceText"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="500 грн"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
<Button
android:id="@+id/ticketReturnBtn"
style="@style/ButtonCustomRed"
android:text="@string/tickets_return_ticket_button"
android:layout_width="wrap_content"
android:layout_height="35dp"
app:layout_anchorGravity="center|bottom"
app:layout_anchor="@id/cardView"
/>
</android.support.design.widget.CoordinatorLayout>
Что я получаю на небольшом устройстве размера:
Что мне нужно получить:
2 ответа
Вы должны использовать linearLayout
вместо RelativeLayout
чтобы не перепутать предметы. Но я бы порекомендовал вам использовать другой дизайн для маленьких экранов, так как это испортит весь ваш дизайн
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="@android:color/transparent"
android:layout_height="match_parent"
android:layout_margin="@dimen/activity_vertical_margin"
>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="500dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="@+id/ticketQrCodeImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/ticketDescriptionLayout"
/>
<include layout="@layout/view_underline"
android:layout_below="@+id/ticketQrCodeImage"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />
<RelativeLayout
android:id="@+id/ticketDescriptionLayout"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="@dimen/activity_vertical_margin"
>
<ImageView
android:id="@+id/ticketMainImage"
android:layout_width="110dp"
android:scaleType="centerCrop"
android:layout_height="145dp"
/>
<LinearLayout
android:layout_toEndOf="@id/ticketMainImage"
android:layout_marginStart="@dimen/activity_vertical_margin"
android:layout_width="match_parent"
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<TextView
style="@style/TextViewBlackCustom"
android:textSize="@dimen/title_text_size"
android:id="@+id/ticketEventName"
android:text="Иван Дорн"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="5dp">
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_centerVertical="true"
android:text="@string/tickets_date"
/>
<TextView
android:id="@+id/ticketDataText"
style="@style/TextViewBlackCustom"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="07.10 в 21:00"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp">
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/ticket_place"
/>
<TextView
android:id="@+id/ticketPlace"
style="@style/TextViewBlackCustom"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="Фан-зона"
/>
</RelativeLayout>
<RelativeLayout
android:layout_marginTop="3dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/ticket_price"
/>
<TextView
android:id="@+id/ticketPriceText"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:text="500 грн"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
<Button
android:id="@+id/ticketReturnBtn"
style="@style/ButtonCustomRed"
android:text="@string/tickets_return_ticket_button"
android:layout_width="wrap_content"
android:layout_height="35dp"
app:layout_anchorGravity="center|bottom"
app:layout_anchor="@id/cardView"
/>
Используйте ConstraintLayout
Добавьте эту зависимость в свой build.gradle
файл
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Здесь скопируйте следующий код в свой layout.xml
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="@dimen/activity_vertical_margin"
android:background="@android:color/transparent">
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/ticketQrCodeImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/ticketDescriptionLayout" />
<include
layout="@layout/view_underline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/ticketQrCodeImage" />
<RelativeLayout
android:id="@+id/ticketDescriptionLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_margin="@dimen/activity_vertical_margin">
<ImageView
android:id="@+id/ticketMainImage"
android:layout_width="110dp"
android:layout_height="145dp"
android:scaleType="centerCrop" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="@dimen/activity_vertical_margin"
android:layout_toEndOf="@id/ticketMainImage"
android:orientation="vertical">
<TextView
android:id="@+id/ticketEventName"
style="@style/TextViewBlackCustom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Иван Дорн"
android:textSize="@dimen/title_text_size" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp">
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/tickets_date" />
<TextView
android:id="@+id/ticketDataText"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:text="07.10 в 21:00" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp">
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/ticket_place" />
<TextView
android:id="@+id/ticketPlace"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:text="Фан-зона" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp">
<TextView
style="@style/TextViewGrayNotTransCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/ticket_price" />
<TextView
android:id="@+id/ticketPriceText"
style="@style/TextViewBlackCustom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:text="500 грн" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
<Button
android:id="@+id/ticketReturnBtn"
style="@style/ButtonCustomRed"
android:layout_width="0dp"
android:layout_height="35dp"
android:text="@string/tickets_return_ticket_button"
app:layout_constraintTop_toBottomOf="@+id/cardView"
app:layout_constraintBottom_toBottomOf="@id/cardView"
app:layout_constraintLeft_toLeftOf="@id/cardView"
app:layout_constraintRight_toRightOf="@id/cardView" />
</android.support.constraint.ConstraintLayout>