8

我有一个应用程序，我在其中使用 XAML 来表示我自己的自定义对象图。它与 WPF/Silverlight 对象模型完全不同（并且不用于 UI 设计），但可以以有意义的方式可视化对象图。我想做的是向 Visual Studio 添加一个设计器扩展来可视化我的特定对象，但我一直无法找到有关此主题的信息。有人能指出我正确的方向吗？

我的主要目标是对当前 XAML 有一些简单的视觉反馈；我还没有到需要设计师支持视觉编辑的地步。如果有人好奇，它是模拟工业机械的工具；我使用 XAML 来定义机器的组件及其连接，但我目前必须运行完整的模拟来查看机器的外观。

4

3 回答 3

11

您需要创建一个解析文件并可视化内容的 Visual Studio 扩展 (vsix)。您有两个选项，Visual Studio 加载项或 Visual Studio 包（请参阅问题1139294中差异的详细信息）。第一个更容易开始，但后者会给你更多的控制权，所以如果你将来有编辑的想法，我推荐它。

首先下载用于创建 Visual Studio 扩展的 SDK，即Visual Studio 2010 SP1 SDK。对于较旧的非 SP1 版本，请单击此处。

您需要熟悉如何创建 Visual Studio 包。有关 Microsoft 教程，请参阅演练：创建 VSPackage。如果您遵循本教程，您应该拥有从菜单命令触发自定义组件所需的一切。因此，现在您真正需要的只是一个可以解析/可视化您的自定义 XAML 的普通 WPF 组件。您可能还需要将您的自定义文件类型与您的组件相关联。为此，您需要一个ProvideEditorExtensionAttribute。

没有比样例更好的了，因此请参阅样例库中的 IDE 样例编辑器。这将创建一个小文件编辑器自定义文件类型，这与您所要求的很接近。用你的编辑器替换文件编辑器组件和相关的文件类型，你就差不多完成了！

于 2012-01-31T18:13:15.163 回答
0

另请参阅以下内容，http://code.msdn.microsoft.com/windowsdesktop/Designer-View-Over-XML-20a81f17，这是您想要的一个很好的示例。

于 2013-01-22T18:34:01.337 回答
0

ProvideXmlEditorChooserDesignerViewAttribute 是您正在寻找的东西，尽管您必须如何做到这一点才能使其以这种方式工作有点奇怪。 https://msdn.microsoft.com/en-us/library/microsoft.visualstudio.modeling.shell.providexmleditorchooserdesignerviewattribute_properties.aspx

我刚刚在我自己的扩展中得到了这个工作，而且非常简单（一旦你有了神奇的公式）。从 VS 可扩展性示例“带工具箱的编辑器”（https://github.com/Microsoft/VSSDK-Extensibility-Samples/tree/master/Editor_With_Toolbox）工作，请按照下列步骤操作：

  1. 将自定义文件扩展名从 .tbx 更改为 .xaml。这并不太难，主要只是用 .xaml 查找+替换 .tbx 并将 tbx.tbx 文件更改为 xaml.xaml 并在解决方案中的每个文件中查找+替换。这将您的 EditorFactory 标记为为 .xaml 文件提供编辑器。

  2. 打开 EditorPackage.cs 并删除 ProvideEditorExtension 和 ProvideEditorLogicalView 属性。用这些属性替换它们（显然用您的实际字符串替换存根字符串）。

    [ProvideXmlEditorChooserDesignerView("UnimportantDesignerViewName", "xaml",
    LogicalViewID.Designer, 10000,
    DesignerLogicalViewEditor = typeof(EditorFactory),
    Namespace = "YourNamespace",
    MatchExtensionAndNamespace = true)]
[ProvideXmlEditorChooserDesignerView("UnimportantDesignerViewName_Enforced", "xaml",
    LogicalViewID.Designer, 10001,
    DesignerLogicalViewEditor = typeof(EditorFactory))]
[ProvideEditorLogicalView(typeof(EditorFactory), LogicalViewID.TextView)]
[ProvideEditorLogicalView(typeof(EditorFactory), LogicalViewID.Code)]
[ProvideEditorLogicalView(typeof(EditorFactory), LogicalViewID.Designer)]
[ProvideEditorLogicalView(typeof(EditorFactory), LogicalViewID.Debugging)]

  3. 打开 EditorFactory.cs 并编辑 CreateEditorInstance 方法。在这里，您将打开由 pszMkDocument 文件路径参数指定的 .xaml 文件，并验证它是您的文件之一（例如，它使用您的架构或其他东西）。如果是这样，输出您的 EditorFactory Guids 并返回 S_OK。如果不是（例如，如果它是 WPF .xaml 文件），则输出 Guid.Empty 并返回 VS_E_UNSUPPORTEDFORMAT。

    string extension = System.IO.Path.GetExtension(pszMkDocument);
if (extension.Equals(".xaml", StringComparison.OrdinalIgnoreCase))
{
    using (System.Xml.XmlReader reader = System.Xml.XmlReader.Create(pszMkDocument))
    {
        reader.MoveToContent();
        if (reader.NodeType == System.Xml.XmlNodeType.Element)
        {
            if (reader.NamespaceURI.Equals("YourNamespace", StringComparison.OrdinalIgnoreCase))
            {
                EditorPane newEditor = new EditorPane();
                ppunkDocView = Marshal.GetIUnknownForObject(newEditor);
                ppunkDocData = Marshal.GetIUnknownForObject(newEditor);
                pbstrEditorCaption = "";
                return VSConstants.S_OK;
            }
        }
    }
}
return VSConstants.VS_E_UNSUPPORTEDFORMAT;

我通过 Avalonia GitHub 代码库 ( https://github.com/AvaloniaUI/AvaloniaVS/blob/master/src/AvaloniaVS/Infrastructure/AvaloniaPackage.cs )偶然发现了这个神奇的属性公式，所以非常感谢那些人的计算这个出来。我刚刚在 VS 2017 社区中实现了这一点，它对我来说就像一个魅力。祝所有偶然发现这个尝试完成同样神秘任务的人好运。=)

于 2018-08-28T04:31:14.803 回答