Microsoft verbetert de manier waarop webapps in de Edge-browser worden weergegeven op desktopapparaten. Het bedrijf heeft de beschikbaarheid aangekondigd van de functie Window Controls Overlay, waarmee webontwikkelaars dit kunnen doen Maak gebruik van extra ruimte in de titelbalk van een webapp, vergelijkbaar met wat native apps op de meeste besturingssystemen doen systemen.
De manier waarop webapps momenteel op desktopapparaten werken, is dat ze alleen inhoud specifiek binnen het app-venster kunnen tekenen. De titelbalk, bovenaan weergegeven, is gereserveerd om de titel van de pagina, browserbedieningen en algemene vensterbedieningen voor het besturingssysteem weer te geven. Tenzij u een aangepaste web-app bouwt die niet afhankelijk is van een browser, beperkt dit het gebied waarin ontwikkelaars nuttige inhoud voor hun apps kunnen weergeven.
Met de Window Controls Overlay maakt Microsoft Edge ruimte vrij op de titelbalk zodat apps kunnen worden weergegeven welke inhoud ze ook willen, wat handig kan zijn voor menu's op het hoogste niveau, zoekbalken en andere functies. In plaats van dat de titelbalk 30 rijen pixels in beslag neemt, worden de vensterbedieningen (zoals knoppen voor minimaliseren en sluiten) nu weergegeven als een overlay bovenop de inhoud van de webapp.
Als ontwikkelaar kunt u hiervan profiteren door een manifestlid voor weergaveoverschrijving toe te voegen aan uw Web App-manifest Gebruik vervolgens CSS-variabelen om te voorkomen dat uw web-app elementen tekent onder de vensterbedieningselementen in de hoek van de app. Omdat de vensterbesturing anders is op Windows, Linux of macOS, moet u verschillende breedtevariabelen gebruiken, afhankelijk van het platform waarop de app wordt uitgevoerd. Meer informatie over deze mogelijkheid vindt u op de website Mozilla-ontwikkelaarsnetwerk.
Microsoft sprak ruim twee jaar geleden voor het eerst over de Window Controls Overlay en begon deze enige tijd later in de Chromium-engine te implementeren. De functie is nu beschikbaar in Edge en Chrome vanaf versie 105, evenals in Opera-versie 91. Andere Chromium-gebaseerde browsers zouden dit ook moeten ondersteunen als ze de nieuwste Chromium-versie gebruiken. Er is ook een formele specificatie gepubliceerd die andere browsers, zoals Firefox, zou moeten stimuleren om de functie ook te implementeren.
Bron:Microsoft