コンテンツをスクロールビューの中央に配置する

Question

LinearLayoutをScrollViewの中央に配置したいと思います。 LinearLayoutの高さが小さい場合は中央揃えで正しく表示されますが（画像＃1を参照）、LinearLayoutの高さが画面の高さより大きい場合は、奇妙な動作をします。 LinearLayoutの上部（画像＃2を参照）が見えず、ScrollViewの下部に巨大なパディングがあります。ここで何が起こっているのかわかりません。 LinearLayoutに多くのコンテンツがある場合、画面全体は画像＃3のようになります。

画像＃1
画像＃2
画像＃

これが私のレイアウトファイルです：

            <?xml version="1.0" encoding="utf-8"?>
            <ScrollView xmlns:Android="http://schemas.Android.com/apk/res/Android"
                Android:layout_width="match_parent"
                Android:layout_height="match_parent"
                Android:background="#cccfff" >

                <LinearLayout
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center_vertical"
                    Android:layout_margin="28dp"
                    Android:background="#ffffff"
                    Android:orientation="vertical"
                    Android:paddingBottom="40dp"
                    Android:paddingLeft="20dp"
                    Android:paddingRight="20dp"
                    Android:paddingTop="40dp" >

                    <ImageView
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="16dp"
                        Android:src="@drawable/ic_launcher" />

                    <TextView
                        Android:id="@+id/tip_title"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="12dp"
                        Android:text="Title"
                        Android:textColor="@color/orange_text"
                        Android:textSize="@dimen/font_size_medium" />

                    <TextView
                        Android:id="@+id/tip_description"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:text="Description description..."
                        Android:textSize="@dimen/font_size_small" />
                </LinearLayout>

            </ScrollView>

Answer 1

外部の水平LinearLayoutを使用する必要があります。同じ状況でうまくいきます。

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:gravity="center"
        Android:orientation="horizontal" >
    <ScrollView
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:orientation="vertical" >
        <LinearLayout
                Android:orientation="vertical"
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:gravity="center_horizontal" >
            <TextView
                    Android:text="@string/your_text"
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content" />
        </LinearLayout>
    </ScrollView>
</LinearLayout>

Answer 2

Android:fillViewport="true"を使用してコンテンツを中央に配置できます。このようなもの：

<ScrollView xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fillViewport="true">
        <!-- content -->
</ScrollView>

Answer 3

これは、ConstraintLayout内でビューを中央に配置する方法です

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">

    <androidx.appcompat.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        Android:background="#86c2e1"
        Android:elevation="4dp"
        app:layout_constraintTop_toTopOf="parent"
        app:title="Toolbar" />

    <ScrollView
        Android:layout_width="match_parent"
        Android:layout_height="0dp"
        Android:background="#eda200"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHeight_default="wrap"
        app:layout_constraintTop_toBottomOf="@+id/toolbar"
        app:layout_constraintVertical_bias="0.5">

        <TextView
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:text="@string/lorem_ipsum"
            Android:textSize="20sp" />
    </ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 4

表示したい最上位のUIコンポーネントにフォーカスを設定します

<ImageView
            Android:focusable="true"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_marginBottom="16dp"
            Android:src="@drawable/ic_launcher" />

Answer 5

以下の私のCenteringLinearLayoutクラスを使用してください。

import Android.content.Context
import Android.support.constraint.ConstraintLayout
import Android.util.AttributeSet
import Android.view.View
import Android.widget.LinearLayout

class CenteringLinearLayout: LinearLayout {

    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle)
    constructor(context: Context, attrs: AttributeSet) : super(context, attrs)
    constructor(context: Context) : super(context)

    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
        val parentView = this.parent as View
        if (h > parentView.height) {
            parentView.post {
                val params = parentView.layoutParams as ConstraintLayout.LayoutParams
                params.height = ConstraintLayout.LayoutParams.MATCH_CONSTRAINT
                parentView.layoutParams = params
            }
        } else {
            val params = parentView.layoutParams
            params.height = ConstraintLayout.LayoutParams.WRAP_CONTENT
            parentView.layoutParams = params
        }
        super.onSizeChanged(w, h, oldw, oldh)
    }
}

Answer 6

これを試して、要件を満たしてください。

   <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:background="#cccfff"
    Android:gravity="center"
    Android:orientation="vertical" >

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_gravity="center"
        Android:layout_margin="10dp"
        Android:background="#ffffff"
        Android:gravity="center_vertical"
        Android:orientation="vertical"
        Android:paddingBottom="40dp"
        Android:paddingLeft="20dp"
        Android:paddingRight="20dp"
        Android:paddingTop="40dp" >

        <ImageView
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_marginBottom="16dp"
            Android:src="@drawable/ic_launcher" />

        <TextView
            Android:id="@+id/tip_title"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_marginBottom="12dp"
            Android:text="Title" />

        <TextView
            Android:id="@+id/tip_description"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:text="biruDescription description..." />
    </LinearLayout>

</LinearLayout>

Javaコードのもう1行

TextView tip_description = (TextView) findViewById(R.id.tip_description);
        tip_description.setMovementMethod(new ScrollingMovementMethod());

これにより、レイアウト全体ではなく、説明コンテンツがスクロールされます。

Answer 7

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout
           xmlns:Android="http://schemas.Android.com/apk/res/Android"
           Android:layout_width="match_parent"
           Android:layout_height="match_parent"
           Android:orientation="vertical"
           Android:gravity="center"
           Android:padding="10dp"
           Android:background="#cccfff">

            <ScrollView 
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                 >

                <LinearLayout
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center_vertical"
                    Android:layout_margin="28dp"
                    Android:background="#ffffff"
                    Android:orientation="vertical"
                    Android:paddingBottom="40dp"
                    Android:paddingLeft="20dp"
                    Android:paddingRight="20dp"
                    Android:paddingTop="40dp" >

                    <ImageView
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="16dp"
                        Android:src="@drawable/ic_launcher" />

                    <TextView
                        Android:id="@+id/tip_title"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="12dp"
                        Android:text="Title"
                        Android:textColor="@color/orange_text"
                        Android:textSize="@dimen/font_size_medium" />

                    <TextView
                        Android:id="@+id/tip_description"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:text="Description description..."
                        Android:textSize="@dimen/font_size_small" />
                </LinearLayout>

            </ScrollView>
</LinearLayout>