일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- Android Interceptor
- 알고리즘 자바
- 66챌린지
- 안드로이드
- 습관만들기
- scope function
- Android Navigation
- Java
- OkHttp Interceptor
- 프로그래머스 알고리즘
- Android ProgressBar
- 영어공부
- 카카오 알고리즘
- 영어독립365
- Kotlin FCM
- Android WebView
- Android ViewPager2
- android recyclerview
- 안드로이드 fcm
- 안드로이드 갤러리 접근
- Android
- Android 12 대응
- Android Jetpack
- Kotlin
- Android DataBinding
- WebView
- DataBinding
- 안드로이드 카카오 로그인
- MVP Architecture
- Android 12
Archives
- Today
- Total
Developer Geek
[Android] WebView ProgressBar Sample 본문
반응형
WebView ProgressBar 구현
개요
ProgressBar
ProgressBar는 사용자에게 작업 진행률을 나타내는 사용자 인터페이스 컨트롤이다.
예를 들면 인터넷에서 파일을 다운로드하거나 업로드 할 때, 우리는 ProgressBar을 통해서 작업 진행 상황을 파악할 수 있다.
ProgressBar에 대한 자세한 내용은 다음을 참고하면 도움이 될 것이다.
앱 설명
이 앱은 안드로이드에서 제공하는 WebView를 통해 페이지를 로드할 때, ProgressBar를 통해 사용자에게 실행중임을 나타낸다.
여기서는 2가지 ProgressBar를 사용한다.
- 진행중임을 나타내는 원형 ProgressBar (중앙)
- 진행률을 나타내는 막대 ProgressBar (상단)
앱은 간단하게 { 웹뷰, 버튼1, 버튼2 }로 구성되어 있다.
- 웹뷰는 기본적으로 블로그를 로드한다.
- 버튼1("GO TO HOME")는 블로그 페이지를 로드한다.
- 버튼2("GO TO GOOGLE")는 구글 홈페이지를 로드한다.
- 버튼 클릭을 통해 페이지를 로드할 때, 각각의 프로그레스를 사용자에게 노출한다.
실행 영상
Code
activity_main.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=".MainActivity">
<ProgressBar
android:id="@+id/progressHorizontal"
style="@style/Widget.AppCompat.ProgressBar.Horizontal"
android:layout_width="0dp"
android:layout_height="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<WebView
android:id="@+id/webView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/progressHorizontal" />
<ProgressBar
android:id="@+id/progress_circular"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btnGoToHome"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GO TO HOME"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/btnGoToGoogle"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="@+id/btnGoToGoogle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GO TO GOOGLE"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/btnGoToHome" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.kt
class MainActivity : AppCompatActivity() {
private val binding: ActivityMainBinding by lazy {
ActivityMainBinding.inflate(layoutInflater)
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(binding.root)
initWebView()
binding.btnGoToGoogle.setOnClickListener {
loadGoogle()
}
binding.btnGoToHome.setOnClickListener {
loadHome()
}
}
private fun initWebView() {
binding.webView.run {
webViewClient = object : WebViewClient() {
override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean {
showProgress()
return super.shouldOverrideUrlLoading(view, url)
}
override fun onPageFinished(view: WebView?, url: String?) {
super.onPageFinished(view, url)
hideProgress()
}
}
webChromeClient = object : WebChromeClient() {
override fun onProgressChanged(view: WebView?, newProgress: Int) {
super.onProgressChanged(view, newProgress)
setProgressValue(newProgress)
}
}
loadUrl("https://devgeek.tistory.com/")
}
}
private fun showProgress() {
binding.run {
progressCircular.isVisible = true
progressHorizontal.isVisible = true
progressHorizontal.progress = 0
}
}
private fun hideProgress() {
binding.run {
progressCircular.isVisible = false
progressHorizontal.isVisible = false
}
}
private fun setProgressValue(progress: Int) {
binding.progressHorizontal.progress = progress
}
private fun loadGoogle() {
binding.webView.loadUrl("https://google.com")
}
private fun loadHome() {
binding.webView.loadUrl("https://devgeek.tistory.com/")
}
}
반응형
'안드로이드 > View' 카테고리의 다른 글
[Android] TabLayout Under Line (0) | 2023.07.22 |
---|---|
[Android] WebView 이미지 업로드 (0) | 2022.12.02 |
[Android] WebView Bridge And JS Call (0) | 2022.11.25 |
[Android] WebView의 JS 함수 호출 (0) | 2022.11.22 |
[Android] WebView Bridge Basic Sample (1) | 2022.09.30 |
Comments