Por qué las pantallas grandes importan ahora

Desde 2023 Google exige que las apps nuevas en Play Store sean compatibles con pantallas grandes para acceder a ciertas promociones y visibilidad. El número de tablets Android activas superó los 300 millones y los Chromebooks con soporte de apps Android son decenas de millones más. Los foldables crecen 100% año a año desde el Galaxy Z Fold original.

El problema concreto: la mayoría de las apps Android están diseñadas para teléfonos y simplemente se estiran en tablets — texto gigante, controles centrados en una columna estrecha, layouts que desperdician la mitad de la pantalla. Google empezó a penalizarlo en las rankings del Play Store.

Los cuatro formatos de pantalla grande

# 1. TABLET
# → Pantalla grande en un solo plano (7" a 14")
# → Sin touchscreen siempre, pero puede tener teclado externo y stylus
# → La app se usa con los dos pulgares o posada en una superficie
# → El espacio extra se puede usar para mostrar más contenido en paralelo

# 2. FOLDABLE
# → Pantalla que se dobla — puede ser teléfono o tablet según la postura
# → Modo plegado (~4-6"): layout de teléfono
# → Modo extendido (~7-8"): layout de tablet
# → Modos intermedios: modo mesa (landscape mitad), modo libro (portrait mitad)
# → Zona de bisagra (hinge): puede ser opaca o transparente, interrumpe el contenido

# 3. CHROMEBOOK (Android apps en Chrome OS)
# → Las apps Android corren en una ventana redimensionable
# → El usuario puede moverla, redimensionarla, ponerla en pantalla completa
# → Siempre hay teclado físico y mouse/trackpad
# → La app puede recibir el mismo evento de "resize" que en foldables

# 4. ANDROID TV
# → Pantalla grande (40"+ típicamente) pero a distancia (10-foot UI)
# → Sin touchscreen — control exclusivo con D-pad (arriba/abajo/izq/der/OK)
# → El foco visual es todo — lo que está enfocado debe ser obvio
# → Texto debe ser grande y legible a distancia

Qué cambia técnicamente en cada formato

# Lo que es IGUAL en todos:
# → El código Kotlin, la arquitectura, los ViewModels, los repositorios
# → La lógica de negocio no necesita saber en qué pantalla corre
# → Jetpack Compose adapta el layout según los parámetros que le pasás

# Lo que CAMBIA:
# Tablet / ChromeOS:
# → Layout: de una columna a dos paneles (list-detail)
# → Navegación: de BottomNavigationBar a NavigationRail o NavigationDrawer
# → Touch targets: más pequeños son aceptables (hay más precisión con mouse)
# → Orientación: hay que soportar landscape sin que la app "se rompa"

# Foldable:
# → Todo lo de tablet PLUS:
# → El layout cambia en tiempo de ejecución cuando el usuario dobla/extiende
# → La bisagra puede "partir" el contenido — evitar poner controles ahí
# → Nuevas posturas: modo mesa, modo libro

# ChromeOS:
# → Todo lo de tablet PLUS:
# → La ventana puede redimensionarse libremente (igual que en escritorio)
# → Atajos de teclado (Ctrl+C, Ctrl+Z, etc.) deben funcionar
# → Click derecho debe tener ContextMenu

# Android TV:
# → Completamente diferente — no hay touch
# → Todo el focus management es manual
# → La UI es diferente (Leanback components o Compose TV)

WindowSizeClass — la base unificadora

En lugar de detectar si el dispositivo es "una tablet" (lo cual es frágil), Android ofrece WindowSizeClass: una clasificación del tamaño de la ventana disponible para la app en el momento actual. Es el fundamento de todos los layouts adaptativos.

// Agregar la dependencia:
// implementation("androidx.compose.material3.adaptive:adaptive:1.0.0")
// implementation("androidx.window:window:1.3.0")

// Obtener WindowSizeClass en Compose:
@Composable
fun MiApp() {
    val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass

    // windowSizeClass.windowWidthSizeClass:
    // WindowWidthSizeClass.COMPACT   → < 600dp  (teléfono portrait)
    // WindowWidthSizeClass.MEDIUM    → 600-840dp (tablet portrait, teléfono landscape)
    // WindowWidthSizeClass.EXPANDED  → > 840dp  (tablet landscape, ChromeOS)

    // windowSizeClass.windowHeightSizeClass:
    // WindowHeightSizeClass.COMPACT  → < 480dp  (teléfono landscape)
    // WindowHeightSizeClass.MEDIUM   → 480-900dp
    // WindowHeightSizeClass.EXPANDED → > 900dp  (tablet portrait)

    MiNavegacion(windowSizeClass)
}

// La decisión de layout basada en WindowSizeClass:
@Composable
fun MiNavegacion(windowSizeClass: WindowSizeClass) {
    when (windowSizeClass.windowWidthSizeClass) {
        WindowWidthSizeClass.COMPACT -> {
            // Teléfono → BottomNavigationBar
            NavegacionCompact()
        }
        WindowWidthSizeClass.MEDIUM -> {
            // Tablet portrait / teléfono landscape → NavigationRail
            NavegacionMedium()
        }
        else -> {
            // Tablet landscape / ChromeOS → NavigationDrawer permanente
            NavegacionExpanded()
        }
    }
}

Large Screen Quality guidelines de Google

Google define tres niveles de compatibilidad con pantallas grandes. Desde 2023 influyen en el ranking de Play Store:

# TIER 3 — Large Screen Ready (requisito mínimo)
# ✓ La app no crashea en tablet o foldable
# ✓ Soporta cambios de configuración (rotación, resize) sin perder estado
# ✓ No hay elementos cortados o fuera de pantalla en landscape
# ✓ El layout no está "estirado" de forma obvia

# TIER 2 — Large Screen Optimized
# ✓ Todo el Tier 3 PLUS:
# ✓ La app usa el espacio extra de forma útil (más contenido visible)
# ✓ Soporta tanto portrait como landscape
# ✓ La navegación usa NavigationRail o Drawer en pantallas grandes
# ✓ Los touch targets tienen tamaño adecuado para mouse/trackpad

# TIER 1 — Large Screen Differentiated
# ✓ Todo el Tier 2 PLUS:
# ✓ Layouts de dos paneles (list-detail) en pantallas grandes
# ✓ Soporte de foldables (posturas, bisagra)
# ✓ Atajos de teclado para acciones frecuentes
# ✓ Drag & drop donde tiene sentido

# Verificar compliance:
# Android Studio → Device → Resizable Emulator → probar los tres tamaños
# Google Play Console → Android vitals → Large Screen issues