Android Application

Kotlin 고급 위젯 - 뷰 컨테이너(View Container) : 수평 스크롤뷰(HorizontalScrollView)

작성자 임베디드코리아 작성일23-09-24 02:26 조회1,550회 댓글0건

첨부파일

------------------------------------------------------------------------------------
      activity_main.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"
    android:padding="16dp"
    tools:context=".MainActivity">

    <!--스크롤뷰 안에는 오직 1개의 View만 추가가 가능함-->
    <!--여러개를 추가하려면 안에 Layout같은 ViewGroup을 놓고 그 안에 View들을 추가해야함-->
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="100dp">

        <!-- 스크롤뷰안에 있는 View의 height은 값을 어떻게 지정하던지 무조건 wrap_content로 됨-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:background="#ff0000"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:background="#00ff00"/>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:background="#0000ff"/>

        </LinearLayout>
    </ScrollView>

    <!--수평방향의 스크롤뷰는 별도의 클래스로 존재함-->
    <HorizontalScrollView
        android:layout_marginTop="16dp"
        android:layout_width="300dp"
        android:layout_height="150dp">

        <!-- HorizontalScrollView의 경우 안에 있는 뷰의 width값이 무조건 wrap_content로 됨-->
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <TextView
                android:layout_width="200dp"
                android:layout_height="match_parent"
                android:background="#ff0000"/>
            <TextView
                android:layout_width="200dp"
                android:layout_height="match_parent"
                android:background="#00ff00"/>
            <TextView
                android:layout_width="200dp"
                android:layout_height="match_parent"
                android:background="#0000ff"/>

        </LinearLayout>
    </HorizontalScrollView>

    <!-- 수평, 수직 모두 스크롤되게 하려면 중첩스크롤 구조로 만들면 됨-->
    <ScrollView
        android:layout_marginTop="16dp"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:id="@+id/sv">

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

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/poppy_flowe"/>

        </HorizontalScrollView>

    </ScrollView>

    <!-- 스크롤뷰의 스크롤 위치를 Java코드를 통해 마지막으로 이동시키기-->
    <Button
        android:id="@+id/Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="스크롤을 마지막으로"
        android:onClick="clickBtn"/>

</LinearLayout>

------------------------------------------------------------------------------------
    MainActivity.kt
-------------------------------------------------------------------------------------
class MainActivity : AppCompatActivity() {
    private lateinit var btn: Button

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        btn = findViewById<Button>(R.id.Button)

        btn.setOnClickListener {
            //스크롤 뷰 참조하기
            var sv: ScrollView = findViewById(R.id.sv);

            //스크롤뷰의 스크롤위치를 가장 아래쪽으로 이동
            sv.fullScroll(ScrollView.FOCUS_DOWN);
        }

    }
}

******* 수직 / 수평  스크롤뷰 ***************
------------------------------------------------------------------------------------
      activity_main.xml
-------------------------------------------------------------------------------------
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <!--상단-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="100"
        android:orientation="horizontal"
        android:weightSum="300">

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="100"
            android:background="@mipmap/ic_launcher" />

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

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="100" />

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="100" />

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="100" />

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="100" />
        </LinearLayout>

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="100" />
    </LinearLayout>

    <!--중단-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="100"
        android:orientation="vertical">

        <Button
            android:id="@+id/btnChange01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="이미지 바꾸기" />

        <ImageView
            android:id="@+id/frameImage01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/flower01"
            android:layout_gravity="center"
            android:visibility="visible"/>

        <ImageView
            android:id="@+id/frameImage02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/bird01"
            android:layout_gravity="center"
            android:visibility="visible"/>
    </LinearLayout>

    <!--하단-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="100"
        android:orientation="vertical">

        <Button
            android:id="@+id/btnChange02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="이미지 바꾸어 보여주기" />

        <HorizontalScrollView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

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

                <ImageView
                    android:id="@+id/scrollImage01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/flower01" />
            </ScrollView>
        </HorizontalScrollView>
    </LinearLayout>

</LinearLayout>

------------------------------------------------------------------------------------
    MainActivity.kt
-------------------------------------------------------------------------------------
class MainActivity : AppCompatActivity() {
    private lateinit var ChangeBTN01: Button
    private lateinit var ChangeBTN02: Button

    private lateinit var frameImage01: ImageView
    private lateinit var frameImage02: ImageView
    private lateinit var scrollImage01: ImageView

    private  var selIdx1: Int = 1
    private  var selIdx2: Int = 1

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        ChangeBTN01 = findViewById(R.id.btnChange01)
        ChangeBTN02 = findViewById(R.id.btnChange02)
        frameImage01= findViewById(R.id.frameImage01)
        frameImage02= findViewById(R.id.frameImage01)
        scrollImage01= findViewById(R.id.scrollImage01)

        ChangeBTN01.setOnClickListener  {
            if(selIdx1 == 1) {
                frameImage01.setVisibility(View.GONE);
                frameImage02.setVisibility(View.VISIBLE);
                selIdx1 = 2;
            } else if (selIdx1 == 2) {
                frameImage01.setVisibility(View.VISIBLE);
                frameImage02.setVisibility(View.GONE);
                selIdx1 = 1;
            } // if else if
        }

        ChangeBTN02.setOnClickListener  {
            if(selIdx2 == 1) {
                scrollImage01.setImageResource(R.drawable.flower01);
                selIdx2 = 2;
            } else if (selIdx2 == 2) {
                scrollImage01.setImageResource(R.drawable.bird01);
                selIdx2 = 1;
            } // if else if
        }

    }
}

개인정보취급방침    이용약관    오시는 길