Cómo agregar barras de desplazamiento al panel envolvente

Primero agregue un control ScrollViewer, que se utiliza para mostrar barras de desplazamiento. Después de agregar, puede mostrar la barra de desplazamiento.

lt;ScrollViewer x: Name="scrList" Margin="0" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"gt;

lt;WrapPanel Margin="0"gt ;

lt;Rectangle Fill="#FF000000" Height="50" Width="50" Stroke="Negro" RadiusX="10" RadiusY="10" /gt;

lt; Relleno de rectángulo="#FF111111" Alto="50" Ancho="50" Trazo="Negro" RadiusX="10" RadiusY="10" /gt;

lt;Relleno de rectángulo ="#FF222222" Altura="50" Ancho="50" Trazo="Negro" RadiusX="10" RadiusY="10" /gt

……

lt; ;/WrapPanelgt;

lt;/ScrollViewergt;

En este momento hay un nuevo problema, debido a que se agrega la barra de desplazamiento, el ancho del control WarpPanel se cambia a adaptativo, y todos los controles internos están clasificados en la primera fila, y aquí quiero que el ancho se ajuste según la forma y la altura sea adaptable. Entonces, el ancho de WrapPanel está configurado para cambiar según ScrollView.

lt ScrollViewer x: Nombre="scrList" Margin="0" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"gt

lt; ="{Binding ElementName=scrList, Path=Width, Mode=OneWay}"gt;

lt; Rectángulo Fill="#FF000000" Height="50" Width="50" Stroke="Negro" RadiusX="10" RadiusY="10" /gt;

lt;Rectangle Fill="#FF111111" Height="50" Ancho="50" Stroke="Negro" RadiusX="10" RadiusY ="10" /gt;

lt;Rectangle Fill="#FF222222" Height="50" Ancho="50" Stroke="Negro" RadiusX="10" RadiusY="10" /gt ;

......

lt;/WrapPanelgt;

lt;/ScrollViewergt;

WrapPanel ahora ha sido implementado según el contenido mostrado, la función de barra de desplazamiento aparece automáticamente.