[Androidコンテナコンポーネント-ScrollView]

I.概要

    ScrollViewもコンテナであり、FrameLayoutのサブクラスであり、その主な機能は、物理画面を超えてコンテンツを表示することです(つまり、スクロールバー効果)。ScrollViewは垂直スクロールを提供し、物理画面を超えたコンテンツは次のようになります。表示されます。

      一般に、垂直レイアウトコンポーネントを使用するLinearLayoutは、ScrollLayoutコンテナーの子コンポーネントとして使用でき、同時に、画面の物理的な高さを超えるコンテンツをLinearLayoutコンテナーに表示できます。

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">


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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#07C2FB" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#07C2FB" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#C60426FD" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#C60426FD" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#032898" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#032898" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#021173" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#021173" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#504DAE" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#504DAE" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#3C60A6" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#3C60A6" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#282EA8" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#282EA8" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#273523" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="##5E7559" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#0E1E73" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#0E1E73" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#305BC8" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#305BC8" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#282EA8" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#282EA8" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#0B685E" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#0B685E" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#263B7E" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#263B7E" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#0A7AC5" />
            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#0A7AC5" />
        </LinearLayout>

    </LinearLayout>

</ScrollView>

      もちろん、ScrollViewは垂直スクロールバーのみを提供します。水平スクロール機能を使用する場合は、AndroidがHorizo​​ntalScrollViewコンテナを提供します。Horizo​​ntalScrollViewコンテナは水平スクロールを提供できます。その使用方法はScrollViewと同様です

 水平スクロールビュー:

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


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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#2479CE" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#2479CE" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#C97A06" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#C97A06" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#68060E" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#68060E" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#271904" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#271904" />
        </LinearLayout>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#673AB7" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#673AB7" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#1B5834" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#1B5834" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#680379" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#680379" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#043485" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#043485" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#798506" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#798506" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#B12E04" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#B12E04" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#A09006" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#A09006" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <View
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="2"
                android:background="#920C02" />

            <TextView
                android:layout_width="200px"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="#920C02" />
        </LinearLayout>


    </LinearLayout>

</HorizontalScrollView>

 効果を実現します。

おすすめ

転載: blog.csdn.net/m0_56233309/article/details/123512241
おすすめ