Горизонтальная LinearLayout не отображается правильно на реальном устройстве

Question

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

<LinearLayout
                android:id="@+id/otherLinear"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:baselineAligned="false"
                android:gravity="center"
                android:orientation="horizontal"
                android:visibility="visible">

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical"
                    android:padding="20dp"
                    tools:ignore="UseCompoundDrawables">

                    <TextView
                        android:id="@+id/availableAction"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dp"
                        android:text="@string/add"
                        android:textColor="@color/icon_selected"
                        android:textSize="12sp" />

                    <ImageView
                        android:id="@+id/addFriendsBtn"
                        android:layout_width="50dp"
                        android:layout_height="50dp"
                        android:contentDescription="@string/welcome"
                        android:src="@drawable/ic_icons8_add_user" />

                </LinearLayout>

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical"
                    android:padding="20dp"
                    tools:ignore="UseCompoundDrawables">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dp"
                        android:enabled="false"
                        android:text="@string/report_label"
                        android:textColor="@color/icon_selected"
                        android:textSize="12sp" />

                    <ImageView
                        android:id="@+id/reportBtn"
                        android:layout_width="50dp"
                        android:layout_height="50dp"
                        android:contentDescription="@string/welcome"
                        android:src="@drawable/icons8_spam" />

                </LinearLayout>

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical"
                    android:padding="20dp"
                    tools:ignore="UseCompoundDrawables">

                    <TextView
                        android:id="@+id/followAction"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dp"
                        android:text="@string/follow"
                        android:textColor="@color/icon_selected"
                        android:textSize="12sp" />

                    <ImageView
                        android:id="@+id/followBtn"
                        android:layout_width="50dp"
                        android:layout_height="50dp"
                        android:contentDescription="@string/welcome"
                        android:src="@drawable/ic_follow" />

                </LinearLayout>

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical"
                    android:padding="20dp"
                    tools:ignore="UseCompoundDrawables">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dp"
                        android:enabled="false"
                        android:text="@string/msg"
                        android:textColor="@color/icon_selected"
                        android:textSize="12sp" />

                    <ImageView
                        android:id="@+id/msgBtn"
                        android:layout_width="50dp"
                        android:layout_height="50dp"
                        android:contentDescription="@string/welcome"
                        android:src="@drawable/ic_icons8_weixin_100" />

                </LinearLayout>
            </LinearLayout>

Вот как это выглядит в AS, и это то, что мне нужно.

Но это то, чем я всегда заканчивал по неизвестной причине.

Я также проверяю, было ли это просто из-за длинного просмотра текста, но это не так.В AS представление верное, но на каком-то реальном устройстве я его уже не тестировал.Может кто-то просветить меня, я имею дело с горизонтальным LinearLayout в течение года, делая настройки снова и снова.

Answer 1

Вы используете обтекание для своих текстовых представлений.Если ваш текст будет очень длинным, как и ваш вид, вы можете уменьшить размер текста ваших textViews в XML и надеяться, что текст может уместиться в 1 строку или вы можете использовать autofittextview - "TextView, которыйавтоматически изменяет размер текста, чтобы он идеально вписывался в его границы ".

Вот как вы используете эту библиотеку:

В вашем Gradle добавьте эту реализацию:

 implementation 'me.grantland:autofittextview:0.2.1' 

Теперь добавьте текстовое представление:

   <me.grantland.widget.AutofitTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:textSize="12sp"
        app:minTextSize="8sp" />

Answer 2

Изменения макета зависят от разрешения устройства и размера экрана.Пожалуйста, посетите:

https://developer.android.com/training/multiscreen/screensizes

или:

Вам необходимо добавить этот код в текстовом представлении:

android:autoSizeTextType="uniform"
android:maxLines="1"
android:ellipsize="end"