Overlejring af vindueskontrol hjælper webapps til at føles mere som native apps på skrivebordet

click fraud protection

Microsoft forbedrer, hvordan webapps i Edge-browseren vises på desktop-enheder. Virksomheden har annonceret tilgængeligheden af ​​Window Controls Overlay-funktionen, som gør det muligt for webudviklere gøre brug af ekstra plads i titellinjen på en webapp, svarende til hvad native apps gør på de fleste operativsystemer systemer.

Den måde, hvorpå webapps i øjeblikket fungerer på desktop-enheder, er, at de kun kan tegne indhold specifikt inde i appvinduet. Titellinjen, der vises øverst, er reserveret til at vise sidens titel, browserkontroller og generelle vindueskontroller for operativsystemet. Medmindre du bygger en brugerdefineret webapp, der ikke er afhængig af en browser, begrænser det det område, hvor udviklere kan vise nyttigt indhold til deres apps.

Med Window Controls Overlay frigør Microsoft Edge plads på titellinjen, så apps kan vises hvilket indhold de ønsker, hvilket kan være nyttigt til menuer på øverste niveau, søgelinjer og andre funktioner. I stedet for at have 30 rækker af pixels optaget af titellinjen, vises vindueskontrollerne - såsom knapper til at minimere og lukke - nu som en overlejring oven på webapp-indholdet.

Som udvikler kan du drage fordel af dette ved at tilføje et skærmtilsidesættelsesmanifestmedlem til dit webapp-manifest, og Brug derefter CSS-variabler til at forhindre din webapp i at tegne elementer under vindueskontrollerne i hjørnet af appen. Fordi vindueskontroller er forskellige på Windows, Linux eller macOS, skal du bruge forskellige breddevariabler afhængigt af den platform, hvor appen kører. Du kan finde mere information om denne funktion på Mozilla Developer Network.

Microsoft talte først om Window Controls Overlay for over to år siden, og det begyndte at implementere det i Chromium-motoren noget tid senere. Funktionen er nu tilgængelig i Edge og Chrome fra og med version 105 samt Opera version 91. Andre Chromium-baserede browsere bør også understøtte det, hvis de kører den seneste Chromium-version. Der er også udgivet en formel specifikation, der skal tilskynde andre browsere, såsom Firefox, til også at implementere funktionen.


Kilde:Microsoft