Scrollable textblock within a ListItem (or other container)?

I do love Silverlight, but it does seem that the simplest of tasks are often the hardest to do. Today I wanted to have a nice little grid structure as my List Item data template and for one of the grids to contain a text block. There might be lot of text in there so I wanted the text block to be scrollable, sounds easy. So I thought I would just do;

<TextBlock Text="bla…" ScrollViewer.VerticalScrollBarVisibility="Visible" TextWrapping="Wrap"></TextBlock>

 

Alas that doesn’t actually create a scrollbar – looks so promising. Anyway without boring you with all the various attempts I finally settled on this;

<Grid Height="149" Width="290">

        <Grid.ColumnDefinitions>

          <ColumnDefinition Width="60"/>

          <ColumnDefinition Width="200"/>

        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="Col0"></TextBlock>

        <StackPanel Grid.Column="1">

          <TextBlock Text="Header"></TextBlock>

          <ContentControl  Height="100" >

            <ScrollViewer VerticalScrollBarVisibility="Visible">

              <TextBlock  TextWrapping="Wrap"

                     Text="Vestibulum vestibulum adipiscing parturient vestibulum vestibulum adipiscing parturient vestibulum

                     vestibulum adipiscing parturient vestibulum vestibulum adipiscing parturient vestibulum vestibulum adipiscing

                     parturient vestibulum vestibulum adipiscing parturient vestibulum vestibulum adipiscing parturient vestibulum

                     vestibulum adipiscing parturient vestibulum vestibulum adipiscing parturient vestibulum vestibulum adipiscing

                     parturient vestibulum vestibulum adipiscing parturient vestibulum xxxxxxxxxx xxxxxxxxxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxx

                     yyyyyyyyyyy yyyyyyyyyyyyyyyyy yyyyyyyyyyyyyyyy yyyyyyyyyyy">

              </TextBlock>

            </ScrollViewer>

          </ContentControl>

          <TextBlock Text="Footer"></TextBlock>

        </StackPanel>       

      </Grid>

Hope it helps someone else (apart from being a bookmark for when I forget how I did it).

One thought on “Scrollable textblock within a ListItem (or other container)?

  1. Mario February 1, 2011 / 4:08 pm

    Glad I came across your posting. I thought there was something wrong with me. I am not sure how this feature of the textblock is supposed to be used “ScrollViewer.VerticalScrollBarVisibility” but it did not work for me also. Maybe something to do with the template and theming. Anyhow, adding a wrapping ScrollViewer did not completely solve it for me until I played with the maxHeight. Here is my code. Thank you for putting me on the right track.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s