Geek Answers Handbook

Silverlight RichTextBox / ListBox / ScrollViewer weird behavior

I have a user control with the following XAML:

<ScrollViewer> <ListBox ItemsSource="{Binding Items}"> <ListBox.ItemTemplate> <DataTemplate> <RichTextBox> <Paragraph> <Run Text="{Binding}"/> </Paragraph> </RichTextBox> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </ScrollViewer>

And the code behind:

 public partial class MainPage { public MainPage() { InitializeComponent(); Items = new ObservableCollection<string>(Enumerable.Range(0, 100).Select(x => "some text")); DataContext = this; } public ObservableCollection<string> Items { get; set; } }

When this code works, the vertical scroll bar for the ScrollViewer goes down. However, if I remove the binding in Run in a RichTextBox and copy the text:

 <Run Text="some text"/>

Now the scroll bar is at the top (as you would expect).

This is mistake? If not, what happens? How can I fix this (note: this is a simplified XAML, I need a ScrollViewer, because the ListBox is actually in the grid)?

+4
source share
6 answers

I finally came up with a solution to this problem. I removed the ScrollViewer from the RichTextBox template.

0
source

I cannot tell you why ScrollViewer behaves this way, but I would change XAML to the following. Then the scroller is on top if you use the binding or not in the DataTemplate.

XAML:

 <ListBox ScrollViewer.VerticalScrollBarVisibility="Auto" ItemsSource="{Binding Items}"> <ListBox.ItemTemplate> <DataTemplate> <RichTextBox> <Paragraph> <Run Text="{Binding}"/> </Paragraph> </RichTextBox> </DataTemplate> </ListBox.ItemTemplate> </ListBox>
0
source

Make a fixed width, and the height of the scrollviewer depends on the size of the grid and the size of the column. this helps fix the size at runtime. like this

 <ScrollViewer VerticalScrollBarVisibility="Auto" VerticalAlignment="Top" HorizontalScrollBarVisibility="Auto" Width="135" Height="463"> <ListBox ItemsSource="{Binding Items}"> <ListBox.ItemsPanel> <ItemsPanelTemplate> <StackPanel Orientation="Vertical"></StackPanel> </ItemsPanelTemplate> </ListBox.ItemsPanel> <ListBox.ItemTemplate> <DataTemplate> <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left" Orientation="Vertical"> <RichTextBox> <Paragraph> <Run Text="{Binding}"/> </Paragraph> </RichTextBox> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox>

I hope its useful

0
source

try setting the height of the list for auto and set the height of scrollviewer. This way, scrollbars are only displayed when the height of the list exceeds the height of the scrollviewer.

But looking at a way to define objects. You will have one big problem in the future. That is, in SL4, Listboxes are tall and not returning it. Therefore, if you have something that expands inside the list (that is, Accordion elements) or allows deletion within the list, the list will expand to display all of its elements. But once the item is deleted, it will never return height. As a result, your scroll bar will always be displayed, even if you have nothing more to show below.

This is completely out of topic, but I felt like I should let you know.

I hope I helped, if not now, then for the future.

0
source

Set MaxHeight to Listbox, this will allow the scrollviewer screen to appear only if the screen size is too small.

0
source

Thank you very much! You just saved me from suffering and suffering ... :)

For those (like me) who are wondering how to remove scrollviewer from the rtb template: Extract the template using blending. Find the scrollviewer element and replace it on the stack (keep the x: name attribute).

0
source

More articles:


All Articles