web-dev-qa-db-fra.com

Quelles sont les différences entre l'action de page et l'action du navigateur?

J'ai fait une action de navigateur, mais j'ai juste essayé de tester une action de page. Le bouton est placé au même endroit, mais le bouton d'action de la page ne peut pas être cliqué (l'icône est grisée). Je pensais que les boutons d'action de page étaient situés dans la barre d'adresse, pas dans la barre d'outils. Pourquoi est-il situé au même endroit?

Bouton d'action de mon navigateur:
browser_action

Bouton d'action Ma page:
page_action

javascriptgoogle-chromegoogle-chrome-extension
35
punchh

Les boutons Action du navigateur et Action de la page sont situés "à droite de la barre d'adresse", comme décrit dans la documentation de l'API d'extension. Les deux types de boutons ont beaucoup de similitudes. Le choix de l'utilisation dépend en grande partie de la question de savoir si votre extension doit être utilisable la plupart du temps ou uniquement d'un petit sous-ensemble de pages.

Les boutons d'action du navigateur sont destinés à être utilisés lorsque votre extension peut être utilisée la plupart du temps ou sur la plupart des pages. Ils vous permettent également de fournir des informations d'état immédiatement visibles à l'utilisateur en ayant un badge contenant quelques/quelques caractères sur l'icône et en changeant la couleur de l'arrière-plan utilisé pour ce badge.

Les boutons d'action de page sont destinés à être utilisés lorsque votre extension est souvent/généralement non disponible. Par exemple, s'il n'est utilisable que sur quelques domaines ou URL.

Action du navigateur boutons

Les boutons d'action du navigateur doivent être utilisés lorsque votre bouton est valide pour une utilisation la plupart du temps, soit sur la plupart des pages, soit non lié à/dépendant de la page affichée dans l'onglet actif. Par défaut, les boutons d'action du navigateur sont activés sur tous les onglets/URL. Vous devez appeler browserAction.disable() pour désactiver le bouton dans chaque onglet où vous le souhaitez désactivé (ou généralement désactivé sur tous les onglets). Le bouton d'action du navigateur ne change pas l'état activé/désactivé lorsque l'onglet affiche une URL différente.

La page bouton d'action du navigateur de Chrome indique (un peu la mienne):

Utilisez les actions du navigateur pour placer les icônes dans la barre d'outils principale de Google Chrome, à droite de la barre d'adresse . à son icône , une action du navigateur peut également avoir un info-bulle , un badge et un popup .

  • Utilisez les actions du navigateur pour les fonctionnalités qui ont du sens sur la plupart des pages.
  • N'utilisez pas les actions du navigateur pour les fonctionnalités qui n'ont de sens que pour quelques pages. Utilisez plutôt actions de page
  • Utilisez de grandes icônes colorées qui tirent le meilleur parti de l'espace 16x16-dip. Les icônes d'action du navigateur devraient sembler un peu plus grandes et plus lourdes que les icônes d'action de la page.
  • N'essayez pas d'imiter l'icône de menu monochrome de Google Chrome. Cela ne fonctionne pas bien avec les thèmes, et de toute façon, les extensions devraient se démarquer un peu.
  • Utilisez la transparence alpha pour ajouter des bords doux à votre icône. Étant donné que de nombreuses personnes utilisent des thèmes, votre icône doit être agréable sur une variété de couleurs d'arrière-plan.
  • Ne pas animer constamment votre icône. C'est juste ennuyeux.

Les actions du navigateur ont les API suivantes:

Action de la page boutons

Les boutons d'action de page doivent être utilisés lorsque la possibilité d'utiliser le bouton de votre extension dépend de l'URL affichée dans l'onglet actif et lorsqu'elle est généralement non disponible pour utilisation (c'est-à-dire utilisable uniquement sous certains ou sur certaines URL). Par défaut, les boutons d'action de page sont désactivés/grisés ("cachés") sur toutes les URL. Vous devez appeler pageAction.show() pour activez le bouton pour chaque URL/onglet que vous souhaitez activer. Le bouton d'action de page devient automatiquement désactivé/masqué si l'onglet affiche une URL différente.

bouton d'action de la page de Chrome dit (un peu de mien):

Utilisez l'API chrome.pageAction Pour placer des icônes dans la barre d'outils principale de Google Chrome, à droite de la barre d'adresse . Les actions de page représentent les actions qui peuvent être effectuées sur la page actuelle, mais qui ne s'appliquent pas à toutes les pages. Les actions de page apparaissent grisées lorsqu'elles sont inactives.

Comme les actions du navigateur, les actions de page peuvent avoir une icône, une info-bulle et une fenêtre contextuelle; ils ne peuvent cependant pas avoir de badges. De plus, les actions de page peuvent être grisées. Vous pouvez trouver des informations sur les icônes, les info-bulles et les fenêtres contextuelles en lisant l'interface utilisateur de l'action du navigateur.

Vous faites apparaître et griser une action de page à l'aide des méthodes pageAction.show et pageAction.hide , respectivement. Par défaut, une action de page apparaît grisée. Lorsque vous l'affichez, vous spécifiez l'onglet dans lequel l'icône doit apparaître. L'icône reste visible jusqu'à ce que l'onglet soit fermé ou commence à afficher une URL différente (car l'utilisateur clique sur un lien, par exemple).

  • Utilisez des actions de page pour les fonctionnalités qui n'ont de sens que pour quelques pages.
  • N'utilisez pas les actions de page pour les fonctionnalités qui ont du sens pour la plupart des pages. Utilisez plutôt actions du navigateur .
  • Ne pas animer constamment votre icône. C'est juste ennuyeux.

Les actions de page ont les API suivantes:

  • Les types
  • Méthodes
    • getPopup1 - pageAction.getPopup(object details, function callback)
    • getTitle1 - pageAction.getTitle(object details, function callback)
    • cacher - chrome.pageAction.hide(integer tabId)
    • setIcon1 - pageAction.setIcon(object details, function callback)
    • setPopup1 - pageAction.setPopup(object details)
    • setTitle1 - pageAction.setTitle(object details)
    • afficher - pageAction.show(integer tabId)
  • Événements

1. Cette API est disponible pour les actions de navigateur et les actions de page. Il fait essentiellement la même chose sur les deux.

55
Makyen