Découvrez WebKit pour SwiftUI

WebKit, le moteur de navigation qui équipe Safari et de nombreuses apps Apple, dispose désormais d’une API SwiftUI. Cette nouvelle API simplifie l’intégration de contenu web dans les apps SwiftUI sur iOS, iPadOS, visionOS et macOS. Elle vous permet de combiner des expériences web avec la facilité d’utilisation de SwiftUI et de personnaliser les interactions avec le contenu web.

Une app SwiftUI qui permet aux gens de parcourir les infos sur les lacs du monde entier illustre cette nouvelle API. L’app utilise la nouvelle API WebView, une vue SwiftUI conçue pour afficher facilement du contenu web. Avec une simple URL, la WebView peut automatiquement charger et afficher les pages Web, et vous pouvez facilement la mettre à jour pour afficher un contenu différent en fonction des interactions de l’utilisateur, par exemple en passant d’une URL à l’autre. WebPage est une classe Observable qui représente le contenu web et vous permet de le charger, de le contrôler et de le communiquer. Elle permet de charger des URL distantes, du contenu HTML directement et divers types de données, ce qui offre une certaine souplesse dans la manière de présenter le contenu Web dans l’app. Dans l’app fournie en exemple, une classe « ArticleViewModel » gère les données de chaque article, y compris la WebPage associée. Cela permet à SwiftUI de réagir facilement aux modifications de la page et du contenu de l’article. L’interface de l’app est ensuite configurée, avec une WebView affichant le contenu chargé à partir d’« ArticleViewModel ». Afin d’offrir à l’utilisateur une expérience transparente, l’app contient des articles préchargés. Le nouveau protocole « URLSchemeHandler » gère les URL personnalisées au sein de l’app. Cela permet à l’app de charger du contenu regroupé directement dans l’app, comme des ressources HTML et CSS, plutôt que de tout récupérer sur le web. En implémentant un gestionnaire de schéma personnalisé, l’app fournie en exemple peut gérer et afficher efficacement les infos pré-renseignées sur les lacs, offrant ainsi aux utilisateurs un point de départ immédiat.

La nouvelle propriété Observable « currentNavigationEvent » sur WebPage simplifie le suivi de la navigation dans le contenu web. Vous pouvez désormais observer facilement les évènements de navigation, tels que les démarrages de page, les redirections, les validations de contenu, les opérations finalisées et les échecs, à l’aide de l’API Observations. Cela permet d’effectuer des mises à jour en temps réel, comme renseigner une barre latérale avec la table des matières une fois la page chargée. Au-delà des évènements de navigation, WebPage offre diverses propriétés observables telles que le titre, l’URL et la progression du chargement, qui s’intègrent parfaitement à SwiftUI. Pour les tâches plus complexes, l’API « callJavaScript » permet une communication directe avec le code HTML de la page. Vous pouvez également personnaliser les stratégies de navigation à l’aide du protocole « WebPage.NavigationDeciding », qui détermine la façon dont la navigation est gérée, comme l’ouverture de liens externes dans le navigateur par défaut.

WebKit pour SwiftUI vous permet de facilement intégrer du contenu web dans les apps et d’en personnaliser l’apparence. Utilisez divers modificateurs de vue pour personnaliser l’expérience utilisateur. Par exemple, vous pouvez configurer le modificateur « scrollBounceBehavior » pour désactiver le rebond horizontal à moins que le contenu ne dépasse la taille de la vue. « Regarder pour faire défiler » est une nouveauté de visionOS. Vous pouvez l’activer à l’aide du modificateur « webViewScrollInputBehavior », ce qui permet de faire défiler le contenu en le regardant. Vous pouvez facilement ajouter la prise en charge de Find-In-Page en utilisant le modificateur « findNavigator », et placer un bouton dans la barre d’outils pour afficher le navigateur de recherche. Pour améliorer l’accessibilité et la navigation, synchronisez la position de défilement de la WebView avec une section sélectionnée dans une barre latérale. Pour ce faire, utilisez des fonctions JavaScript pour déterminer la position de la section, puis associez la position à la WebView à l’aide du modificateur « webViewScrollPosition ». Le modificateur « onScrollGeometryChange » permet de mettre à jour la barre latérale lorsque quelqu’un fait défiler la page. WebKit pour SwiftUI fournit une API simple mais performante qui offre une expérience utilisateur exceptionnelle sur toutes les plateformes. Migrez vers cette nouvelle API et partagez vos commentaires.