Postato su 14. ottobre 2024 da Jan Bunk
Per alcuni siti web può essere utile modificare dinamicamente gli elementi della barra di navigazione delle app. Puoi farlo con queste funzioni JavaScript.
executeWhenAppReady()
del nostro helper script per le app. Assicura che il tuo sito web non cerchi di interagire con l'applicazione prima che sia pronta o quando il sito web viene caricato con un normale browser (ReferenceError, function is not defined). getNavigationBarItems
Usa questa funzione per ottenere un elenco di oggetti che rappresentano tutti gli elementi della barra di navigazione attualmente visualizzati.
<script>
try {
// returns a list of objects representing the navigation bar items
let navigationBarItems = (await getNavigationBarItems())["navigationBarItems"];
}
catch (e) {
// Can occur if:
// - the app couldn't connect to the native code. Should be very unlikely.
console.log(e);
}
</script>
setNavigationBarItems
Usa questa funzione per modificare gli elementi della barra di navigazione che devono essere visualizzati.
<script>
try {
// example for a navigation bar item object
let newNavigationBarItem = {
label: "Contact",
action: {
urlToRedirectTo: "https://webtoapp.design/contact",
javascriptToExecute: null,
elementToClickSelector: null,
isFavoriteAction: false,
isShareAction: false,
isOpenExternallyAction: false,
isSettingsAction: false
},
icon: {
name: "list"
},
};
// get the currently displayed navigation bar items
let allNavigationBarItems = (await getNavigationBarItems())["navigationBarItems"];
// add the new navigation bar item to the list of navigation bar items
allNavigationBarItems.push(newNavigationBarItem);
// display the list of navigation bar items, including the new navigation bar item
await setNavigationBarItems(allNavigationBarItems);
}
catch (e) {
// Can occur if:
// - the app couldn't connect to the native code. Should be very unlikely.
console.log(e);
}
</script>
Ecco un elenco di documentazione per sviluppatori correlata alla modifica dinamica del menu dell'app. Assicurati di visualizzare quella applicabile al layout della tua app.