Jak: pobrać i ustawić elementy paska aplikacji

Opublikowano 4. października 2025 przez Jan Bunk


Dla niektórych stron internetowych może być przydatne dynamiczne modyfikowanie przycisków w pasku aplikacji. Możesz to zrobić za pomocą tych funkcji JavaScript.

Korzystanie z funkcji JavaScript

Możesz sprawdzić funkcję executeWhenAppReady() w naszym pomocniczym skrypcie aplikacji. Zapewnia, że Twoja strona nie próbuje komunikować się z aplikacją zanim będzie gotowa lub gdy strona jest otwarta w zwykłej przeglądarce (ReferenceError, funkcja nie jest zdefiniowana).

getAppBarItems

Użyj tej funkcji, aby uzyskać listę obiektów reprezentujących wszystkie elementy paska aplikacji, które są obecnie wyświetlane.


<script>
    try {
        // returns a list of objects representing the app bar items
        let appBarItems = (await getAppBarItems())["appBarItems"];
    }
    catch (e) {
        // Can occur if:
        // - the app couldn't connect to the native code. Should be very unlikely.
        console.log(e);
    }
</script>
    

setAppBarItems

Użyj tej funkcji, aby zmodyfikować elementy paska aplikacji, które mają być wyświetlane.


<script>
    try {
        // example for an app bar item object
        let newAppBarItem = {
            action: {
                urlToRedirectTo: "https://webtoapp.design/contact",
                javascriptToExecute: null,
                elementToClickSelector: null,
                isFavoriteAction: false,
                isShareAction: false,
                isOpenExternallyAction: false,
                isSettingsAction: false,
                isRateAction: false,
                isPastNotificationsAction: false,
            },
            icon: {
                name: "list"
            }
        };

        // get the currently displayed app bar items
        let allAppBarItems = (await getAppBarItems())["appBarItems"];

        // add the new app bar item to the list of app bar items
        allAppBarItems.push(newAppBarItem);

        // display the list of app bar items, including the new app bar item
        await setAppBarItems(allAppBarItems);
    }
    catch (e) {
        // Can occur if:
        // - the app couldn't connect to the native code. Should be very unlikely.
        console.log(e);
    }
</script>
    

Edycja menu aplikacji

Oto lista powiązanej dokumentacji deweloperskiej dotyczącej dynamicznej zmiany menu aplikacji. Upewnij się, że przeglądasz tę odpowiednią dla układu swojej aplikacji.