とっても簡単です。
画面を下に引き下ろして、ダウンロード中であることを示すインジケータを表示させて画面を更新するような機能がよくあるが、AndroidではSwipeRefreshLayoutを利用すると簡単に実現できる。
今回は実験的に画面を下にスワイプすることで、ネットから非同期でダウンロードした画像をImageViewに表示させる機能を実装してみる。
なお、画像を非同期ダウンロードする方法はこちらに解説してあるので、そちらの説明はその記事を読んで欲しい。
まずはレイアウトファイルから。ViewをSwipeRefreshLayoutで囲むと、その部分がスワイプするようになる。
今回はイベント内の記述が長くなるため、処理は関数として記述しておき参照を渡している。
今回は実験的に画面を下にスワイプすることで、ネットから非同期でダウンロードした画像をImageViewに表示させる機能を実装してみる。
なお、画像を非同期ダウンロードする方法はこちらに解説してあるので、そちらの説明はその記事を読んで欲しい。
まずはレイアウトファイルから。ViewをSwipeRefreshLayoutで囲むと、その部分がスワイプするようになる。
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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=".MainActivity">
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:srcCompat="?attr/actionModeSplitBackground" />
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.constraint.ConstraintLayout>
とっても簡単で、ボタンのようにイベントに対して処理を記述してあげるだけでいい。今回はイベント内の記述が長くなるため、処理は関数として記述しておき参照を渡している。
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//下にスワイプすると、このイベントが実行される
refresh.setOnRefreshListener(::DownloadImage)
}
fun DownloadImage() {
val request: Request = Request.Builder().let {
//フリー画像サイトの画像への直リンクです
it.url("https://www.pakutaso.com/shared/img/thumb/nuko-8_TP_V1.jpg")
it.get()
it.build()
}
val single: Disposable = Single.create<Bitmap> {
val response: Response = OkHttpClient().newCall(request).execute()
if (response.isSuccessful) {
//受信したデータをBitmapに変換して成功として返す
it.onSuccess(BitmapFactory.decodeStream(response!!.body()!!.byteStream()))
}
}
.subscribeOn(Schedulers.newThread())
.observeOn(AndroidSchedulers.mainThread())
.doOnSuccess {
//画像を表示する
imageView.setImageBitmap(it)
}
.subscribe({}, {})
//ダウンロード中のインジケーターを非表示にする
refresh.isRefreshing = false
}
}