반응형


ScrollView 내부에 ImageView와 TextView를 같이 넣어서 화면 스크롤시 이미지와 텍스트 뷰가 스크롤되도록 구현한 예제입니다.


최초 작성 2019. 2. 21



실행시키면 다음 처럼 동작합니다.

예제를 실행시키면  위에는 이미지가 보이고 아래에는 텍스트가 보입니다.




화면을 위로 스크롤하면 이미지와 텍스트뷰가 같이 이동하면서 스크롤됩니다.


  




예제 코드를 다음처럼 테스트해 볼 수 있습니다.


1. 앱에서 보여줄 이미지 파일을 드래그하여 res \ drawable 폴더에 넣습니다.





2. activity_main.xml 파일을 다음처럼 작성합니다.

ScrollView에 ImageView와 TextView를 같이 넣을 수 없기 때문에 LinearLayout를 사용하여 집어넣습니다.


<?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:gravity="center"
   android:orientation="vertical">

   <ScrollView
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:orientation="vertical"
       android:gravity ="center"
       android:fillViewport="true"
       android:layout_marginTop="0dp"
       android:id="@+id/scrollView">
       <LinearLayout
           android:orientation="vertical"
           android:id="@+id/layout"
           android:layout_width="match_parent"
           android:layout_height="wrap_content">

           <ImageView
               android:id="@+id/imageview"
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:scaleType="fitCenter"
               android:adjustViewBounds="true"/>

           <TextView
               android:id="@+id/textview"
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:textSize="15sp" />
       </LinearLayout>
   </ScrollView>
</LinearLayout>




3. MainActivity.java에서는 이미지 뷰에 보여줄 이미지와 텍스트 뷰에 보여줄 텍스트를 지정해주는 것외에는 특별한 기능이 없습니다.


package com.tistory.webnautes.scrollview_test;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);

       ImageView imageView = (ImageView)findViewById(R.id.imageview);
       TextView textView = (TextView)findViewById(R.id.textview);

       // drawable에 있는 이미지를 지정합니다.
       imageView.setImageResource(R.drawable.moon);


       // 100 줄의 텍스트를 생성합니다.
       String text = "";
       for(int i=0; i<100; i++)
           text += i + "\n";
       textView.setText(text);
   }
}




참고

https://stackoverflow.com/questions/36285402/alternating-textview-and-imageview-inside-a-scrollview




문제 발생시 지나치지 마시고 댓글 남겨주시면 가능한 빨리 답장드립니다.


제가 쓴 책도 한번 검토해보세요 ^^

+ Recent posts