Swipe-to-Action

앱을 사용하다가 보면 옆으로 스와이프하면서 액션을 주는 걸 볼수 있을것이다

예를 들어 통화앱 같은 경우 이런식으로 스와이프해서 통화가 가능하다

ItemTouchHelper를 사용하면 구현이 가능한대

스와이프외에도 롱클릭하며 삭제하기등 다양하게 구현가능하다

ItemTouchHelper

ContactItemHelper.kt

class ContactItemHelper(val context: Context): ItemTouchHelper.Callback() {

    //드래그 또는 스와이프를 할 수 있는데, 상 하 좌 우로 선택가능, 드래그롤 통해 순서변경도 가능
    override fun getMovementFlags(
        recyclerView: RecyclerView,
        viewHolder: RecyclerView.ViewHolder
    ): Int {
        val swipeFqwelags = ItemTouchHelper.RIGHT
        return makeMovementFlags(0, swipeFqwelags)
        //오른쪽으로만 슬라이드 가능하게 설정
    }

    //드래그시 호출
    override fun onMove(
        recyclerView: RecyclerView,
        viewHolder: RecyclerView.ViewHolder,
        target: RecyclerView.ViewHolder
    ): Boolean {
        // 드래그 기능은 사용하지 않으므로 false 반환
        return false
    }

    //스와이프 동작 활성화
    override fun isItemViewSwipeEnabled(): Boolean {
        return true
    }
    //롱터치는 비활성화한다
    override fun isLongPressDragEnabled(): Boolean {
        return false
    }

    /**
     * TODO 스와이프 설정
     *
     * @param viewHolder ContactAdapter의 ItemViewHolder
     * @param direction 스와이프의 동작 방향
     * 오른쪽으로 스와이프할시 전화 걸기 인텐트 생성
     */
    override fun onSwiped(viewHolder: RecyclerView.ViewHolder, direction: Int) {
        val personViewHolder = viewHolder as ContactAdapter.ItemViewHolder
        val phoneNumber = UserList.userList.find { it.name == personViewHolder.name.text}?.phone

        if (direction == ItemTouchHelper.RIGHT){
            val callUriSwiped = Uri.parse("tel:$phoneNumber ")
            val callIntent = Intent(Intent.ACTION_CALL, callUriSwiped)
            context.startActivity(callIntent)
        }
    }

    //레이아웃 뒤에 숨겨진 뷰들을 냅두고 겉에 있는 레이아웃만 이동시킨다
    override fun onChildDraw(
        c: Canvas,
        recyclerView: RecyclerView,
        viewHolder: RecyclerView.ViewHolder,
        dX: Float,
        dY: Float,
        actionState: Int,
        isCurrentlyActive: Boolean
    ) {
        if(actionState == ItemTouchHelper.ACTION_STATE_SWIPE){
            val view = (viewHolder as ContactAdapter.ItemViewHolder).swipeLayout //리사이클러뷰의 레이아웃
            getDefaultUIUtil().onDraw(c, recyclerView, view, dX, dY, actionState, isCurrentlyActive)
        }//스와이프 동작에 따른 UI 변화를 적용
    }
}

이번에 연락처 앱을 만들면서 구현한 코드다

ItemTouchHelper를 상속받으면 오버라이드 되는 함수들인데

override fun getMovementFlags로 움직임을 조정할 수 있다

여기서는 ItemTouchHelper.RIGHT로 설정해 오른쪽으로만 스와이프 가능하도록 설정했다

onSwiped에서 스와이프시 액션을 처리했는데

뷰홀더에서 연락처와 연결된 번호를 phoneNumber에 저장하고

오른쪽으로 스와이프가 됬을때 전화번호로 통화를 시도한다

이렇게만해도 스와이프시 통화까지는 문제가없다

이제 뒤에 레이아웃만 남겨둬서 스와이프할대 숨겨둔 바를 보여주도록한다

fun onChildDraw로 설정하는데 스와이프 액션이 실행되면

홀더에서 swipLayout을 찾고 움직이지 않게 고정시킨다