Xamarin.Forms Menuitem

Stáhnout ukázku Stažení ukázky

Třída definuje položky nabídky pro nabídky, jako jsou místní nabídky položek a kontextové nabídky Xamarin.FormsMenuItemListView aplikace Shell.

Následující snímky obrazovky zobrazují MenuItem objekty v ListView místní nabídce v iOSu a Androidu:

a Androidu s úplným obrázkemMenuItems v iOSua Androidu

Třída MenuItem definuje následující vlastnosti:

Tyto vlastnosti jsou zálohovány BindablePropertyMenuItem objekty, takže instance může být cílem datových vazeb.

Vytvoření Položky nabídky

MenuItem Objekty lze použít v místní nabídce ListView položek objektu. Nejběžnějším vzorem je vytváření objektů v instanci, které se MenuItem používají jako objekt pro s ViewCellDataTemplateListViewItemTemplate . Když se objekt naplní, vytvoří každou položku pomocí , která při aktivaci místní nabídky položky ListViewDataTemplate zobrazí MenuItem volby.

Následující příklad ukazuje MenuItem vytvoření instance v kontextu ListView objektu:

<ListView>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <ViewCell.ContextActions>
                    <MenuItem Text="Context Menu Option" />
                </ViewCell.ContextActions>
                <Label Text="{Binding .}" />
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Objekt MenuItem lze také vytvořit v kódu:

// A function returns a ViewCell instance that
// is used as the template for each list item
DataTemplate dataTemplate = new DataTemplate(() =>
{
    // A Label displays the list item text
    Label label = new Label();
    label.SetBinding(Label.TextProperty, ".");

    // A ViewCell serves as the DataTemplate
    ViewCell viewCell = new ViewCell
    {
        View = label
    };

    // Add a MenuItem instance to the ContextActions
    MenuItem menuItem = new MenuItem
    {
        Text = "Context Menu Option"
    };
    viewCell.ContextActions.Add(menuItem);

    // The function returns the custom ViewCell
    // to the DataTemplate constructor
    return viewCell;
});

// Finally, the dataTemplate is provided to
// the ListView object
ListView listView = new ListView
{
    ...
    ItemTemplate = dataTemplate
};

Definování chování MenuItem s událostmi

Třída MenuItem zveřejňuje Clicked událost. K této události je možné připojit obslužnou rutinu události, která reaguje na klepnutí nebo kliknutí na MenuItem instanci v jazyce XAML:

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

Obslužnou rutinu události lze připojit také v kódu:

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

Předchozí příklady odkazují na OnItemClicked obslužnou rutinu události. Následující kód ukazuje příklad implementace:

void OnItemClicked(object sender, EventArgs e)
{
    // The sender is the menuItem
    MenuItem menuItem = sender as MenuItem;

    // Access the list item through the BindingContext
    var contextItem = menuItem.BindingContext;

    // Do something with the contextItem here
}

Definování chování MenuItem pomocí MVVM

Třída MenuItem podporuje model MVVM (Model-View-ViewModel) prostřednictvím objektů a BindablePropertyICommand rozhraní. Následující kód XAML ukazuje MenuItem instance vázané na příkazy definované v modelu viewmodel:

<ContentPage.BindingContext>
    <viewmodels:ListPageViewModel />
</ContentPage.BindingContext>

<StackLayout>
    <Label Text="{Binding Message}" ... />
    <ListView ItemsSource="{Binding Items}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <ViewCell.ContextActions>
                        <MenuItem Text="Edit"
                                    IconImageSource="icon.png"
                                    Command="{Binding Source={x:Reference contentPage}, Path=BindingContext.EditCommand}"
                                    CommandParameter="{Binding .}"/>
                        <MenuItem Text="Delete"
                                    Command="{Binding Source={x:Reference contentPage}, Path=BindingContext.DeleteCommand}"
                                    CommandParameter="{Binding .}"/>
                    </ViewCell.ContextActions>
                    <Label Text="{Binding .}" />
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackLayout>

V předchozím příkladu jsou definovány dva objekty s jejich vlastnostmi a vázanými MenuItem na příkazy v modelu CommandCommandParameter viewmodel. Model viewmodel obsahuje příkazy, na které odkazuje XAML:

public class ListPageViewModel : INotifyPropertyChanged
{
    ...

    public ICommand EditCommand => new Command<string>((string item) =>
    {
        Message = $"Edit command was called on: {item}";
    });

    public ICommand DeleteCommand => new Command<string>((string item) =>
    {
        Message = $"Delete command was called on: {item}";
    });
}

Ukázková aplikace obsahuje DataService třídu, která slouží k získání seznamu položek pro naplnění ListView objektů. Vytvoří se instance modelu viewmodel s položkami z třídy a v kódu se nastaví jako DataServiceBindingContext .

public MenuItemXamlMvvmPage()
{
    InitializeComponent();
    BindingContext = new ListPageViewModel(DataService.GetListItems());
}

Upozornění

MenuItem Objekty zobrazují pouze ikony v Androidu. Na jiných platformách se zobrazí pouze text Text určený vlastností .

Ikony se zadá pomocí IconImageSource vlastnosti . Pokud je zadána ikona, text určený Text vlastností se nezobrazí. Následující snímek obrazovky ukazuje objekt MenuItem s ikonou v Androidu:

Snímek obrazovky s ikonou MenuItem v Androidu Snímek

Další informace o používání imagí v Xamarin.Forms systému najdete v tématu Images in Xamarin.Forms .

Povolení nebo zakázání MenuItem za běhu

Pokud chcete zakázat za běhu, vytvořte vazbu jeho vlastnosti na implementaci a zajistěte, aby delegát podle potřeby povoluje MenuItemCommand a ICommandcanExecuteICommand zakažuje .

Důležité

Při použití vlastnosti k povolení nebo zakázání nevážte vlastnost s IsEnabledCommand jinou MenuItem vlastností.

Následující příklad ukazuje, MenuItem jejíž Command vlastnost se váže na ICommand s názvem MyCommand :

<MenuItem Text="My menu item"
          Command="{Binding MyCommand}" />

Implementace ICommand vyžaduje canExecute delegáta, který vrací hodnotu vlastnosti, aby bylo možné povolit a bool zakázat MenuItem :

public class MyViewModel : INotifyPropertyChanged
{
    bool isMenuItemEnabled = false;
    public bool IsMenuItemEnabled
    {
        get { return isMenuItemEnabled; }
        set
        {
            isMenuItemEnabled = value;
            MyCommand.ChangeCanExecute();
        }
    }

    public Command MyCommand { get; private set; }

    public MyViewModel()
    {
        MyCommand = new Command(() =>
        {
            // Execute logic here
        },
        () => IsMenuItemEnabled);
    }
}

V tomto příkladu MenuItem je objekt zakázán, dokud IsMenuItemEnabled vlastnost nenastavíte. Pokud k tomu dojde, je volána metoda , která způsobí opětovné vyhodnocení Command.ChangeCanExecutecanExecuteMyCommand delegáta pro .

Chování místní nabídky napříč platformami

K kontextové nabídce se přistupuje a na každé platformě se zobrazuje jinak.

V Androidu se místní nabídka aktivuje dlouhým stisknutím u položky seznamu. Místní nabídka nahrazuje oblast nadpisu a navigačního panelu a MenuItem možnosti se zobrazují jako vodorovná tlačítka.

Snímek obrazovky místní nabídky v Androidu Snímek

V iOSu se místní nabídka aktivuje potápnutím po položce seznamu. Místní nabídka se zobrazí u položky seznamu a MenuItems zobrazuje se jako vodorovná tlačítka.

Snímek obrazovky místní nabídky v iOSu Snímek

V UPW se místní nabídka aktivuje kliknutím pravým tlačítkem na položku seznamu. Místní nabídka se zobrazí blízko kurzoru jako svislý seznam.

Snímek obrazovky místní nabídky na UPW Snímekobrazovky místní