Как показать всплывающую подсказку, где выделен текст в текстовом блоке - PullRequest
Новая
       34

Как показать всплывающую подсказку, где выделен текст в текстовом блоке

2 голосов
/ 13 марта 2019

Я хочу добавить всплывающее окно к своему TextBlock, и когда я выбираю текст в TextBlock, всплывающее окно будет отображаться в выбранном (что-то вроде режима чтения в Microsoft Edge, когда вы выбираете текст в чтениирежим, появится всплывающее окно, показывающее определение слова).Но я не знаю как.Я пытался использовать SelectionChanged, но параметры, которые передает это событие, не имеют позиции, которую я могу использовать для установки flyout.Так как я могу это сделать?Кроме того, мне интересно, для чего SelectionFlyout?Я думал, что это может помочь мне.Вот мой код: 

<TextBlock x:Name="webviewtest" Grid.Row="1" Text="This is a select-flyout test." FontSize="300" IsTextSelectionEnabled="true" >
    <TextBlock.SelectionFlyout>
        <Flyout>
            <TextBlock Text="this is the flyout"></TextBlock>
        </Flyout>
    </TextBlock.SelectionFlyout>
</TextBlock>

И когда я выделил текст, всплывающее окно так и не появилось.Очевидно, что я использовал это неправильно.Поэтому я проверил Microsoft Docs и там было указано

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

И я не могу найти образцы об этом в Интернете.

Ответы [ 2 ]

0 голосов
/ 23 марта 2019

Вам нужно использовать RichTextBlock для замены TextBlock, а платформа 17134 и ниже. 

    <RichTextBlock HorizontalAlignment="Center"
                   VerticalAlignment="Center"
                   IsTextSelectionEnabled="True">
        <RichTextBlock.ContextFlyout>
            <Flyout>
                <TextBlock Text="flyout" />
            </Flyout>
        </RichTextBlock.ContextFlyout>
        <RichTextBlock.SelectionFlyout>
            <Flyout>
                <TextBlock Text="this is the flyout" />
            </Flyout>
        </RichTextBlock.SelectionFlyout>
        <Paragraph>
            welcome to blog.lindexi.com that has many blogs
        </Paragraph>
    </RichTextBlock>

SelectionFlyout работает в контакте.TextBlock.SelectionFlyout не работает · Выпуск № 452 · Microsoft / microsoft-ui-xaml

Весь код в github

enter image description here

0 голосов
/ 13 марта 2019

Этого можно достичь, установив TextBlock IsTextSelectionEnabled в True и используя MenuFlyout для отображения выбранного текста.

XAML 

    <TextBlock x:Name="webviewtest" Text="This is a select-flyout test." FontSize="100"  IsTextSelectionEnabled="True" RightTapped="webviewtest_RightTapped">
        <FlyoutBase.AttachedFlyout>
            <MenuFlyout x:Name="Flyout">
                <MenuFlyout.Items>
                    <MenuFlyoutItem x:Name="FlyItem" Text="">
                    </MenuFlyoutItem>
                </MenuFlyout.Items>
            </MenuFlyout>
        </FlyoutBase.AttachedFlyout>
    </TextBlock>

C # 

    private void webviewtest_RightTapped(object sender, RightTappedRoutedEventArgs e)
    {
        TextBlock tb = sender as TextBlock;

        if (tb.SelectedText.Length > 0)
        {
            Item.Text = tb.SelectedText;
        }
        // Show at cursor position
        Flyout.ShowAt(sender as UIElement, e.GetPosition(sender as UIElement));
    }
...