Windows Phone 8 - StackPanel 中的 TextBlock 没有正确包装文本？答案

【问题标题】：Windows Phone 8 - TextBlock in StackPanel not wrapping Text properly?Windows Phone 8 - StackPanel 中的 TextBlock 没有正确包装文本？
【发布时间】：2013-12-13 13:05:33
【问题描述】：

我有一个基于全景控件的应用程序。单击 Panorama 控件页面（选项卡）之一上的项目会转到 details 页面。在该详细信息页面上，我有下面呈现项目内容的 XAML。如您所见，phone:PanoramaItem.Header 元素中有一个由 StackPanel 托管的 TextBlock。我希望该元素中的文本 wrap TextBlock 在视图模型中绑定到的视频标题。我将 TextWrapping 设置为 wrap 并为其分配了固定宽度，因此 TextBlock 不会增长/扩展（因此不会裹）。文本确实换行了，但有些行仍然出现剪裁，有些单词出现“截断”。我的 XAML 有什么问题？

我读到了关于使用 DockPanel 的信息：

TextBlock Wrapping in WPF Layout

但是这个应用程序有一个 StackPanel 用于许多不同的页面，所以如果我可以坚持使用 StackPanel，我会更喜欢它。

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Visibility="{Binding IsInternetAvailable}" Background="{StaticResource PhoneAccentBrush}" Height="30">
        <TextBlock Text="{Binding Path=LocalizedResources.NoConnection, Source={StaticResource LocalizedStrings}}" Margin="10, 0"/>
    </Grid>
    <phone:Panorama x:Name="PanoramaFavorites_DetailVideos" Grid.Row="2" Foreground="{StaticResource CustomApplicationTextBrush}" Background="{StaticResource CustomApplicationBackgroundImage}" SelectionChanged="panoramaFavorites_DetailVideos_SelectionChanged">
        <phone:Panorama.Title>
            <StackPanel Orientation="Horizontal" Margin="0,15,0,0">
                <Image Height="85" Width="85" Source="http://appstudiodata.blob.core.windows.net/apps/1383/db936107-bce6-41a2-9d95-1d342f66c6bb/res/Logo-b3883645-a6cd-4cc8-82be-97c87a266656.png" Stretch="Uniform" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="5,0,10,5" RenderTransformOrigin="0.5,0.5" />
                <TextBlock FontSize="92" Text="Robot Videos" FontFamily="Segoe WP Light" Foreground="{StaticResource CustomTitleApplicationTextBrush}" VerticalAlignment="Stretch"/>
            </StackPanel>
        </phone:Panorama.Title>
        <phone:PanoramaItem x:Name="PanoramaFavorites_DetailVideos0" Margin="0,0,0,25">
            <phone:PanoramaItem.Header>
                <StackPanel Orientation="Horizontal" Margin="0,7,0,0">
                    <TextBlock Text="{Binding CurrentYouTubeVideo.Title, Converter={StaticResource SanitizeString}}" Foreground="{StaticResource CustomApplicationTextBrush}" FontSize="36" TextWrapping="Wrap" Width="440" Height="170"/>
                </StackPanel>
            </phone:PanoramaItem.Header>
            <ctl:FlipControl NextElementCommand="{Binding NextpanoramaFavorites_DetailVideos0}" PreviousElementCommand="{Binding PreviouspanoramaFavorites_DetailVideos0}" ShowPreviousButton="{Binding HasPreviouspanoramaFavorites_DetailVideos0}" ShowNextButton="{Binding HasNextpanoramaFavorites_DetailVideos0}">
                <ctl:FlipControl.InnerContent>
            <Grid Margin="10,5,5,5">    
                <ScrollViewer>
                        <ctl:YouTubePlayer Margin="0,10" MaxHeight="250" VerticalAlignment="Top" VideoId="{Binding CurrentYouTubeVideo.VideoId, TargetNullValue={StaticResource DefaultNoImageValue}}"/>
                </ScrollViewer>
            </Grid>
                </ctl:FlipControl.InnerContent>
            </ctl:FlipControl>
        </phone:PanoramaItem>
    </phone:Panorama>
</Grid>

【问题讨论】：

您正在指定它的确切大小，那么当您给它的空间有太多文本无法容纳时，您希望它如何表现？
@steveg89 我希望它使用分词符将文本换行到下一行，以决定当单词超过 TextBlock 的指定宽度时在何处进行换行。

标签： c# xaml windows-phone-8 word-wrap textblock

【解决方案1】：

根据您的 cmets，这对我有用：

<StackPanel Orientation="Vertical" Margin="0,7,0,0">
    <TextBlock Text="{Binding CurrentYouTubeVideo.Title, Converter={StaticResource SanitizeString}}" 
               Foreground="{StaticResource CustomApplicationTextBrush}" 
               FontSize="36" 
               TextWrapping="Wrap" 
               MaxWidth="440"/>
</StackPanel>

【讨论】：