Silverlight RichTextBox/ListBox/ScrollViewer comportamiento extraño

Question

Tengo un control de usuario con el siguiente XAML:

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

Y código detrás:

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; }
}

Cuando se ejecuta este código, la barra de desplazamiento vertical del ScrollViewer baja a la parte inferior. Sin embargo, si elimino el enlace en Ejecutar en RichTextBox y codigo el texto:

<Run Text="some text"/>

Ahora la barra de desplazamiento se mantiene en la parte superior (como era de esperar).

¿Es esto un error? Si no, ¿qué está pasando? ¿Cómo puedo solucionar esto (nota: esto es XAML simplificado, necesito el ScrollViewer porque el ListBox está realmente en una grilla)?

Answer 1

Haga que el ancho y la altura fijos del scrollviewer dependan de la fila de la grilla y del tamaño de la columna. ayuda a tamaño fijo en tiempo de ejecución. como eso

<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>

Espero que sea útil

Answer 2

No puedo decirte por qué ScrollViewer se comporta así, pero cambiaría el XAML a lo siguiente. Luego está el desplazamiento en la parte superior, si usa enlace o no en DataTemplate.

XAML:

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

Answer 3

intente configurar la altura del list box en auto y hacer que la altura del scrollviewer sea fija. de esa forma, las barras de desplazamiento solo se muestran cuando la altura del cuadro de lista es mayor que la altura del scrollviewer.

Pero, mirando la forma en que se definen los objetos. Tendrás un gran problema en el futuro. Es decir, en SL4, los Listbox toman altura y no la devuelven. Entonces, si tiene algo que se expande dentro del cuadro de lista (es decir, elementos de Acordeón) o permite eliminar dentro del cuadro de lista, el cuadro de lista se expandirá para mostrar todos sus elementos. Pero una vez que se elimina un elemento, nunca devolverá la altura. El resultado sería que su barra de desplazamiento siempre se muestra incluso cuando no tiene nada más que mostrar en la parte inferior.

Eso está completamente fuera de tema pero sentí que debería hacértelo saber.

Espero haber ayudado, si no ahora, para el futuro.

Answer 4

Finalmente se me ocurrió una solución a este problema. Quité el ScrollViewer de la plantilla de RichTextBox.

Answer 5

Establezca MaxHeight en el Listbox, esto permitirá que el scrollviewer solo se muestre cuando las dimensiones de la pantalla son demasiado pequeñas.

Answer 6

Muchas gracias! Me acabas de salvar días de dolor y sufrimiento ... :)

Para aquellos (como yo) que se preguntan cómo eliminar el scrollviewer de la plantilla rtb: Extraiga la plantilla con blend. Encuentre el elemento scrollviewer y reemplácelo con un panel de distribución (mantenga el atributo x: name).