Макет вкладок обрезается снизу - PullRequest
3 голосов
/ 05 августа 2020

Я использую API 16, и на моем основном экране у меня есть макет вкладок с двумя вкладками. Одна из вкладок имеет следующий вид:

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:layout_marginLeft="24dp"
        android:layout_marginRight="24dp">

        <LinearLayout
            android:id="@+id/login_email_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical">

            <ImageView
                android:id="@+id/login_email_icon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/ic_email_black_24dp"
                android:tint="@color/lightGrayColor"
                android:layout_marginRight="5dp"
                android:layout_marginEnd="5dp" />

            <EditText
                android:id="@+id/login_email_edit"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:theme="@style/managerDetailsEditTextStyle"
                android:inputType="textEmailAddress"
                android:hint="@string/email"
                android:autofillHints="@string/email" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/login_password_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/login_email_layout"
            android:gravity="center_vertical">

            <ImageView
                android:id="@+id/login_password_icon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/ic_lock_black_24dp"
                android:tint="@color/lightGrayColor"
                android:layout_marginRight="5dp"
                android:layout_marginEnd="5dp" />

            <EditText
                android:id="@+id/login_password_edit"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:theme="@style/managerDetailsEditTextStyle"
                android:inputType="textPassword"
                android:hint="@string/password"
                android:autofillHints="@string/password" />
        </LinearLayout>

        <Button
            android:id="@+id/login_sign_in_button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/primaryColor"
            android:textColor="@android:color/white"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_marginTop="24dp"
            android:layout_below="@id/login_password_layout"
            android:text="@string/action_login" />

        <TextView
            android:id="@+id/login_recover_text"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="24dp"
            android:layout_below="@id/login_sign_in_button"
            android:textColor="?android:textColorTertiary"
            android:text="@string/forgot_password"
            android:layout_centerHorizontal="true"
            android:gravity="center_horizontal"
            android:textSize="16sp"
            android:textIsSelectable="true" />

        <View
            android:id="@+id/login_tile_divider"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_below="@id/login_recover_text"
            android:layout_gravity="center"
            android:layout_centerHorizontal="true"
            android:gravity="center_horizontal"
            android:layout_marginTop="24dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:background="@color/lightGrayColor" />

        <Button
            android:id="@+id/login_sign_up_button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/primaryColor"
            android:textColor="@android:color/white"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_marginTop="24dp"
            android:layout_below="@id/login_tile_divider"
            android:text="@string/action_sign_up" />
    </RelativeLayout>
</ScrollView>

Основной макет с раскладкой вкладок:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:background="@drawable/main_background"
    android:layout_margin="5dp">

    <!-- Main title -->
    <TextView
        android:id="@+id/main_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/primaryDarkColor"
        android:gravity="center"
        android:singleLine="true"
        android:text="@string/app_name"
        android:layout_marginTop="60dp"
        android:textSize="60sp"
        android:textStyle="bold" />

    <!-- Main subtitle -->
    <TextView
        android:id="@+id/main_subtitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/primaryDarkColor"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:singleLine="true"
        android:text="@string/app_subtitle"
        android:layout_below="@id/main_title"
        android:textSize="22sp"
        android:textStyle="bold" />

    <!-- Tabs layout -->
    <LinearLayout
        android:id="@+id/main_tabs_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="25dp"
        android:layout_marginBottom="25dp"
        android:layout_below="@id/main_subtitle"
        android:layout_centerVertical="true">

        <androidx.cardview.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp">

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

                <com.google.android.material.appbar.AppBarLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

                    <com.google.android.material.tabs.TabLayout
                        android:id="@+id/main_login_tabs"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:tabMode="fixed"
                        app:tabTextColor="@color/transparentWhite"
                        app:tabBackground="@color/primaryColor"
                        app:tabIndicatorColor="@android:color/white"
                        app:tabIndicatorHeight="4dp"
                        app:tabSelectedTextColor="@android:color/white"
                        app:tabGravity="fill" />
                </com.google.android.material.appbar.AppBarLayout>

                <com.technion.saderota.utilities.CustomViewPager
                    android:id="@+id/main_login_view_pager"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

            </LinearLayout>

        </androidx.cardview.widget.CardView>

    </LinearLayout>

</RelativeLayout>

По какой-то причине на некоторых устройствах он вырезает нижнюю часть экрана.

Я подозреваю, что это как-то связано с тем фактом, что я центрировал раскладку вкладок по центру экрана. Я пробовал несколько способов решить эту проблему, но не мог понять. Как исправить?

1 Ответ

0 голосов
/ 18 августа 2020

Ваш контент просто слишком велик для экрана. «пустое» неиспользуемое пространство занято полями здесь:

   <LinearLayout
        android:id="@+id/main_tabs_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="25dp"
        android:layout_marginBottom="25dp"
        android:layout_below="@id/main_subtitle"
        android:layout_centerVertical="true">

и здесь:

  <androidx.cardview.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp">

Вы можете либо уменьшить поля, чтобы дать представлениям больше места

Или вы можете сделать свой main_tabs_layout a ScrollView, чтобы его можно было прокручивать, если места недостаточно.

...