Question

我有一个包裹在WrapPanel中的视图，因此我可以使用FluidMoveBehaviors在调整大小时在屏幕上移动元素。然后我通过ContentControl将它拉到另一个视图的ScrollViewer中。

我的问题是，当我使用HorizontalScrollBarVisibility =“Auto”时，WrapPanel不再包装，而只是放置HorizontalScrollBar，如果我禁用它，它工作正常但是当窗口调整大小时我在视口中丢失视图因为没有水平滚动条。我尝试了其他地方找到的一些技巧，如绑定scrollviewer的宽度元素，如Width =“{Binding ElementName = ScrollViewer，Path = ViewportWidth}”，但仍然没有运气，我想知道一种方法让ScrollViewer仍然尊重WrapPanel因此，当窗口重新调整大小时，我的元素仍会浮动到底部，但在必要时也提供HorizontalScrollBar（顺便提一下所有Silverlight。）感谢任何看过的人。

        <ScrollViewer x:Name="AgentSV" Grid.Row="1" Style="{StaticResource StandardScrollViewerStyle}" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" HorizontalContentAlignment="Stretch" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent" Margin="0,5,0,0">
            <i:Interaction.Behaviors>
                <Behaviors1:ScrollViewerAutoScrollBehavior />
            </i:Interaction.Behaviors>
            <ContentControl  x:Name="ActiveItem" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" />
</ScrollViewer>



        <toolkit:WrapPanel HorizontalAlignment="Stretch" Orientation="Horizontal" VerticalAlignment="Stretch" 
Width="{Binding ElementName=AgentSV, Path=ViewportWidth}">
                <i:Interaction.Behaviors>
                    <ei:FluidMoveBehavior AppliesTo="Children">
                        <ei:FluidMoveBehavior.EaseY>
                            <QuadraticEase EasingMode="EaseInOut"/>
                        </ei:FluidMoveBehavior.EaseY>
                        <ei:FluidMoveBehavior.EaseX>
                            <QuadraticEase EasingMode="EaseInOut"/>
                        </ei:FluidMoveBehavior.EaseX>
                    </ei:FluidMoveBehavior>
                </i:Interaction.Behaviors>

    .... A ton of other elements nested in the WrapPanel ...

    </toolkit:WrapPanel>

Answer 1

如果我理解正确，下一个解决方案可能会对您有所帮助：

创建一个继承自ItemsControl的类

    public class MyItemsControl: ItemsControl
    {
      public MyItemsControl( )
      {
        this.DefaultStyleKey = typeof( MyItemsControl );
      }
    }

    //And this in your Page

    <local:MyItemsControl>
      <local:MyItemsControl.Style>
        <Style TargetType="local:MyItemsControl">
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="local:MyItemsControl">
                <Grid>
                  <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}"
                          BorderThickness="{TemplateBinding BorderThickness}">
                    <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
                      <ItemsPresenter />
                    </ScrollViewer>
                  </Border>
                </Grid>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
          <Setter Property="ItemsPanel">
            <Setter.Value>
              <ItemsPanelTemplate>
                <toolkit:WrapPanel />
              </ItemsPanelTemplate>
            </Setter.Value>
          </Setter>
        </Style>
      </local:MyItemsControl.Style>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
      <Button Width="110" Height="110"/>
    </local:MyItemsControl>

WrapPanel通过ContentControl嵌入ScrollViewer

1 个答案: