Поделиться через


Настройка контекстных меню в WebView2

Элемент управления WebView2 предоставляет контекстное меню по умолчанию, и при использовании элемента управления WebView2 можно создать собственное контекстное меню. Используйте API ContextMenuRequested для настройки контекстных меню (контекстных меню) приложения WebView2. Например, можно выполнить любое из следующих действий:

  • Добавление настраиваемого контекстного меню.

    Вместо использования контекстного меню по умолчанию ведущее приложение может нарисовать собственное контекстное меню, используя сведения, отправляемые из контекстного меню WebView2. Ваше приложение обрабатывает ContextMenuRequested событие. Данные, указанные в аргументах ContextMenuRequested Event, можно использовать для отображения настраиваемого контекстного меню с выбранными записями. В этом случае вы обрабатываете событие и запрашиваете отсрочку.

    В пользовательское контекстное меню можно добавить элементы меню по умолчанию и (или) настраиваемые элементы меню.

  • Добавление элементов меню по умолчанию в пользовательское контекстное меню.

  • Добавление настраиваемых элементов меню в контекстное меню по умолчанию.

  • Удалите элементы по умолчанию или настраиваемые элементы меню из контекстного меню по умолчанию.

  • Отключить контекстные меню.

Терминологии:

Термин Определение
пункт меню Широкий термин. Включает флажок, команду, переключатель, разделитель и подменю.
Команды Узкий термин. Один из пяти типов элементов меню.
контекстное меню Контекстное меню по умолчанию (контекстное меню), принадлежащее элементу управления WebView2, или пользовательское контекстное меню (контекстное меню), принадлежащее ведущему приложению.

Добавление настраиваемого контекстного меню

Вместо использования контекстного меню по умолчанию ведущее приложение может нарисовать собственное контекстное меню, используя сведения, отправляемые из контекстного меню WebView2. Ваше приложение обрабатывает ContextMenuRequested событие. Данные, указанные в аргументах ContextMenuRequested Event, можно использовать для отображения настраиваемого контекстного меню с выбранными записями. В этом случае вы обрабатываете событие и запрашиваете отсрочку.

Когда пользователь выбирает команду в пользовательском контекстном меню, приложение должно сообщить элементу управления WebView2, какую команду выбрал пользователь, используя SelectedCommandId свойство .

В пользовательское контекстное меню можно добавить элементы меню по умолчанию и (или) настраиваемые элементы меню.

Чтобы отобразить пользовательское контекстное меню, содержащее нужные элементы меню, используйте данные, указанные CoreWebView2ContextMenuRequestedEventArgsCoreWebView2 в объекте ContextMenuRequested Event. В этом случае необходимо указать Handledtrueзначение и запросить отсрочку.

В событии CoreWebView2.ContextMenuRequested добавьте прослушиватель событий с CoreWebView2ContextMenuRequestedEventArgs.

Свойство MenuItems предоставляет CoreWebView2ContextMenuRequestedEventArgs дерево элементов контекстного меню WebView2 для контекста, щелкнув его правой кнопкой мыши. Чтобы включить элементы контекстного меню WebView2 в контекстное меню приложения, выполните итерацию по IList<CoreWebView2ContextMenuItem>, добавив CoreWebView2ContextMenuItem для каждого пункта меню. .Kind Протестируйте каждый элемент меню, например Command или Separator.

Пример. Добавление пользовательского контекстного меню

В следующем примере представлено контекстное меню WebView2 в формате контекстного меню Win32/WPF.

webView.CoreWebView2.ContextMenuRequested += delegate (object sender, 
                                    CoreWebView2ContextMenuRequestedEventArgs args)
{
    IList<CoreWebView2ContextMenuItem> menuList = args.MenuItems;
    CoreWebView2Deferral deferral = args.GetDeferral();
    args.Handled = true;
    ContextMenu cm = new ContextMenu();
    cm.Closed += (s, ex) => deferral.Complete();
    PopulateContextMenu(args, menuList, cm);
    cm.IsOpen = true;
};
void PopulateContextMenu(CoreWebView2ContextMenuRequestedEventArgs args, 
IList<CoreWebView2ContextMenuItem> menuList, ItemsControl cm)
{
    for (int i = 0; i < menuList.Count; i++)
    {
        CoreWebView2ContextMenuItem current = menuList[i];
        if (current.Kind == CoreWebView2ContextMenuItemKind.Separator)
        {
            Separator sep = new Separator();
            cm.Items.Add(sep);
            continue;
        }
        MenuItem newItem = new MenuItem();
        // The accessibility key is the key after the & in the label
        // Replace with '_' so it is underlined in the label
        newItem.Header = current.Label.Replace('&', '_');
        newItem.InputGestureText = current.ShortcutKeyDescription;
        newItem.IsEnabled = current.IsEnabled;
        if (current.Kind == CoreWebView2ContextMenuItemKind.Submenu)
        {
            PopulateContextMenu(args, current.Children, newItem);
        }
        else
        {
            if (current.Kind == CoreWebView2ContextMenuItemKind.CheckBox
            || current.Kind == CoreWebView2ContextMenuItemKind.Radio)
            {
                newItem.IsCheckable = true;
                newItem.IsChecked = current.IsChecked;
            }

            newItem.Click += (s, ex) =>
            {
                args.SelectedCommandId = current.CommandId;
            };
        }
        cm.Items.Add(newItem);
    }
}

Добавление элементов меню в контекстное меню

Варианты действий:

  • Добавьте элементы меню по умолчанию в пользовательское контекстное меню, как показано выше в разделе Добавление настраиваемого контекстного меню.

  • Добавьте настраиваемые элементы меню в контекстное меню по умолчанию, как показано ниже в разделе Добавление элементов пользовательского меню в контекстное меню по умолчанию.

Добавление настраиваемых элементов меню в контекстное меню по умолчанию

Чтобы добавить настраиваемые элементы меню в контекстное меню по умолчанию, используйте следующие элементы API.

Пример. Добавление настраиваемых элементов меню в контекстное меню по умолчанию

В следующем примере команда URI страницы отображения добавляется в контекстное меню WebView2.

webView.CoreWebView2.ContextMenuRequested += delegate (object sender, 
                                    CoreWebView2ContextMenuRequestedEventArgs args)
{
    // add new item to end of collection
    CoreWebView2ContextMenuItem newItem = 
                        webView.CoreWebView2.Environment.CreateContextMenuItem(
        "Display Page Uri", null, CoreWebView2ContextMenuItemKind.Command);
        newItem.CustomItemSelected += delegate (object send, Object ex)
        {
            string pageUri = args.ContextMenuTarget.PageUri;
            System.Threading.SynchronizationContext.Current.Post((_) =>
            {
                MessageBox.Show(pageUri, "Page Uri", MessageBoxButton.OK);
            }, null);
        };
    menuList.Insert(menuList.Count, newItem);
};

Удаление элементов меню из контекстного меню по умолчанию

Из контекстного меню по умолчанию можно удалить элементы меню по умолчанию или настраиваемые элементы меню.

Пример. Удаление элементов меню из контекстного меню по умолчанию

В следующем примере команда Сохранить изображение как удаляется из контекстного меню WebView2.

webView.CoreWebView2.ContextMenuRequested += delegate (object sender, 
                                    CoreWebView2ContextMenuRequestedEventArgs args)
{
    IList<CoreWebView2ContextMenuItem> menuList = args.MenuItems;
    CoreWebView2ContextMenuTargetKind context = args.ContextMenuTarget.Kind;
    if (context == CoreWebView2ContextMenuTargetKind.Image)
    {
        for (int index = 0; index < menuList.Count; index++)
        {
            if (menuList[index].Name == "saveImageAs")
            {
                menuList.RemoveAt(index);
                break;
            }
        }
    }
};

Обнаружение запроса пользователем контекстного меню

В этом разделе объясняется, как определить, когда пользователь запрашивает открытие контекстного меню. То же самое для пользовательских или контекстных меню по умолчанию.

Когда пользователь запрашивает открытие контекстного меню (например, щелкнув правой кнопкой мыши), приложение должно прослушивать ContextMenuRequested событие.

Когда приложение обнаруживает это событие, приложение должно выполнять некоторые из следующих действий:

  • Добавление настраиваемых элементов меню в контекстное меню по умолчанию.
  • Удалите настраиваемые элементы меню из контекстного меню по умолчанию.
  • Откройте пользовательское контекстное меню.

Событие ContextMenuRequested указывает, что пользователь запросил открытие контекстного меню.

Элемент управления WebView2 вызывает это событие, чтобы указать, что пользователь запросил открытие контекстного меню в элементе управления WebView2, например путем щелчка правой кнопкой мыши.

Элемент управления WebView2 вызывает событие только в ContextMenuRequested том случае, если текущая веб-страница разрешает отображение контекстного меню, то есть если AreDefaultContextMenusEnabled свойство имеет значение true.

CoreWebView2ContextMenuRequestedEventArgs содержит следующие сведения:

  • Упорядоченный ContextMenuItem список объектов для заполнения пользовательского контекстного меню. Упорядоченный список включает в себя следующее:

    • Внутреннее имя элемента меню.
    • Метка пользовательского интерфейса элемента меню, отображаемая для пользователя в пользовательском интерфейсе.
    • Тип пункта меню.
    • Сочетание клавиш Описание, если оно имеется, например ALT+C.
    • Любые другие свойства настраиваемого пункта меню.
  • Координаты, в которых было запрошено контекстное меню, чтобы приложение смогла определить, какой элемент пользовательского интерфейса щелкнул пользователь правой кнопкой мыши. Координаты определяются по отношению к левому верхнему углу элемента управления WebView2.

  • Объект выделения, который будет включать выбранный тип контекста и соответствующие данные параметров контекстного меню.

Когда пользователь выбирает пользовательский пункт меню в контекстном меню, элемент управления WebView2 вызывает CustomItemSelected событие.

Когда ведущее приложение указывает webView2, что пользователь выбрал пункт меню в контекстном меню, WebView2 затем выполняет выбранную команду.

Обнаружение выбора пользователем пользовательского элемента меню

Ваше ведущее приложение может обрабатывать выбранный пользователем пункт меню или возвращать его элементу управления WebView2 для обработки выбранного пользователем пункта меню.

Ведущее приложение должно прослушивать CustomItemSelected событие, которое возникает, когда пользователь выбирает пользовательский пункт меню в контекстном меню по умолчанию или в пользовательском контекстном меню.

Элемент управления WebView2 вызывает это событие, чтобы указать, что пользователь выбрал пользовательский пункт меню, добавленный приложением в контекстное меню.

Если пользователь выбирает пользовательский пункт меню, CustomMenuItemSelected событие возникает в выбранном объекте элемента контекстного меню в следующих случаях:

  • Приложение добавляет настраиваемые элементы меню, но откладывает пользовательский интерфейс контекстного меню на платформу WebView2.

  • Приложение добавляет настраиваемые элементы меню, отображает пользовательский интерфейс и задает SelectedCommandId для свойства идентификатор элемента пользовательского меню.

Сообщение о выбранном элементе меню команды в WebView2

Когда пользователь выбирает команду контекстного меню WebView2 (пункт меню по умолчанию, который находится в пользовательском контекстном меню), ведущее приложение может при необходимости сообщить об этом выборе в WebView2, чтобы WebView2 вызвал команду.

Настраиваемые элементы меню

Если ведущее приложение сообщает о пользовательском пункте меню в качестве выбранного CustomMenuItemSelected элемента меню, событие будет запущено для пользовательского пункта меню.

Отключение контекстных меню

Свойство AreDefaultContextMenusEnabled определяет, можно ли открыть любое контекстное меню. Если параметр WebView2 AreDefaultContextMenusEnabled имеет значение False, это отключает контекстные меню и ContextMenuRequested событие не будет возникать, например, когда пользователь щелкает правой кнопкой мыши.

Обзор справочника по API

См. также