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

Гиперссылки

  • Статья

Гиперссылки перемещаются пользователем в другую часть приложения, в другое приложение или запускают определенный универсальный идентификатор ресурса (URI) с помощью отдельного приложения браузера. Существует два способа добавления гиперссылки в приложение XAML: текстового элемента Гиперссылки и элемента управления HyperlinkButton .

Кнопка гиперссылки

Выбор правильного элемента управления

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

Выберите нужный тип гиперссылки в зависимости от ваших потребностей:

  • Используйте встроенный текстовый элемент Гиперссылки внутри элемента управления текстом. Элемент Гиперссылки передается с другими текстовыми элементами и его можно использовать в любом inlineCollection. Используйте текстовую гиперссылку, если требуется автоматическая упаковка текста и не обязательно требуется большой целевой объект попадания. Текст гиперссылки может быть небольшим и трудным для целевого объекта, особенно для сенсорного ввода.
  • Используйте ГиперссылкуButton для автономных гиперссылок. ГиперссылкаButton — это специализированный элемент управления Button, который можно использовать в любом месте, где вы будете использовать кнопку.
  • Используйте гиперссылкуButton с изображением в качестве содержимого, чтобы сделать изображение с возможностью щелчка.

Рекомендации

  • Для навигации используются только гиперссылки; Не используйте их для других действий.
  • Используйте стиль текста из пандуса типа для текстовых гиперссылок. Ознакомьтесь с шрифтами и пандусом типа Windows.
  • Держите дискретные гиперссылки достаточно далеко друг от друга, чтобы пользователь может различать их и легко выбирать каждый из них.
  • Добавьте подсказки в гиперссылки, указывающие, куда будет направляться пользователь. Если пользователь будет перенаправлен на внешний сайт, добавьте доменное имя верхнего уровня в подсказку и укажите текст с дополнительным цветом шрифта.

UWP и WinUI 2

Внимание

Сведения и примеры в этой статье оптимизированы для приложений, использующих пакет SDK для приложений Windows и WinUI 3, но обычно применимы к приложениям UWP, использующим WinUI 2. См. справочник по API UWP для конкретных сведений и примеров платформы.

В этом разделе содержатся сведения, необходимые для использования элемента управления в приложении UWP или WinUI 2.

API для этого элемента управления существуют в пространстве имен Windows.UI.Xaml.Controls .

Создание текстового элемента Гиперссылки

В этом примере показано, как использовать текстовый элемент Гиперссылки внутри TextBlock.

<StackPanel Width="200">
    <TextBlock Text="Privacy" Style="{StaticResource SubheaderTextBlockStyle}"/>
    <TextBlock TextWrapping="WrapWholeWords">
        <Span xml:space="preserve"><Run>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Read the </Run><Hyperlink NavigateUri="http://www.contoso.com">Contoso Privacy Statement</Hyperlink><Run> in your browser.</Run> Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue.</Span>
    </TextBlock>
</StackPanel>

Гиперссылка отображается в виде встраиваемого текста и передается окружающим текстом:

Пример гиперссылки в виде текстового элемента

Совет

При использовании гиперссылки в текстовом элементе управления с другими текстовыми элементами в XAML поместите содержимое в контейнер Span и примените xml:space="preserve" атрибут к Диапазону, чтобы сохранить пробел между гиперссылкой и другими элементами.

Создание гиперссылкиButton

Откройте приложение коллекции WinUI 3 и просмотрите гиперссылки в действии.

Приложение коллекции WinUI 3 включает интерактивные примеры большинства элементов управления, функций и функций WinUI 3. Получение приложения из Microsoft Store или получение исходного кода на GitHub

Вот как использовать ГиперссылкуButton как с текстом, так и с изображением.

<StackPanel>
    <TextBlock Text="About" Style="{StaticResource TitleTextBlockStyle}"/>
    <HyperlinkButton NavigateUri="http://www.contoso.com">
        <Image Source="Assets/ContosoLogo.png"/>
    </HyperlinkButton>
    <TextBlock Text="Version: 1.0.0001" Style="{StaticResource CaptionTextBlockStyle}"/>
    <HyperlinkButton Content="Contoso.com" NavigateUri="http://www.contoso.com"/>
    <HyperlinkButton Content="Acknowledgments" NavigateUri="http://www.contoso.com"/>
    <HyperlinkButton Content="Help" NavigateUri="http://www.contoso.com"/>
</StackPanel>

Кнопки гиперссылки с текстовым содержимым отображаются как помеченный текст. Изображение логотипа Contoso также является гиперссылкой, доступной для щелчка:

Пример гиперссылки в качестве элемента управления кнопкой

Этот пример демонстрирует, как создать HyperlinkButton в коде.

HyperlinkButton helpLinkButton = new HyperlinkButton();
helpLinkButton.Content = "Help";
helpLinkButton.NavigateUri = new Uri("http://www.contoso.com");

Обработка навигации

Для обоих типов гиперссылок вы обрабатываете навигацию одинаково; Можно задать свойство NavigateUri или обработать событие Click .

Чтобы использовать гиперссылку для перехода к URI, задайте свойство NavigateUri. Когда пользователь щелкает или нажимает гиперссылку, указанный URI открывается в браузере по умолчанию. Браузер по умолчанию выполняется в отдельном процессе от приложения.

Примечание.

Идентификатор URI представлен классом Windows.Foundation.Uri. При программировании с помощью .NET этот класс скрывается. Вам нужно использовать класс System.Uri. См. подробнее на страницах справочной документации по этим классам.

Использовать схемы http: или https: не обязательно. Можно использовать такие схемы, как ms-appx:, ms-appdata: или ms-resources:, если содержимое ресурса в этих расположениях подходит для загрузки в браузере. При этом схема file: блокируется. Дополнительные сведения см . в схемах URI.

Когда пользователь щелкает гиперссылку, значение свойства NavigateUri передается в системный обработчик для типов и схем URI. Затем система запускает приложение, зарегистрированное для схемы URI, предоставленного для NavigateUri.

Если вы не хотите, чтобы гиперссылка загружала содержимое в веб-браузере по умолчанию (и не хотите, чтобы браузер отображалась), не устанавливайте значение для NavigateUri. Вместо этого обработайте событие Click и напишите нужный код.

Обработка события Click

Используйте событие Click для действий, отличных от запуска URI в браузере, например навигации в приложении. Например, если вы хотите загрузить новую страницу приложения, а не открыть браузер, вызовите метод Frame.Navigate в обработчике событий Click, чтобы перейти на новую страницу приложения. Если требуется внешний абсолютный универсальный код ресурса (URI) для загрузки в элементе управления WebView , который также существует в приложении, вызовите WebView.Navigate в рамках логики обработчика щелчка.

Обычно событие Click не обрабатывается, а также указывает значение NavigateUri, так как они представляют два разных способа использования элемента гиперссылки. Если вы намерены открыть универсальный код ресурса (URI) в браузере по умолчанию, и вы указали значение для NavigateUri, не обрабатывайте событие Click. И наоборот, если вы обрабатываете событие Click, не указывайте NavigateUri.

В обработчике событий Click ничего нельзя сделать, чтобы браузер по умолчанию не загружал любой допустимый целевой объект, указанный для NavigateUri; это действие выполняется автоматически (асинхронно) при активации гиперссылки и не может быть отменено из обработчика событий Click.

По умолчанию гиперссылки подчеркнуты. Это подчеркивание важно, так как оно помогает соответствовать требованиям специальных возможностей. Пользователи цветовой слепой используют подчеркивание для различения гиперссылок и другого текста. При отключении подчеркивания следует добавить другой тип различия форматирования, чтобы отличить гиперссылки от другого текста, например FontWeight или FontStyle.

Текстовые элементы гиперссылки

Чтобы отключить подчеркивание, можно задать свойство Подчеркивания . Если это сделать, попробуйте использовать FontWeight или FontStyle , чтобы отличить текст ссылки.

HyperlinkButton

По умолчанию ГиперссылкаButton отображается как подчеркиваемый текст при установке строки в качестве значения свойства Content .

Текст не подчеркивается в следующих случаях:

Если вам нужна кнопка, которая отображается как не подчеркнутый текст, рассмотрите возможность использования стандартного элемента управления Button и применения встроенного TextBlockButtonStyle системного ресурса к его свойству Style.

Примечания для текстового элемента Гиперссылки

Этот раздел относится только к текстовому элементу Гиперссылки, а не к элементу управления ГиперссылкаButton.

События ввода

Так как гиперссылка не является UIElement, она не имеет набора событий ввода элемента пользовательского интерфейса, таких как Tapped, PointerPressed и т. д. Вместо этого гиперссылка имеет собственное событие Click, а также неявное поведение системы загрузки любого URI, указанного как NavigateUri. Система обрабатывает все входные действия, которые должны вызывать действия гиперссылки и вызывать событие Click в ответ.

Содержимое

Гиперссылка имеет ограничения на содержимое, которое может существовать в своей коллекции Inlines . В частности, гиперссылка разрешает выполнение и другие типы диапазонов, которые не являются другой гиперссылкой. InlineUIContainer не может находиться в коллекции inlines гиперссылки. При попытке добавить ограниченное содержимое возникает исключение недопустимого аргумента или исключение синтаксического анализа XAML.

Гиперссылка не наследуется от элемента управления, поэтому у нее нет свойства Style или шаблона. Вы можете изменить свойства, унаследованные от TextElement, например foreground или FontFamily, чтобы изменить внешний вид гиперссылки, но нельзя использовать общий стиль или шаблон для применения изменений. Вместо использования шаблона рекомендуется использовать общие ресурсы для значений свойств Гиперссылки для обеспечения согласованности. Некоторые свойства Гиперссылки используют значения по умолчанию из значения расширения разметки {ThemeResource}, предоставленного системой. Это позволяет переключить внешний вид гиперссылки соответствующим образом, когда пользователь изменяет системную тему во время выполнения.

Цвет гиперссылки по умолчанию — это цвет акцента системы. Для переопределения этого свойства можно задать свойство Foreground .

Получение кода примера

  • Пример коллекции WinUI. Просмотрите все элементы управления XAML в интерактивном формате.