web-dev-qa-db-ja.com

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

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>
18
Egis

外部の水平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>
29

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>
37
yaircarreno

これは、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>

enter image description here

2
Egis

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

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

以下の私の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)
    }
}
0
Salih

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

   <?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());

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

0
Biraj Zalavadia
<?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>
0
Hariharan