如何在WPF中实现这种UI？

我有两个面板，左边的站点代表选项或菜单的列表，右边是分配给左边的eatch菜单项的usercontrol列表，作为Listbox或items控件

要求是

例如，如果我将右侧面板中滚动条的拇指移动到usercontrol2附近，则标题面板中的usercontrol2标题应被激活，如果我将拇指移动到usercontrol1，则标题面板中的usercontrol1标题应被激活，依此类推

那么，如何继续实现这种用户界面呢。？非常感谢您的建议

基本思想是减少标题面板中的点击次数。右手边塞满了UI元素，所以用户希望避免在标题中不必要的点击。

---

用户不会单击左侧标题面板。在浏览右侧面板的scrollviewer时，标题应自动被选中，以向用户提供他正在输入或使用的控件。

我将使用滚动条控件，并以某种方式将其用作向上/向下按钮。如果向上移动滚动条，则转到下一个控件，同时向下移动

不确定您是否知道我的意思，请告诉我。

以下内容应该有效：

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0">
            <ItemsControl>
                <!--List on Left : List of Usercontrols-->
            </ItemsControl>
        </Border>
        <Border Grid.Column="1">
            <ScrollViewer VerticalScrollBarVisibility="Visible"
                          HorizontalScrollBarVisibility="Disabled">
                <ItemsControl>
                    <!--List on Right : List of Usercontrols-->
                </ItemsControl>
            </ScrollViewer>
        </Border>
    </Grid>

代码： 注:

---

这只是一个示例代码。这只是一种可能的方法。这不是一段非常健康的代码。可能需要进行一些重构。如果我向上或向下移动，我会将此逻辑包装在

附加属性

或

行为

中。我将如何识别控件？只需检查此处：我忘了提到您应该检查滚动事件。你可以将当前值与上一个值进行比较，然后你就知道你是在上升，还是在下降，以及上升了多少。我正要建议类似的方法。您的速度更快：）向上投票。用户不会单击左侧标题面板。在浏览右侧面板的scrollviewer时，标题应自动被选中，以向用户提供有关他现在输入的控件的信息？@Kishore Kumar：添加了一个可能的解决方案示例。过来看。

<Window x:Class="WpfApplication1.Window4"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window4"
        Height="300"
        Width="300">
    <Grid>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition Width="3*" />
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0">
            <ListBox Name="ListBox1"
                        ItemsSource="{Binding}"
                        HorizontalContentAlignment="Stretch">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Border Height="50"
                                BorderBrush="Black"
                                BorderThickness="1"
                                CornerRadius="5"
                                Padding="3">
                            <TextBlock Text="{Binding}" />
                        </Border>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Border>
        <Border Grid.Column="1">
            <ScrollViewer VerticalScrollBarVisibility="Visible"
                            HorizontalScrollBarVisibility="Disabled"
                            ScrollChanged="OnScrollChanged"
                            Name="ScrollViewer1">
                <ItemsControl ItemsSource="{Binding}">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border Height="250"
                                    BorderBrush="Black"
                                    BorderThickness="1"
                                    CornerRadius="5"
                                    Padding="3">
                                <TextBlock Text="{Binding}" />
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>
        </Border>
    </Grid>
    </Grid>
</Window>

public partial class Window4 : Window
{
    public Window4()
    {
        InitializeComponent();

        DataContext = Enumerable.Range(1, 25);
    }

    private void OnScrollChanged(object sender, ScrollChangedEventArgs e)
    {
        var element = ScrollViewer1.InputHitTest(new Point(5, 5));
        if (element != null)
        {
            if (element is FrameworkElement)
            {
                ListBox1.SelectedItem = (element as FrameworkElement).DataContext;
            }
        }
    }
}