在Windows Phone 7中的文本块中格式化文本

时间:2014-07-30 00:26:42

标签: c# wpf windows-phone-7 windows-phone windows-phone-7.1

我的文字有粗体,下划线和斜体的html字符。例如

<b> hello<b> how are <i>you</i>. I am <u>fine</u>

我必须在WP7上的文本块中以格式化形式显示它。我有一个像这样的列表框

<ListBox x:Name="LBayaDetail" Loaded="LBayaDetail_Loaded" Margin="6,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                        <DataTemplate>
                        <Grid x:Name="ayaContent" Margin="0,6,0,0" Hold="ayaContent_Hold" Tap="ayaContent_Tap" Loaded="ayaContent_Loaded" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="6"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="80" />
                                <ColumnDefinition Width="6" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Grid Background="#FFC5AC88" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <TextBlock x:Name="ayaIndex" Text="{Binding aya}" FontSize="36" Margin="0" FontWeight="Bold" HorizontalAlignment="Center" />
                                <StackPanel VerticalAlignment="Bottom"  HorizontalAlignment="Center">
                                <Image Source="{Binding BookmarkImage}" HorizontalAlignment="Center" Width="48" Height="48" Margin="0,0,0,12" />
                                    <Image Source="{Binding NoteImage}" HorizontalAlignment="Center" Width="48" Height="48" Margin="0,0,0,12" />
                                    <Image Source="{Binding TagImage}" HorizontalAlignment="Center" Width="48" Height="48" Margin="0,0,0,12" />
                                </StackPanel>
                            </Grid>
                            <Grid Grid.Row="1" Background="#FFC5AC88" x:Name="Media" Tap="Media_Tap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Image Source="/Images/Media-Play(1).png" Width="30" Height="30" HorizontalAlignment="Center" Margin="12,0,0,0" VerticalAlignment="Top" />
                            </Grid>
                            <!--ini pak dimana tempat untuk ayat dan translasi-->
                            <Grid  Grid.Column="2" Background="#FFAC9574" Margin="6,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <TextBlock x:Name="aya" TextWrapping="Wrap" Text="{Binding text}" HorizontalAlignment="Right" FontFamily="/Fonts/me_quran2.ttf#me_quran2" FontSize="{Binding FontSizeAya}" Foreground="Black" Margin="24,0,12,-12" TextAlignment="Right" Visibility="{Binding visibility1}" />
                            </Grid>
                            <Grid Grid.Column="2" Grid.Row="1" Margin="6,0,0,0" Background="#FFAC9574" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <StackPanel>

                                    <TextBlock Visibility="{Binding visibility2}" x:Name="translation" Text="{Binding translation}" TextWrapping="Wrap" HorizontalAlignment="Right" FontFamily="/Fonts/ARIALUNI.TTF#Arial Unicode MS" FontSize="{Binding FontSizeTranslation}" Foreground="#FF5D2A07" Margin="12,6,6,0" />
                                    <TextBlock Visibility="{Binding visibility3}" x:Name="translation2" Text="{Binding translation2}" TextWrapping="Wrap" HorizontalAlignment="Right" FontFamily="/Fonts/ARIALUNI.TTF#Arial Unicode MS" FontSize="{Binding FontSizeTranslation}" Foreground="DarkGreen" Margin="12,20,6,0" />
                                </StackPanel>
                            </Grid>
                            <!-- -->
                        </Grid>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

我从

等数据库中获取
App.Listxyz = (Application.Current as App).db.SelectList<Aya>(strSelect);

并像这样将其分配给Listbox

LBayaDetail.ItemsSource = App.ListAyaBySurah;

并显示文本,并且不要将其格式化,这是显而易见的。我搜索了它,我能够使用&#34; RUN&#34;来格式化单个文本块。但我无法在列表框中执行此操作。 我也尝试使用HTMLTextBlock但它也没有格式化文本并显示它像这样

Hi
How 
Are 
You

我将非常感谢您如何使用不同的文本装饰格式化文本块。

由于

2 个答案:

答案 0 :(得分:0)

您应该在列表框中放置网格和堆栈面板。类似于以下内容

                <Grid>          
                    <StackPanel Grid.Column="1">
                        <TextBlock Padding="0,5,0,2" TextWrapping="Wrap">
                            <Run Text="{Binding test}" FontWeight="Bold" /> <Run Text="{Binding test2}" />
                            <LineBreak/>
                            <Run Text="{Binding test3}" />
                        </TextBlock>
                    </StackPanel>
                </Grid>

答案 1 :(得分:0)

一种方法是:

public class FormattedText
{
    public string Text { get; set; }
    public bool IsBold { get; set; }
    public bool IsItalic { get; set; }
    public bool IsUnderlined { get; set; }
}

有一个方法可以将存储在数据库中的HTML转换为上面的类列表

例如: 由此:

<b> hello<b> how are <i>you</i>. I am <u>fine</u>

到此:

  1. 第一要素:
    • Text =“hello”
    • IsBold = true
    • 跳过因bool默认值为false而不需要的内容
  2. 第二要素
    • Text =“how are”
    • 跳过因bool默认值为false而不需要的内容
  3. 第三项
    • Text =“you”
    • IsItalic = TRUE;
    • 跳过不需要的内容,因为bool默认值为false 等等....
  4. 然后使用另一种方法,从该列表中创建要添加到TextBlock或\ n的运行列表 也许会创建一个自定义TextBlock女巫从List<FormattedText>获取DataContext并通过将Run元素添加到自己

    来处理它