Как настроить вид прокрутки, который расширяется за счет фонового изображения на разных устройствах? - PullRequest
Новая
       28

Как настроить вид прокрутки, который расширяется за счет фонового изображения на разных устройствах?

0 голосов
/ 29 апреля 2019

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

Примером будет

LinearLayout ->

ScrollView ->

LinearLayout-> (настройка фонового изображения здесь)

Так что, если фон имеет очень высокое разрешение, он сильно расширится, поэтому я изменил размер фона, чтобы он мог работать на большинстве устройств, так как расширение уменьшается, но все же в устройствах с разными размерами экрана есть много различий в размерах. Таким образом, проблема все еще сохраняется, как правильно решить эту проблему?

Как выглядит экран с фоновым изображением с разрешением (729 * 1296) Фоновое изображение (729 * 1296)

После изменения размера фонового изображения с разрешением (400 * 711) и запуска на устройстве xxhdpi это выглядит следующим образом. Фоновое изображение (400 * 711)

Так что теперь у меня есть небольшой свиток. Это хорошо, но применение на разных устройствах может быть сложным, и есть разница в размерах макета.

То, что я хочу на всех устройствах, это выглядеть так. Фоновое изображение (что я хочу)

Без изменения размера фонового изображения, я хочу, чтобы мой макет выглядел так на всех устройствах, только 3 внутренних макета (фото, аудио, видео) должны быть видимыми, остальные должны прокручиваться.

Это XML-файл макета. 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".StartActivity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:layout_weight="1"
        android:fillViewport="true">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/pg5"
            android:orientation="vertical"
            android:weightSum="5"
            tools:layout_editor_absoluteX="8dp"
            tools:layout_editor_absoluteY="8dp">

            <LinearLayout
                android:id="@+id/gb_text"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="2.55"
                android:gravity="center|top"
                android:orientation="vertical"
                android:weightSum="3">


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_weight="1.2"
                    android:orientation="vertical">  
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="horizontal"
                        android:weightSum="3">

                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="0.5"
                            android:orientation="horizontal"></LinearLayout>

                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="2"
                            android:gravity="center|top"
                            android:orientation="horizontal">

                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent"
                                android:layout_weight="1"
                                android:gravity="center|top"
                                android:orientation="vertical">

                                <TextView
                                    android:id="@+id/textView"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Duplicate Files Remover"
                                    android:textColor="@android:color/white"
                                    android:textSize="@dimen/DuplicateFileRemovertext" />
                            </LinearLayout>

                        </LinearLayout>

                        <LinearLayout
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="0.5"
                            android:orientation="horizontal"></LinearLayout>
                    </LinearLayout>
                </LinearLayout>

                <com.intrusoft.sectionedrecyclerviewapp.CircularProgressBar
                    android:id="@+id/circularProgress"
                    android:layout_width="@dimen/circularprogresswidth"
                    android:layout_height="@dimen/circularprogressheight"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="@dimen/circularprogresstopmargin" />

                <TextView
                    android:id="@+id/gb_textview"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="2dp"
                    android:gravity="center"
                    android:text="TextView"
                    android:textColor="@android:color/white"
                    android:textSize="@dimen/totalavailablesize" />


            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="2.45"
                android:orientation="vertical"
                android:weightSum="5">

                <LinearLayout
                    android:id="@+id/scanimages_layout"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_margin="3dp"
                    android:layout_weight="1"
                    android:weightSum="2">

                    <android.support.v7.widget.CardView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="10dp"
                        android:layout_marginRight="10dp"
                        app:cardCornerRadius="12dp">

                        <LinearLayout
                            android:id="@+id/piccardlayout"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@color/bluelayout"
                            android:orientation="horizontal"
                            android:weightSum="2">

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="0.5"
                                android:orientation="horizontal"
                                android:paddingLeft="8dp">

                                <com.makeramen.roundedimageview.RoundedImageView
                                    android:id="@+id/imageView2"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:layout_alignParentStart="true"
                                    android:layout_alignParentLeft="true"
                                    android:layout_alignParentTop="true"
                                    android:layout_alignParentEnd="true"
                                    android:layout_alignParentRight="true"
                                    android:layout_alignParentBottom="true"
                                    android:layout_marginStart="0dp"
                                    android:layout_marginLeft="0dp"
                                    android:layout_marginTop="0dp"
                                    android:layout_marginEnd="0dp"
                                    android:layout_marginRight="0dp"
                                    android:layout_marginBottom="0dp"
                                    android:layout_weight="1"
                                    android:adjustViewBounds="true"
                                    android:background="@drawable/picicon"
                                    android:scaleType="fitXY"
                                    app:riv_corner_radius="12dip"
                                    app:riv_mutate_background="true"
                                    app:riv_oval="false"
                                    app:riv_tile_mode="clamp" />
                            </LinearLayout>

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="1.5"
                                android:gravity="center"
                                android:orientation="horizontal">
                                <TextView
                                    android:id="@+id/textView2"
                                    android:layout_width="0dp"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="0.5"
                                    android:paddingLeft="8dp"
                                    android:text="  Pictures"
                                    android:textColor="@android:color/white"
                                    android:textSize="@dimen/Scanpicturestext" />

                            </LinearLayout>
                        </LinearLayout>
                    </android.support.v7.widget.CardView>


                </LinearLayout>

                <LinearLayout
                    android:id="@+id/scanaudio_layout"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"

                    android:layout_margin="3dp"
                    android:layout_weight="1"
                    android:weightSum="2">

                    <android.support.v7.widget.CardView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="10dp"
                        android:layout_marginRight="10dp"
                        app:cardCornerRadius="12dp">

                        <LinearLayout
                            android:id="@+id/audiocardlayout"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@color/purplelayout"
                            android:orientation="horizontal"
                            android:weightSum="2">

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="0.5"
                                android:orientation="horizontal"
                                android:paddingLeft="8dp">

                                <com.makeramen.roundedimageview.RoundedImageView
                                    android:id="@+id/imageView3"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:layout_alignParentStart="true"
                                    android:layout_alignParentLeft="true"
                                    android:layout_alignParentTop="true"
                                    android:layout_alignParentEnd="true"
                                    android:layout_alignParentRight="true"
                                    android:layout_alignParentBottom="true"
                                    android:layout_margin="1dp"
                                    android:layout_marginStart="0dp"
                                    android:layout_marginLeft="0dp"
                                    android:layout_marginTop="0dp"
                                    android:layout_marginEnd="0dp"
                                    android:layout_marginRight="0dp"
                                    android:layout_marginBottom="0dp"
                                    android:layout_weight="1"
                                    android:adjustViewBounds="true"
                                    android:background="@drawable/playicon"
                                    android:scaleType="fitXY"
                                    app:riv_corner_radius="12dip"
                                    app:riv_mutate_background="true"
                                    app:riv_oval="false"
                                    app:riv_tile_mode="clamp" />
                            </LinearLayout>

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="1.5"
                                android:gravity="center"
                                android:orientation="horizontal">

                                <TextView
                                    android:id="@+id/textView3"
                                    android:layout_width="0dp"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="0.5"
                                    android:paddingLeft="8dp"
                                    android:text=" Audios"
                                    android:textColor="@android:color/white"
                                    android:textSize="@dimen/Scanaudiostext" />

                            </LinearLayout>
                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                </LinearLayout>

                <LinearLayout
                    android:id="@+id/scanvideos_layout"
                    android:layout_width="match_parent"

                    android:layout_height="0dp"
                    android:layout_margin="3dp"
                    android:layout_weight="1"
                    android:weightSum="2">

                    <android.support.v7.widget.CardView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="10dp"
                        android:layout_marginRight="10dp"
                        app:cardCornerRadius="12dp">

                        <LinearLayout
                            android:id="@+id/videocardlayout"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@color/redlayout"
                            android:orientation="horizontal"
                            android:weightSum="2">

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="0.5"
                                android:orientation="horizontal"
                                android:paddingLeft="8dp">

                                <com.makeramen.roundedimageview.RoundedImageView
                                    android:id="@+id/imageView4"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:layout_alignParentStart="true"
                                    android:layout_alignParentLeft="true"
                                    android:layout_alignParentTop="true"
                                    android:layout_alignParentEnd="true"
                                    android:layout_alignParentRight="true"
                                    android:layout_alignParentBottom="true"
                                    android:layout_margin="1dp"
                                    android:layout_marginStart="0dp"
                                    android:layout_marginLeft="0dp"
                                    android:layout_marginTop="0dp"
                                    android:layout_marginEnd="0dp"
                                    android:layout_marginRight="0dp"
                                    android:layout_marginBottom="0dp"
                                    android:layout_weight="1"
                                    android:adjustViewBounds="true"
                                    android:background="@drawable/vidicon"
                                    android:scaleType="fitCenter"
                                    app:riv_corner_radius="12dip"
                                    app:riv_mutate_background="true"
                                    app:riv_oval="false"
                                    app:riv_tile_mode="clamp" />

                            </LinearLayout>

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="1.5"
                                android:gravity="center"
                                android:orientation="horizontal">

                                <TextView
                                    android:id="@+id/textView4"
                                    android:layout_width="0dp"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="0.5"
                                    android:paddingLeft="8dp"
                                    android:text="Videos"
                                    android:textColor="@android:color/white"
                                    android:textSize="@dimen/Scanvideostext" />

                            </LinearLayout>
                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                </LinearLayout>

                <LinearLayout
                    android:id="@+id/scandocs_layout"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_margin="3dp"
                    android:layout_weight="1"
                    android:weightSum="2">

                    <android.support.v7.widget.CardView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="10dp"
                        android:layout_marginRight="10dp"
                        app:cardCornerRadius="12dp">

                        <LinearLayout
                            android:id="@+id/doccardlayout"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@color/greenlayout"
                            android:orientation="horizontal">

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="0.5"
                                android:orientation="horizontal"
                                android:paddingLeft="8dp">

                                <com.makeramen.roundedimageview.RoundedImageView
                                    android:id="@+id/imageView5"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:layout_alignParentStart="true"
                                    android:layout_alignParentLeft="true"
                                    android:layout_alignParentTop="true"
                                    android:layout_alignParentEnd="true"
                                    android:layout_alignParentRight="true"
                                    android:layout_alignParentBottom="true"
                                    android:layout_margin="1dp"
                                    android:layout_marginStart="0dp"
                                    android:layout_marginLeft="0dp"
                                    android:layout_marginTop="0dp"
                                    android:layout_marginEnd="0dp"
                                    android:layout_marginRight="0dp"
                                    android:layout_marginBottom="0dp"
                                    android:layout_weight="1"
                                    android:adjustViewBounds="true"
                                    android:background="@drawable/docxicon"
                                    android:scaleType="fitXY"
                                    app:riv_corner_radius="12dip"
                                    app:riv_mutate_background="true"
                                    app:riv_oval="false"
                                    app:riv_tile_mode="clamp" />

                            </LinearLayout>

                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="match_parent"
                                android:layout_weight="1.5"
                                android:gravity="center"
                                android:orientation="horizontal">

                                <TextView
                                    android:id="@+id/textView5"
                                    android:layout_width="0dp"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="0.5"
                                    android:paddingLeft="8dp"
                                    android:text="Docs"
                                    android:textColor="@android:color/white"
                                    android:textSize="@dimen/Scandocumentstext" />

                            </LinearLayout>
                        </LinearLayout>
                    </android.support.v7.widget.CardView>

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
    </ScrollView>
</LinearLayout>

1 Ответ

0 голосов
/ 29 апреля 2019

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

Однако, по моему мнению, вы должны изменить общую иерархию вашего макета.Это должно быть что-то вроде этого: 

RelativeLayout
    ImageView
    ScrollView
        LinearLayout-> this will contain your code, which you want to scroll

Простая структура XML будет выглядеть так: 

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="center"
        android:src="@drawable/background"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:fillViewport="true">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <!-- Your Layout code goes here -->
        </LinearLayout>
    </ScrollView>
</RelativeLayout>
...