はじめに
今回はAndroidStudioでのアプリ開発にて使われるProgressbarの簡単な実装をやっていきたいと思います。
Progressbarの設置方法の記事はありましたが、実用的な実装方法が記載された記事がなかったためメモ程度に残していきたいと思います。
今回の記事は海外の動画から持ってきた情報なので詳しい解説はできません。
（英語できなくてすいません...）
参考にした動画
6分ぐらいを見ていただけるとちょうどコードが書き終わったところです。
つくる
activity_main.xml
簡単な実装のため
- スタートさせるためのボタン
- ProgressBar(Horizontal)
- 結果表示用テキスト
を最終的に以下の画像のように設置していきたいと思います。
まずそれぞれの部品を画像のように設置してください。
（めっちゃ投げやり...）
続いて、ボタンとテキスト・ProgressBarの各種設定を行っていきます。
-
ボタン
- id -> startButton
- text -> start
-
ProgressBar
- layout_width -> 250dp
- max -> 100
- progress -> 0
-
テキスト
- id -> resultText
- text -> (空)
- スパナマークtext -> Complete!!
スパナマークとは
こんなマークがついた属性のこと
こうすることでtextの値を仮置きすることができる。
MainActivity.kt
今回はstartButtonが押されたら変数iが100になるまでの間ProgressBarを動作させるプログラムを書いていきます。
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// それぞれのViewを格納
val startButton = findViewById<Button>(R.id.startButton)
val progressBar = findViewById<ProgressBar>(R.id.progressBar)
val resultText = findViewById<TextView>(R.id.resultText)
// UI処理をするためにHandlerクラス生成
val handler = Handler(Looper.getMainLooper())
// startButtonが押された時の処理
startButton.setOnClickListener {
// テキストをリセット
resultText.text = ""
thread {
var i = 0
while (i < 100) {
i++
// 50ミリ秒間待機
// これを設置する理由は、ないと一瞬で終わっちゃうから...
android.os.SystemClock.sleep(50)
// メインスレッドに接続してからUI処理
handler.post {
// progressで現在の進捗率を更新
progressBar.progress = i
}
}
handler.post {
// iが100になったら表示
resultText.text = "Complet!!"
}
}
}
}
いや～、javaと比べてだいぶスッキリしていますね。
kotlinでは「thread」や「handler.post」のようなものはSAM変換できます。
詳しくは書きませんが、簡単に言えばメソッドを一つしか持たないJavaインターフェースをkotlinだとより簡潔に書けますよという仕組みです。
話がそれましたが解説していきたいと思います。
まずthread {}を使う理由ですが、よくわかりません。。。（は？）
特にインターネットを使った処理でも膨大な処理をしているわけでもないのに、なぜスレッドを分ける必要があるのか自分もわかりません。もしかしたらProgressBarを使う場合はスレッドを分けるのが決まりなのかもしれません。
もしわかる方がいらっしゃいましたらコメントしていただけると幸いです。。。
（力不足で申し訳ないです）
つづいてhandler.postですが、
これはスレッドを分けたことでメインスレッドから外れたため一時的にメインスレッドに接続するための処理です。
ProgressBarやresultTextの更新のためにUIの操作をしなければいけないのですが、UIの操作はメインスレッドでないとできません。そのためHandler(Looper.getMainLooper())でメインスレッドに接続するためのクラスを生成しhandler.post {}でUI操作をしているというわけです。
動作確認
startButtonを押すとProgressBarが進捗率を表示してくれ、
処理が終わったらresultTextにComplete!!と表示してくれます。
