Colocar un progressbar WebView en Android Studio

📱 Colocar un progressbar WebView en Android Studio [28]

En este tutorial vamos Colocar un progressbar WebView en Android Studio (Barra de progreso) a nuestro WebView para ver qué porcentaje de la página va cargando.
Insertar un Progressbar en nuestro diseño y colocaremos su atributo visible como false.

  • Llamar al objeto WebChromeClient que llamara el evento onProgressChanged.
  • Cuando se ejecute el evento onProgressChanged:
    • Colocaremos el progreso del Progressbar en 0.
    • Colocaremos la visibilidad en visible.
    • Incrementaremos el progreso del Progressbar.
    • Cuando el progreso de la carga sea 100 ocultaremos el Progressbar.
Colocar un progressbar WebView en Android Studio

Codigo: https://github.com/programadornovato/Mi-Primer-Proyecto-Android-Studio/commit/d236726a00e22e555a87e83fd9145df989020dc2

package com.programadornovato.miprimerproyecto

import android.content.DialogInterface
import android.content.Intent
import android.graphics.Bitmap
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.webkit.*
import android.widget.*
import androidx.appcompat.app.AlertDialog
import java.math.BigDecimal
import kotlin.math.PI
import kotlin.math.round

class MainActivity : AppCompatActivity() {
    private var txtURL:EditText?=null
    private var navegador:WebView?=null
    private var pbCarga:ProgressBar?=null
    private var errorPagina=false
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        txtURL=findViewById(R.id.txtURL)
        navegador=findViewById(R.id.navegador)
        pbCarga=findViewById(R.id.pbCarga)
        navegador?.clearCache(false)
        navegador?.settings?.javaScriptEnabled=true

        navegador?.webViewClient = object : WebViewClient(){
            override fun onReceivedError(
                view: WebView?,
                request: WebResourceRequest?,
                error: WebResourceError?
            ) {
                super.onReceivedError(view, request, error)
                errorPagina=true
                Toast.makeText(this@MainActivity,"Error al cargar: $error",Toast.LENGTH_LONG).show()
            }

            override fun onPageFinished(view: WebView?, url: String?) {
                super.onPageFinished(view, url)
                if(errorPagina==false){
                    Toast.makeText(this@MainActivity,"La pagina termino de cargar",Toast.LENGTH_LONG).show()
                }
            }
        }
        navegador?.webChromeClient = object : WebChromeClient(){
            override fun onProgressChanged(view: WebView?, newProgress: Int) {
                super.onProgressChanged(view, newProgress)
                pbCarga?.progress=0
                pbCarga?.visibility=View.VISIBLE
                pbCarga?.incrementProgressBy(newProgress)
                if(newProgress==100){
                    pbCarga?.visibility=View.GONE
                }
            }
        }

    }
    fun cargar(view: View){
        errorPagina=false
        var url=txtURL?.text.toString()
        navegador?.loadUrl(url)
    }
}
<?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">

    <EditText
        android:id="@+id/txtURL"
        android:layout_width="314dp"
        android:layout_height="51dp"
        android:ems="10"
        android:hint="Humano a que pagina quieres ir!!"
        android:inputType="textPersonName"
        android:text="https://www.programadornovato.com"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="cargar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@android:drawable/ic_media_next" />

    <WebView
        android:id="@+id/navegador"
        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/pbCarga" />

    <ProgressBar
        android:id="@+id/pbCarga"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:visibility="invisible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/txtURL" />
</androidx.constraintlayout.widget.ConstraintLayout>

🎦 Lista de reproducción de este curso: https://www.youtube.com/watch?v=3ZUlE_tvfaM&list=PLCTD_CpMeEKRL2-HaZThebGcyyR3_RshO&ab_channel=programadornovato
🎦 Curso de Android Studio: https://www.youtube.com/watch?v=AHyTqIB_8Rs&list=PLCTD_CpMeEKTT9pb9J-89j1SPtqHzU7sF&ab_channel=programadornovato
🎦 [Curso] Java Netbeans Completo☕: https://www.youtube.com/playlist?list=PLCTD_CpMeEKTT-qEHGqZH3fkBgXH4GOTF
🎦 [Curso] Kotlin de 0 a 100: https://www.youtube.com/playlist?list=PLCTD_CpMeEKSjzbsW_zmVNz23GyOVsdbS
🎦 [Curso] Java Netbeans Completo☕: https://www.youtube.com/playlist?list=PLCTD_CpMeEKTT-qEHGqZH3fkBgXH4GOTF

🔗 Facebook: https://facebook.com/ProgramadorNovatoOficial
🔗 Twitter: https://twitter.com/programadornova
🔗 Linkedin: https://www.linkedin.com/in/programadornovato/
🔗 Instagram: https://www.instagram.com/programadornovato/
🔗 Pagina oficial: https://www.programadornovato.com
🔗 Gracias por apoyar este canal: https://www.patreon.com/programadornovato

Anterior tutorial Siguiente tutorial

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Salir de la versión móvil