Fonctionnalité native
Des en-têtes sous la Dynamic Island et des barres d'onglets sous l'indicateur d'accueil : c'est le refus de design classique. Des guides par outil avec les réglages, le CSS et les appels de barre d'état adaptés à votre stack.
Dès $109 en paiement unique par plateforme, ou notre équipe s'occupe de tout dès $698.
Sur iOS, autoAdjustSafeAreaInsets est activé : la WebView commence sous la barre d'état, l'encoche ou la Dynamic Island. La barre prend statusBarBackgroundColor et statusBarTextColor (blanc ou noir), avec darkModeStatusBarBackgroundColor et darkModeStatusBarTextColor pour le mode sombre. Sur Android, la couleur vient de colorPrimaryDark dans style.xml et le texte de blackStatusBarText.
Pour une image hero pleine largeur, une carte ou une vidéo, passez transparentStatusBar à true et autoAdjustSafeAreaInsets à false sur iOS, ou TRANSPARENT_STATUS_BAR sur Android. Dès lors, c'est votre CSS qui gère les insets : viewport-fit=cover plus env(safe-area-inset-*) sur chaque élément fixe.
Les barres inférieures créées en CSS se retrouvent souvent sous l'indicateur d'accueil de l'iPhone. Ajoutez-leur un padding env(safe-area-inset-bottom), ou laissez WebViewGold ajouter une bande native sous la page avec bottombar et bottombarBackgroundColor (iPadBottombar pour les iPad, documentation de la safe area).
Google Play exige désormais que les nouvelles apps et les mises à jour ciblent Android 16 (niveau d'API 36), où les apps ne peuvent plus désactiver le bord à bord : la fenêtre s'étend derrière la barre d'état et la barre de navigation, et l'app doit gérer les insets. Le modèle WebViewGold suit ces évolutions de la plateforme (les mises à jour sont gratuites) : compilez à partir de la version actuelle et testez la zone de la barre de gestes sur un vrai téléphone.
| Symptôme | iOS (Config.swift) | Android (Config.java, style.xml) | Depuis votre app web |
|---|---|---|---|
| En-tête caché sous l'encoche ou la Dynamic Island | Laissez autoAdjustSafeAreaInsets activé (par défaut) | Laissez TRANSPARENT_STATUS_BAR désactivé | Seulement en bord à bord : padding-top: env(safe-area-inset-top) |
| Barre d'état blanche au-dessus d'un en-tête sombre | statusBarBackgroundColor = couleur de l'en-tête | colorPrimaryDark = couleur de l'en-tête | statusbarcolor://R,G,B par page |
| Horloge et batterie illisibles en mode sombre | darkModeStatusBarBackgroundColor, darkModeStatusBarTextColor | blackStatusBarText ; statusbartextcolor://white à l'exécution | prefers-color-scheme ; sur Android, aussi la variable injectée isDarkMode |
| Barre d'onglets sous l'indicateur d'accueil ou la barre de gestes | bottombar + bottombarBackgroundColor | Couleur de la barre de navigation via bottombarcolor://, texte via navbartextcolor:// | padding-bottom: env(safe-area-inset-bottom) |
| Vidéo, jeu ou visionneuse photo en plein écran | hidebars://on : le fond de la barre d'état devient transparent, l'horloge reste | hidebars://on : les barres d'état et de navigation disparaissent ; un balayage depuis le haut les fait revenir | hidebars://off quand l'utilisateur quitte l'écran |
Oui, par défaut. Sur iOS, autoAdjustSafeAreaInsets maintient la page sous la zone de la barre d'état quelle que soit la forme de l'appareil, et la barre affiche la couleur que vous avez configurée. Vous ne gérez les insets en CSS que si vous passez délibérément à une barre d'état transparente.
Oui. Naviguez vers statusbarcolor://R,G,B depuis JavaScript (par exemple statusbarcolor://15,23,42) et WebViewGold recolore la barre d'état, choisit un texte blanc ou noir et ajuste la barre inférieure iOS ou la barre de navigation Android. statusbartextcolor://white ou statusbartextcolor://black définit explicitement la couleur du texte.
Soit la balise meta viewport ne contient pas viewport-fit=cover, soit WebViewGold place encore la page dans la safe area (le comportement par défaut) : dans ce cas, 0 est correct et rien ne se chevauche. Avec transparentStatusBar activé et autoAdjustSafeAreaInsets désactivé, les valeurs deviennent réelles.
Même résultat, charge de travail différente de votre côté. Les trois formules incluent la garantie d'approbation et le support humain 24/7.
$109 par plateforme, paiement unique
La licence WebViewGold : un projet Xcode ou Android Studio prêt à l'emploi. Collez votre URL, définissez le nom et l'icône, activez les fonctionnalités, compilez et soumettez. Mises à jour gratuites à vie.
Voir les offres sur la page principale$349 par licence, extension en paiement unique
Ni Mac, ni Xcode, ni Android Studio : configurez dans le navigateur, nous compilons les deux apps dans le cloud et les transmettons à App Store Connect et à la Play Console.
Comment fonctionne le Cloud Builder Essayer la démo gratuite$698 par plateforme $798
Envoyez-nous votre URL et votre icône. Notre équipe configure, compile et livre votre app sous 72 heures, en marque blanche, projets sources inclus. Les deux plateformes pour $1,158.
Détails du Full Service Propulsé par
Prix Soldes d'hiver valables jusqu'au 31 décembre 2026.
Garantie d'approbation App Store & Google Play – ou remboursement sous 14 jours
Vous préférez déléguer ? Full Service : nous configurons, compilons et livrons sous 72 heures, dès $698 par plateforme. Des questions ? Chattez avec nous 24/7.
Les remboursements sont accordés aux conditions indiquées dans notre FAQ : un refus non lié au contenu par Apple et/ou Google, demandé dans les 14 jours suivant l'achat.
