본문 바로가기
안드로이드 자바

[Java][Android] Swipe Refresh 레이아웃 적용

by teamnova 2021. 4. 12.

오늘은 SwipeRefresh 레이아웃을 적용하는 방법을 예제를 통해 보여드리겠습니다. SwipeRefresh 레이아웃은 화면을 Swipe하여 갱신할 수 있는 기능을 가진 레이아웃입니다. 

 

 

의존성 추가 - build.gradle(app)

우선, SwipeRefresh 레이아웃을 사용하기 위해 의존성을 추가해줍니다.

XML 작성

SwipeRefresh 레이아웃을 보여줄 뷰를 작성합니다. 이번 예제는 화면 스와이프시 랜덤으로 배경색이 바뀌도록 하기 위해서 SwipeRefreshLayout의 자식뷰로 바뀐 배경색을 보여줄 FrameLayout을 만들어주었습니다.

 

activity_refresh.xml

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".RefreshActivity">


    <androidx.swiperefreshlayout.widget.SwipeRefreshLayout
        android:id="@+id/swipe_refresh"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <FrameLayout
            android:id="@+id/frame_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <TextView
                android:id="@+id/textView5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="40dp"
                android:text="Swipe Refresh"
                android:textSize="30sp"
                android:textStyle="bold"
                android:layout_gravity="center_horizontal" />
        </FrameLayout>
    </androidx.swiperefreshlayout.widget.SwipeRefreshLayout>


</androidx.constraintlayout.widget.ConstraintLayout>

 

메인 코드 작성

메인 코드를 작성해보도록 하겠습니다. 미리 스틱코드에 저장해놓은 코드를 불러와서 좀 더 빠르게 작성해보겠습니다. 

stickode.com/code.html?fileno=9861 - swipeRefresh

 

스틱코드를 통해 SwipeRefresh 레이아웃에 필요한 기본 코드 템플릿을 불러옵니다.

불러온 템플릿 안에 스와이프시 실행될 코드를 작성해주시면 됩니다. 저는 랜덤으로 배경색이 변경되는 코드를 작성해봤습니다. 

 

RefreshActivity.java

public class RefreshActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_refresh);
        Random rnd = new Random();

        SwipeRefreshLayout swipeRefreshLayout = findViewById(R.id.swipe_refresh);
        // 해당 뷰 영역을 아래로 swipe되는지 확인하는 리스너.
        swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                // 새로고침되면 실행할 코드

                FrameLayout frameLayout = findViewById(R.id.frame_layout);  // 랜덤으로 바뀔 배경색을 보여줄 frameLayout

                int color = Color.rgb(rnd.nextInt(255), rnd.nextInt(255), rnd.nextInt(255));    // 랜덤 RGB값 생성
                frameLayout.setBackgroundColor(color);  // 랜덤으로 생성한 RBG값을 frameLayout에 적용
                swipeRefreshLayout.setRefreshing(false);

            }
        });
    }
}

 


위의 순서대로 작성하시면 아래와 같은 형식으로 작동하는 것을 확인하실 수 있습니다.