8

XAMLのWindowsストアアプリで適切にフォーマットされたハイパーリンクを作成するにはどうすればよいですか?インラインハイパーリンクを作成してみましたが、staticresourceを使用してスタイルを設定したいと思います。

          <RichTextBlock Style="{StaticResource PageHeaderTextStyle}" Grid.ColumnSpan="2">
            <Paragraph>
                <Run>"A sentence with inline text "</Run>
                <InlineUIContainer>
                    <HyperlinkButton Background="Yellow">
                        my link
                    </HyperlinkButton>
                </InlineUIContainer>
                <Run>... some more text</Run>
            </Paragraph>
        </RichTextBlock>

ハイパーリンクが文の残りの部分と整列していない場合、次のようになります。

ここに画像の説明を入力してください

4

3 に答える 3

8

まあ、私はこれを無駄に試しました:

<RichTextBlock FontSize="20">
    <Paragraph Foreground="White" FontFamily="Segoe UI Light">
        <Run>Now is the time for</Run>
        <InlineUIContainer>
            <HyperlinkButton Content="all good men">
                <HyperlinkButton.Template>
                    <ControlTemplate>
                        <TextBlock Margin="5,0,5,0"  FontSize="20" FontFamily="Segoe UI Light"
                                    Text="{Binding Content, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                    </ControlTemplate>
                </HyperlinkButton.Template>
            </HyperlinkButton>
        </InlineUIContainer>
        <Run>to come to the aid of their country</Run>
    </Paragraph>
</RichTextBlock>

そして、私はこれを試しました:

<RichTextBlock FontSize="20">
    <Paragraph Foreground="White" FontFamily="Segoe UI Light">
        <Run>Now is the time for</Run>
        <InlineUIContainer>
            <TextBlock Margin="5,0,5,0" Tapped="TextBlock_Tapped_1">
                <Underline><Run Text="all good men" /></Underline>
            </TextBlock>
        </InlineUIContainer>
        <Run>to come to the aid of their country</Run>
    </Paragraph>
</RichTextBlock>

これは魅力のように機能します!

ここに画像の説明を入力してください

独自のハイパーリンクボタンを実装するのはもう少し手間がかかるというふりをしているわけではありませんが、このように考えてください。レイアウトを100%制御できます。そしてそれはそれの周りのフォントスタイルから簡単に継承します!

わかる?

于 2012-10-05T23:20:10.513 に答える
7

将来の読者のために、Windows 8.1を追加するだけでこのタスクが簡素化され、Windows 8.1はHyperlink要素をWindows.UI.Xaml.Documents名前空間のXAMLテキストオブジェクトモデルに追加するため、次のように簡単に使用できます。

<RichTextBlock>
  <Paragraph FontSize="22">Please click on this <Hyperlink NavigateUri="http://www.link.com">link</Hyperlink>, thanks !</Paragraph>
</RichTextBlock>

そしてそれはこのように見えます:

ここに画像の説明を入力してください

于 2014-01-13T16:08:46.763 に答える
1

私もこれを解決しようとしましたが、次のことを思いつきました。

<RichTextBlock HorizontalAlignment="Left" VerticalAlignment="Top">
<Paragraph xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" FontSize="12" FontFamily="Calibri" >
    <Run FontFamily="Calibri" FontSize="24">A sentence with inline text</Run>
    <InlineUIContainer>
        <HyperlinkButton FontSize="24" Background="Gray" Foreground="Blue" Template="{StaticResource HyperlinkButtonControlTemplate1}" BorderThickness="0" RenderTransformOrigin="0.5,0.5" Padding="0" FontFamily="Calibri">
            the link with g
        </HyperlinkButton>
    </InlineUIContainer>
    <Run FontFamily="Calibri" FontSize="24">and some more text</Run>
</Paragraph>

およびテンプレートは次のとおりです。

<ControlTemplate x:Key="HyperlinkButtonControlTemplate1" TargetType="HyperlinkButton">
        <Grid>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="PointerOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
                                Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkPointerOverForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
                                Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkPressedForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
                                Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkDisabledThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="FocusVisualWhite"
                                Storyboard.TargetProperty="Opacity"
                                To="1"
                                Duration="0" />
                            <DoubleAnimation Storyboard.TargetName="FocusVisualBlack"
                                Storyboard.TargetProperty="Opacity"
                                To="1"
                                Duration="0" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused" />
                    <VisualState x:Name="PointerFocused" />
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <ContentPresenter x:Name="ContentPresenter"
                    Content="{TemplateBinding Content}"
                    ContentTransitions="{TemplateBinding ContentTransitions}"
                    ContentTemplate="{TemplateBinding ContentTemplate}" 
                    RenderTransformOrigin="0.5,0.5" 
                    Margin="1,0" 
                    HorizontalAlignment="Center" 
                    VerticalAlignment="Bottom" >
                <ContentPresenter.RenderTransform>
                    <CompositeTransform TranslateY="8"/>
                </ContentPresenter.RenderTransform>
            </ContentPresenter>

            <Rectangle x:Name="FocusVisualWhite"
                IsHitTestVisible="False"
                Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}"
                StrokeEndLineCap="Square"
                StrokeDashArray="1,1"
                Opacity="0"
                StrokeDashOffset="1.5" />
            <Rectangle x:Name="FocusVisualBlack"
                IsHitTestVisible="False"
                Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}"
                StrokeEndLineCap="Square"
                StrokeDashArray="1,1"
                Opacity="0"
                StrokeDashOffset="0.5" />
        </Grid>
    </ControlTemplate>

唯一の注意点は<CompositeTransform TranslateY="8"/>、フォントサイズの1/3に設定する必要があることです。この場合、フォントサイズは24であるため、8に設定する必要があります。理想的ではありませんが、目的の出力が生成されます。

更新:または以下を使用してください。これは、 http://code.msdn.microsoft.com/wpapps/Social-Media-Dashboard-135436daにあるソーシャルメディアWindows8ダッシュボードサンプルを 参照して得られたものです。

<Paragraph xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" FontSize="12" FontFamily="Calibri" >
<Run FontFamily="Calibri" FontSize="16">A sentence with inline text</Run>
<Span>
<InlineUIContainer>
        <HyperlinkButton FontSize="16" BorderThickness="0" Margin ="-10,-13" Foreground="Blue" FontFamily="Calibri">
        the link with g
    </HyperlinkButton>
</InlineUIContainer>
</Span>
<Run FontFamily="Calibri" FontSize="16">and some more text</Run>

于 2013-08-16T11:34:22.287 に答える