Xamarin.Forms ToolbarItem

Télécharger l’exemple

La Xamarin.FormsToolbarItem classe est un type spécial de bouton qui peut être ajouté à la collection d’un PageToolbarItems objet. Chaque ToolbarItem objet s’affiche sous la forme d’un bouton dans la barre de navigation de l’application. Un ToolbarItem instance peut avoir une icône et apparaître en tant qu’élément de menu principal ou secondaire. La classe ToolbarItem hérite des données de l’élément MenuItem.

Les captures d’écran suivantes montrent ToolbarItem des objets dans la barre de navigation sur iOS et Android :

La ToolbarItem classe définit les propriétés suivantes :

• Orderest une valeur d’énumération ToolbarItemOrder qui détermine si le ToolbarItem instance s’affiche dans le menu principal ou secondaire.
• Priority est une integer valeur qui détermine l’ordre d’affichage des éléments dans la collection d’un PageToolbarItems objet.

La ToolbarItem classe hérite des propriétés généralement utilisées suivantes de la MenuItem classe :

• Command est un qui permet de ICommand lier des actions utilisateur, telles que des appuis ou des clics au doigt, à des commandes définies sur un mode d’affichage.
• CommandParameter est un object qui spécifie le paramètre qui doit être passé au Command.
• IconImageSource est une ImageSource valeur qui détermine l’icône d’affichage sur un ToolbarItem objet.
• Text est un string qui détermine le texte affiché sur un ToolbarItem objet.

Ces propriétés étant soutenues par BindableProperty des objets, une ToolbarItem instance peut être la cible de liaisons de données.

Notes

Une alternative à la création d’une barre d’outils à partir d’objets ToolbarItem consiste à définir la NavigationPage.TitleView propriété jointe sur une classe de disposition qui contient plusieurs vues. Pour plus d’informations, consultez Affichage des vues dans la barre de navigation.

Créer un objet ToolbarItem

Un ToolbarItem objet peut être instancié en XAML. Les Text propriétés et IconImageSource peuvent être définies pour déterminer comment le bouton est affiché dans la barre de navigation. L’exemple suivant montre comment instancier un ToolbarItem avec des propriétés courantes définies et l’ajouter à une ContentPagecollection de ToolbarItems :

<ContentPage.ToolbarItems>
    <ToolbarItem Text="Example Item"
                 IconImageSource="example_icon.png"
                 Order="Primary"
                 Priority="0" />
</ContentPage.ToolbarItems>

Cet exemple entraîne la création d’un objet contenant du ToolbarItem texte, d’une icône et qui apparaît en premier dans la zone de barre de navigation principale. Un ToolbarItem peut également être créé dans le code et ajouté à la ToolbarItems collection :

ToolbarItem item = new ToolbarItem
{
    Text = "Example Item",
    IconImageSource = ImageSource.FromFile("example_icon.png"),
    Order = ToolbarItemOrder.Primary,
    Priority = 0
};

// "this" refers to a Page object
this.ToolbarItems.Add(item);

Le fichier représenté par , stringfourni en tant que IconImageSource propriété, doit exister dans chaque projet de plateforme.

Notes

Les ressources d’image sont gérées différemment sur chaque plateforme. Un ImageSource peut provenir de sources, notamment un fichier local ou une ressource incorporée, un URI ou un flux. Pour plus d’informations sur la définition de la IconImageSource propriété et images dans Xamarin.Forms, consultez Images dans Xamarin.Forms.

Définir le comportement des boutons

La ToolbarItem classe hérite de l’événement Clicked de la MenuItem classe . Un gestionnaire d’événements peut être attaché à l’événement Clicked pour réagir aux appuis ou aux clics sur ToolbarItem les instances en XAML :

<ToolbarItem ...
             Clicked="OnItemClicked" />

Un gestionnaire d’événements peut également être attaché dans le code :

ToolbarItem item = new ToolbarItem { ... }
item.Clicked += OnItemClicked;

Les exemples précédents référencent un gestionnaire d’événements OnItemClicked . Le code suivant montre un exemple d’implémentation :

void OnItemClicked(object sender, EventArgs e)
{
    ToolbarItem item = (ToolbarItem)sender;
    messageLabel.Text = $"You clicked the \"{item.Text}\" toolbar item.";
}

ToolbarItem les objets peuvent également utiliser les Command propriétés et CommandParameter pour réagir aux entrées utilisateur sans gestionnaires d’événements. Pour plus d’informations sur l’interface et la ICommand liaison de données MVVM, consultez Xamarin.Forms MenuItem MVVM Behavior.

Activer ou désactiver un objet ToolbarItem au moment de l’exécution

Pour activer la désactivation d’un ToolbarItem au moment de l’exécution, liez sa Command propriété à une ICommand implémentation et assurez-vous qu’un canExecute délégué active et désactive le ICommand le cas échéant.

Pour plus d’informations, consultez Activer ou désactiver un élément MenuItem au moment de l’exécution.

Menus principal et secondaire

L’énumération ToolbarItemOrder a Defaultdes valeurs , Primaryet Secondary .

Lorsque la propriété a la Order valeur Primary, l’objet ToolbarItem s’affiche dans la barre de navigation main sur toutes les plateformes. ToolbarItem les objets sont hiérarchisés par rapport au titre de la page, qui sera tronqué pour faire de la place pour les éléments. Les captures d’écran suivantes montrent ToolbarItem des objets dans le menu principal sur iOS et Android :

Lorsque la propriété a la Order valeur , le comportement varie d’une plateforme à l’autre Secondary. Sur UWP et Android, le Secondary menu éléments s’affiche sous la forme de trois points que vous pouvez appuyer ou cliquer pour afficher les éléments d’une liste verticale. Sur iOS, le menu Éléments s’affiche Secondary sous la barre de navigation sous la forme d’une liste horizontale. Les captures d’écran suivantes montrent un menu secondaire sur iOS et Android :

Avertissement

Le comportement des icônes dans les ToolbarItem objets dont la Order propriété est définie Secondary sur est incohérent entre les plateformes. Évitez de définir la IconImageSource propriété sur les éléments qui s’affichent dans le menu secondaire.

Liens connexes

• ToolbarItem Demos
• Images dans Xamarin.Forms
• Xamarin.Forms Menuitem