沿滚动条在滚动查看器行中显示控件

Question

所以我有这样的场景，我在 ScrollViewer 中显示 Grid。我想以不影响滚动功能的方式在滚动条上显示组合框和图像，是这样的：

目前，每当滚动查看器可见时，它就会出现在新的一行中，我如何才能在同一行中沿着控件显示它？

这是我的 xaml 设计：

<DockPanel  LastChildFill="True">

    <!--Top Panel-->
    <Grid DockPanel.Dock="Top">
      --GridContent
    </Grid>

    <!--Bottom Panel-->
    <Grid DockPanel.Dock="Bottom">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>


        <ComboBox Grid.Column ="0"> 
        </ComboBox>

      <Image Grid.Column="1">

      </Image>
    </Grid>

    <ScrollViewer   HorizontalScrollBarVisibility="Auto"  HorizontalAlignment="Stretch"
                    VerticalScrollBarVisibility="Auto" VerticalAlignment="Stretch" >
        <Grid              
              HorizontalAlignment="Stretch" 
              VerticalAlignment="Stretch">
          -- Grid Content
        </Grid>
    </ScrollViewer>
</DockPanel>

目前是这样的:

Answer 1

我没有在 XAML 中看过这样做，但您可以在后面的代码中这样做：

public partial class MainWindow : Window
{
    private void IncrementColumn(UIElement element)
    {
        Grid.SetColumn(element, Grid.GetColumn(element) + 1);
    }

    public MainWindow()
    {
        InitializeComponent();

        scrollPanel.ApplyTemplate();

        var horizontal = scrollPanel.Template.FindName("PART_HorizontalScrollBar", scrollPanel) as ScrollBar;
        var vertical = scrollPanel.Template.FindName("PART_VerticalScrollBar", scrollPanel) as ScrollBar;
        var presenter = scrollPanel.Template.FindName("PART_ScrollContentPresenter", scrollPanel) as ScrollContentPresenter;
        var corner = scrollPanel.Template.FindName("Corner", scrollPanel) as Rectangle;
        var grid = corner.Parent as Grid;

        grid.ColumnDefinitions.Insert(0, new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Auto) });
        IncrementColumn(horizontal);
        IncrementColumn(vertical);
        IncrementColumn(corner);
        Grid.SetColumnSpan(presenter, 2);

        var panel = new StackPanel() { Orientation = Orientation.Horizontal };
        panel.Children.Add(new ComboBox());
        panel.Children.Add(new Image());

        Grid.SetRow(panel, 1);
        Grid.SetColumn(panel, 0);
        grid.Children.Add(panel);
    }
}

下面是 XAML 搭配：

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        Title="MainWindow" Height="150" Width="525">
        <ScrollViewer
            Name="scrollPanel"
            HorizontalScrollBarVisibility="Visible"
            HorizontalAlignment="Stretch"
            VerticalScrollBarVisibility="Auto"
            VerticalAlignment="Stretch">
            <Grid              
                HorizontalAlignment="Stretch" 
                VerticalAlignment="Stretch">
                <Image Source="C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"/>
            </Grid>
        </ScrollViewer>
</Window>

沿滚动条在滚动查看器行中显示控件

Show controls in Scrollviewer row along the Scrollbar

c#

wpf

xaml

scrollview