locked
Scroll of RichTextBlock in windows 8 apps

    Question

  • I have a RichTextBlock in a ScrollViewer. The content of the RichTextBlock is very long. How can I scroll those text inside RichTextBlock? I want to implement scrolling with in the Rich text Block as the text goes on appending with in the text block. The input has been given through a text box & those text of text box are appended into Rich Text block.
    Monday, May 19, 2014 10:47 AM

Answers

  • I know where you got the problem by viewing your code, you set a static height for the RichTextBlock, therefore the scrollviewer cannot detect that the RichTextBlock increase the height.

    Try with my code to see if it fit your requirement.

    XAML :

            <ScrollViewer x:Name="scrollViewerChat"
                               Width="1200"
                               Height="350"                         
                               VerticalScrollBarVisibility="Visible"
                               VerticalScrollMode="Enabled">
    
                <RichTextBlock x:Name="rchChatBlock"
                                    Grid.Row="0"
                                    Width="1200"
                                    FontSize="40"
                                    Foreground="White">
    
                    <Paragraph x:Name="rchParagraph" ScrollViewer.VerticalScrollBarVisibility="Visible">
                        <Run x:Name="runbox" />
                    </Paragraph>
                </RichTextBlock>
            </ScrollViewer>
            <Button Content="Button" HorizontalAlignment="Left" Height="45" Margin="1193,124,0,0" VerticalAlignment="Top" Width="104" Click="Button_Click"/>
    

    CS:

            private void Button_Click(object sender, RoutedEventArgs e)
            {
                runbox.Text += "I have a RichTextBlock in a ScrollViewer. The content of the RichTextBlock is very long. How can I scroll those text inside RichTextBlock? I want to implement scrolling with in the Rich text Block as the text goes on appending with in the text block. The input has been given through a text box & those text of text box are appended into Rich Text block.";
            }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Tuesday, May 20, 2014 6:02 AM
    Moderator

All replies

  • Hi Jivraj,

    RichTextBlock itself does not have a ScrollViewer in its template, why not put a ScorllViewer outside of your RichTextBlock to make RichTextBlock looks like scrollable? Or what is your scenario?

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Tuesday, May 20, 2014 2:35 AM
    Moderator
  • I have used the Scrollviewer outside of Rich Text Block .But as the content of Rich TextBlock goes on increasing the scrollviewer doesn't work.

     <ScrollViewer x:Name="scrollViewerChat"
                              Width="1200"
                              Height="350"                         
                              VerticalScrollBarVisibility="Visible"
                              VerticalScrollMode="Auto">

                    <RichTextBlock x:Name="rchChatBlock"
                                   Grid.Row="0"
                                   Width="1200"
                                   Height="350"
                                   FontSize="40"
                                   Foreground="Black">

                        <Paragraph x:Name="rchParagraph" ScrollViewer.VerticalScrollBarVisibility="Visible">
                            <Run />
                        </Paragraph>
                    </RichTextBlock>
                </ScrollViewer>

    Tuesday, May 20, 2014 4:35 AM
  • I know where you got the problem by viewing your code, you set a static height for the RichTextBlock, therefore the scrollviewer cannot detect that the RichTextBlock increase the height.

    Try with my code to see if it fit your requirement.

    XAML :

            <ScrollViewer x:Name="scrollViewerChat"
                               Width="1200"
                               Height="350"                         
                               VerticalScrollBarVisibility="Visible"
                               VerticalScrollMode="Enabled">
    
                <RichTextBlock x:Name="rchChatBlock"
                                    Grid.Row="0"
                                    Width="1200"
                                    FontSize="40"
                                    Foreground="White">
    
                    <Paragraph x:Name="rchParagraph" ScrollViewer.VerticalScrollBarVisibility="Visible">
                        <Run x:Name="runbox" />
                    </Paragraph>
                </RichTextBlock>
            </ScrollViewer>
            <Button Content="Button" HorizontalAlignment="Left" Height="45" Margin="1193,124,0,0" VerticalAlignment="Top" Width="104" Click="Button_Click"/>
    

    CS:

            private void Button_Click(object sender, RoutedEventArgs e)
            {
                runbox.Text += "I have a RichTextBlock in a ScrollViewer. The content of the RichTextBlock is very long. How can I scroll those text inside RichTextBlock? I want to implement scrolling with in the Rich text Block as the text goes on appending with in the text block. The input has been given through a text box & those text of text box are appended into Rich Text block.";
            }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Tuesday, May 20, 2014 6:02 AM
    Moderator
  • Thanks Jamles Hez for your help. Its work for me .
    Tuesday, May 20, 2014 7:03 AM