RxAndroid에서 SwipeRefreshLayout 사용

  • ListView를 사용할 때 흔히 볼 수 있는 동작은 아래로 당기고 업데이트하는 Pull to Refresh이고, Android는 Support Library에서 Swipe Refresh Layout을 제공합니다.이번에 나는 이것을 RxAndroid와 함께 썼다.
  • 현재 Kotlin에 응용 프로그램을 쓰고 있기 때문에 샘플의 코드도 Kotlin입니다. 자바로 바꾸십시오.
  • 사전 준비 참조Kotlin에서 RxAndroid 1.0 사용.
  • RxSwipeRefreshLayout

  • RxAndroid는 RxSwipeRefreshLayout라는 Binding 클래스를 제공합니다.
  • // refreshingはRefreshLayoutのプログレスを切り替えることができるAction1を返す
    val refreshLayoutRefreshing = RxSwipeRefreshLayout.refreshing(refreshLayout)
    
    // refreshesはProgress状態になったら配信されるObservable<void>を返す
    val refreshLayoutStream = RxSwipeRefreshLayout.refreshes(refreshLayout)
    

    해보다


    배치에 빠른 새로 고침 배치 추가

  • ListView를 SwipeRefreshLayout으로 둘러쌉니다.
  •     <android.support.v4.widget.SwipeRefreshLayout
            android:id="@+id/refresh"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
            <ListView
                android:id="@+id/list_event"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
    
        </android.support.v4.widget.SwipeRefreshLayout>
    

    활동으로 구현

  • 샘플로 Atnd를 두드리는 API를 제작하여 Observable로 이벤트 정보를 되돌려줍니다.아래에 당기면 진도가 표시되고 다음 페이지의 견본을 읽을 수 있습니다.
  •     override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                                  savedInstanceState: Bundle?): View? {
    
            val view = inflater.inflate(R.layout.fragment_item, container, false)
    
            // ListViewにAdaptorとリスナをセット
            mListView = view.findViewById(R.id.list_event) as AbsListView
            mListView?.adapter = mAdapter
            mListView?.onItemClickListener = this
    
            // Observerを作成
            val observer = Observers.create<AtndApi.Companion.Entity>(
                    { t ->
                        // onNext
                        mAdapter?.add(t.title)
                        mAdapter?.notifyDataSetChanged()
                    },
                    { e ->
                        // onError
                        println("Error!! ${e.message}")
                    },
                    {
                        // onComplete
                        mAdapter?.notifyDataSetChanged()
                    })
    
            // Observableを作成
            // 配信時は新しいスレッド
            // 監視者はメインスレッド
            val observable = AtndApi.request(mWordForSearch, 1)
                    .subscribeOn(Schedulers.newThread())
                    .observeOn(AndroidSchedulers.mainThread())
    
            val refreshLayout = view.findViewById(R.id.refresh) as SwipeRefreshLayout
    
            // ローディング中のプログレスの色を設定
            refreshLayout.setColorSchemeColors(Color.RED, Color.GREEN, Color.BLUE)
            refreshLayout.setProgressBackgroundColorSchemeColor(Color.LTGRAY)
    
            val refreshLayoutRefreshing = RxSwipeRefreshLayout.refreshing(refreshLayout)
            val refreshLayoutStream = RxSwipeRefreshLayout.refreshes(refreshLayout)
    
            // 購読を開始
    
            // 初回のAPIコール
            mSubscriptions.add(observable.subscribe(observer))
    
            // RefreshLayoutを監視
            mSubscriptions.add(refreshLayoutStream.subscribe({
    
                // ローディングが始まったらAPIコール
                val subscription = AtndApi.request(mWordForSearch, mAdapter?.count!! + 1)
                        .subscribeOn(Schedulers.newThread())
                        .observeOn(AndroidSchedulers.mainThread())
                        .finallyDo({
                            // 読み込みが終わったらRefreshLayoutのローディング状態を解除
                            refreshLayoutRefreshing.call(false)
                        })
                        .subscribe(observer)
    
                mSubscriptions.add(subscription)
            }))
    
            return view
        }
    
        override fun onDestroyView() {
            super.onDestroyView()
    
            // 購読を解除する
            mSubscriptions.unsubscribe()
        }
    
  • 진도는 이렇게 표시됩니다.
  • 코드 여기 있습니다https://github.com/rei-m/kotlin_sample
  • 좋은 웹페이지 즐겨찾기