跳转到 UserControl 内的导航 [英] Jump to navigation inside a UserControl

问题描述

我目前正在尝试在我的应用中创建一个跳转到"菜单.我希望它的外观和工作方式类似于 Google 设计书 此处 在顶部，您可以在菜单中看到该页面每个部分的副标题(准确地说，导航部分带有内容、基线网格、关键线和间距等链接).如果可能的话，我希望它在不将其拆分为新的 MVVM 视图的情况下工作，所有这些都在一个 UserControl 中.是否可以创建一些关键字，然后像 HTML 一样制作带有转到"链接的菜单?

I am currently trying to make a "jump to" menu in my app. The way I would like it to look and work is such as one at Google design book here at the top, where you have the subtitles of every part of that page in a menu (to be precise, that navigation part with such links as Contents, Baseline Grids, Keylines and Spacing etc.). I'd like it to work without splitting it into new MVVM Views if possible, all inside one UserControl. Is it possible to create some keywords and just make a menu with "goto" links like in HTML?

<a href="#metrics-and-keylines-baseline-grids">Baseline Grids</a>

也许是自定义的 ScrollViewer?但是如何知道 UI 中每个元素的高度?

Maybe a custom ScrollViewer? But how would one know the height of every element in the UI?

推荐答案

每个框架元素都有一个 BringIntoView 方法.您可以定义超链接、按钮、菜单，以及能够调用命令的任何内容.该命令将一个元素作为参数，并且命令执行将调用 BringIntoView();

Every framework element has a BringIntoView method. You can define a hyperlink, or button, menu, whatever that is able to invoke a command. The command would take an element as a parameter, and the command execution would call BringIntoView();

一个简单的例子:

public class JumpToElementCommand : ICommand
{
    public void Execute(object parameter)
    {
        FrameworkElement frameworkElement = parameter as FrameworkElement;

        if (frameworkElement != null)
        {
            frameworkElement.BringIntoView();
        }
    }

    public bool CanExecute(object parameter)
    {
        return parameter is FrameworkElement;
    }

    public event EventHandler CanExecuteChanged
    {
        add { CommandManager.RequerySuggested += value; }
        remove { CommandManager.RequerySuggested -= value; }
    }
}

Xaml 用法:

<Window.Resources>
 <commands:JumpToElementCommand x:Key="JumpToElementCommand" />
</Window.Resources>

<Button Command="{StaticResource JumpToElementCommand}" CommandParameter="{Binding ElementName=FirstJump}" />

<Grid x:Name="FirstJump">
</Grid>

添加了 CommandManager.RequerySuggested 以便在加载后重新评估命令参数.

Added CommandManager.RequerySuggested so that the command parameter is reevaluated after loading.

这篇关于跳转到 UserControl 内的导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！