lunes, 17 de noviembre de 2025

Convierte una Web en App Android

App web convertida en app Android lista para publicar

¿Tienes una app web y quieres subirla a la Play Store como aplicación nativa?
Aquí te explico cómo hacerlo rápido y sin frameworks extra.


1. La idea

Tu web app puede volverse una app nativa Android en minutos con WebView.
No necesitas React Native ni Flutter, solo Android Studio y tu HTML online.


2. Crea tu proyecto

Abre Android Studio y crea un nuevo proyecto Empty Activity.
Nómbralo como tu app (ejemplo: LogicSoft).

Tu estructura mínima:

MainActivity.kt  
AndroidManifest.xml  
build.gradle.kts

3. Agrega el WebView

En build.gradle.kts

android {  
    namespace = "com.pasir.logicsoft"  
    compileSdk {  
        version = release(36)  
    }  
  
    defaultConfig {  
        applicationId = "com.pasir.logicsoft"  
        minSdk = 24  
        targetSdk = 36  
        versionCode = 1  
        versionName = "1.0"  
  
        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"  
    }
}

En: MainActivity.kt

package com.pasir.logicsoft  
  
import android.annotation.SuppressLint  
import android.os.Bundle  
import androidx.activity.ComponentActivity  
import androidx.activity.compose.setContent  
import androidx.activity.enableEdgeToEdge  
import androidx.compose.foundation.layout.fillMaxSize  
import androidx.compose.foundation.layout.padding  
import androidx.compose.material3.MaterialTheme  
import androidx.compose.material3.Scaffold  
import androidx.compose.material3.Surface  
import androidx.compose.material3.Text  
import androidx.compose.runtime.Composable  
import androidx.compose.ui.Modifier  
import androidx.compose.ui.tooling.preview.Preview  
import com.pasir.logicsoft.ui.theme.LogicSoftTheme  
import androidx.compose.runtime.*  
import android.webkit.WebView  
import android.webkit.WebViewClient  
import androidx.compose.runtime.mutableStateOf  
import androidx.compose.runtime.remember  
import androidx.compose.runtime.setValue  
import androidx.compose.ui.viewinterop.AndroidView  
  
class MainActivity : ComponentActivity() {  
    @SuppressLint("SetJavaScriptEnabled")  
    override fun onCreate(savedInstanceState: Bundle?) {  
        super.onCreate(savedInstanceState)  
  
        setContent {  
            LogicSoftTheme {  
                Surface(  
                    modifier = Modifier.fillMaxSize(),  
                    color = MaterialTheme.colorScheme.background  
                ) {  
                    WebViewScreen("https://pasir2025.github.io/SIMULADOR-FUB/")  
                }  
            }        }    }  
}  
  
@Composable  
fun WebViewScreen(url: String) {  
    var webView: WebView? by remember { mutableStateOf(null) }  
  
    AndroidView(  
        factory = { context ->  
            WebView(context).apply {  
                settings.javaScriptEnabled = true  
                settings.domStorageEnabled = true  
                settings.useWideViewPort = true  
                settings.loadWithOverviewMode = true  
                settings.builtInZoomControls = false  
                settings.displayZoomControls = false  
                settings.cacheMode = android.webkit.WebSettings.LOAD_NO_CACHE  
                settings.mixedContentMode = android.webkit.WebSettings.MIXED_CONTENT_ALWAYS_ALLOW  
  
                clearCache(true)  
                clearHistory()  
  
                webViewClient = WebViewClient()  
                loadUrl(url)  
            }  
        },  
        modifier = Modifier.fillMaxSize(),  
        update = { view -> view.loadUrl(url) }  
    )  
}  
  

4. Permisos y manifest

En AndroidManifest.xml agrega el permiso de Internet:

<uses-permission android:name="android.permission.INTERNET" />

Y dentro de <application> asegúrate de declarar tu actividad:

<activity android:name=".MainActivity">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

5. Ejecuta y prueba

Conecta tu celular, presiona Run ▶️, y Android Studio lanzará tu app.
Tu web se abrirá dentro de un contenedor nativo Android.

6. Sube a Google Play

Para publicar:

  1. Crea una cuenta en Google Play Console.
  2. Genera un APK o AAB firmado.
  3. Sube íconos, capturas y descripción.
  4. ¡Listo! Ya tienes una app web convertida en app nativa.
GooglePlay Console para publicar la app android

7. Resultado

Tu app ya luce profesional, tiene acceso directo desde el celular y puedes actualizar el contenido desde tu web sin volver a compilar.

En video


No hay comentarios:

Publicar un comentario