找回密码
 立即注册
首页 业界区 业界 使用Visual Studio SDK制作GLSL词法着色插件

使用Visual Studio SDK制作GLSL词法着色插件

痕伯 2025-5-29 16:58:55
使用Visual Studio SDK制作GLSL词法着色插件

我们在Visual Studio上开发OpenGL ES项目时,避免不了写Shader。这时在vs里直接编辑shader就会显得很方便。但是vs默认是不支持GLSL的语法着色的,我们只好自己动手创造。最简单的实现自定义语法着色的方法就是创建一个VSIX插件包,我们只需要安装Visual Studio SDK,使用内置的模版就可以构建一个插件项目。
1. 安装Visual Studio SDK 
在http://www.microsoft.com/en-us/download/details.aspx?id=40758下载最新的Visual Studio 2013 SDK。
双击安装,一路next即可。
安装完毕后我们可以在新建项目->模版->C#中看到“扩展性”这一条目,这些就是开发插件用的模版了。
2. 创建插件项目

新建项目,在扩展性标签中,选择Editor Classifier模版,命名为ShaderEditor,点击确定。
Visual Studio为我们生成了如下几个文件。
1.png

ShaderEditorFormat.cs文件的默认代码如下: 
  1. 1     [Export(typeof(EditorFormatDefinition))]
  2. 2     [ClassificationType(ClassificationTypeNames = "ShaderEditor")]
  3. 3     [Name("ShaderEditor")]
  4. 4     [UserVisible(true)] //this should be visible to the end user
  5. 5     [Order(Before = Priority.Default)] //set the priority to be after the default classifiers
  6. 6     internal sealed class ShaderEditorFormat : ClassificationFormatDefinition {
  7. 7         /// <summary>
  8. 8         /// Defines the visual format for the "ShaderEditor" classification type
  9. 9         /// </summary>
  10. 10         public ShaderEditorFormat() {
  11. 11             this.DisplayName = "ShaderEditor"; //human readable version of the name
  12. 12             this.BackgroundColor = Colors.BlueViolet;
  13. 13             this.TextDecorations = System.Windows.TextDecorations.Underline;
  14. 14         }
  15. 15     }
复制代码
 
这段代码定义了一个名为"ShaderEditor"的着色类型,编译工程并运行,我们可以在Visual Studio实验实例的工具->选项->字体和颜色中找到一个名为"ShaderEditor"的条目。同时我们会发现所有文本文件的颜色都变成了Colors.BlueViolet并带上了下划线。修改this.DisplayName = "ShaderEditor"的内容,可以改变在字体和颜色中显示的名字。下面的格式设置可以任意修改成喜欢的样式,但要注意在这里的格式只是插件首次安装时的默认设置,这些条目和其它着色选项一样,都可以被用户任意更改。
  1. <strong>3. 创建GLSL的着色类型<br></strong>
复制代码
  1. [/code][code]我们已经了解了如何将着色类型添加到Visual Studio,现在修改ShaderEditorFormat.cs,添加我们的着色类型。
复制代码
  1. 1     [Export(typeof(EditorFormatDefinition))]
  2. 2     [ClassificationType(ClassificationTypeNames = "GLSLText")]
  3. 3     [Name("GLSLText")]
  4. 4     [UserVisible(true)]
  5. 5     [Order(Before = Priority.Default)]
  6. 6     internal sealed class GLSLTextFormatDefinition : ClassificationFormatDefinition {
  7. 7         public GLSLTextFormatDefinition() {
  8. 8             this.DisplayName = "GLSL文本";
  9. 9             this.ForegroundColor = Colors.Brown;
  10. 10         }
  11. 11     }
  12. 12
  13. 13     [Export(typeof(EditorFormatDefinition))]
  14. 14     [ClassificationType(ClassificationTypeNames = "GLSLIdentifier")]
  15. 15     [Name("GLSLIdentifier")]
  16. 16     [UserVisible(true)]
  17. 17     [Order(Before = Priority.Default)]
  18. 18     internal sealed class GLSLIdentifierFormatDefinition : ClassificationFormatDefinition {
  19. 19         public GLSLIdentifierFormatDefinition() {
  20. 20             this.DisplayName = "GLSL标识符";
  21. 21             this.ForegroundColor = Colors.Brown;
  22. 22         }
  23. 23     }
  24. 24
  25. 25     [Export(typeof(EditorFormatDefinition))]
  26. 26     [ClassificationType(ClassificationTypeNames = "GLSLComment")]
  27. 27     [Name("GLSLComment")]
  28. 28     [UserVisible(true)]
  29. 29     [Order(Before = Priority.Default)]
  30. 30     internal sealed class GLSLCommentFormatDefinition : ClassificationFormatDefinition {
  31. 31         public GLSLCommentFormatDefinition() {
  32. 32             this.DisplayName = "GLSL注释";
  33. 33             this.ForegroundColor = Colors.DarkGray;
  34. 34         }
  35. 35     }
  36. 36
  37. 37     [Export(typeof(EditorFormatDefinition))]
  38. 38     [ClassificationType(ClassificationTypeNames = "GLSLKeyword")]
  39. 39     [Name("GLSLKeyword")]
  40. 40     [UserVisible(true)]
  41. 41     [Order(Before = Priority.Default)]
  42. 42     internal sealed class GLSLKeywordFormatDefinition : ClassificationFormatDefinition {
  43. 43         public GLSLKeywordFormatDefinition() {
  44. 44             this.DisplayName = "GLSL关键字";
  45. 45             this.ForegroundColor = Colors.Blue;
  46. 46         }
  47. 47     }
  48. 48
  49. 49     [Export(typeof(EditorFormatDefinition))]
  50. 50     [ClassificationType(ClassificationTypeNames = "GLSLClass")]
  51. 51     [Name("GLSLClass")]
  52. 52     [UserVisible(true)]
  53. 53     [Order(Before = Priority.Default)]
  54. 54     internal sealed class GLSLClassFormatDefinition : ClassificationFormatDefinition {
  55. 55         public GLSLClassFormatDefinition() {
  56. 56             this.DisplayName = "GLSL类型";
  57. 57             this.ForegroundColor = Colors.Green;
  58. 58         }
  59. 59     }
  60. 60
  61. 61     [Export(typeof(EditorFormatDefinition))]
  62. 62     [ClassificationType(ClassificationTypeNames = "GLSLQualifier")]
  63. 63     [Name("GLSLQualifier")]
  64. 64     [UserVisible(true)]
  65. 65     [Order(Before = Priority.Default)]
  66. 66     internal sealed class GLSLQualifierFormatDefinition : ClassificationFormatDefinition {
  67. 67         public GLSLQualifierFormatDefinition() {
  68. 68             this.DisplayName = "GLSL限定符";
  69. 69             this.ForegroundColor = Colors.Pink;
  70. 70         }
  71. 71     }
  72. 72
  73. 73     [Export(typeof(EditorFormatDefinition))]
  74. 74     [ClassificationType(ClassificationTypeNames = "GLSLVariable")]
  75. 75     [Name("GLSLVariable")]
  76. 76     [UserVisible(true)]
  77. 77     [Order(Before = Priority.Default)]
  78. 78     internal sealed class GLSLVariableFormatDefinition : ClassificationFormatDefinition {
  79. 79         public GLSLVariableFormatDefinition() {
  80. 80             this.DisplayName = "GLSL系统变量";
  81. 81             this.ForegroundColor = Colors.DarkOrange;
  82. 82         }
  83. 83     }
  84. 84
  85. 85     [Export(typeof(EditorFormatDefinition))]
  86. 86     [ClassificationType(ClassificationTypeNames = "GLSLFunction")]
  87. 87     [Name("GLSLFunction")]
  88. 88     [UserVisible(true)]
  89. 89     [Order(Before = Priority.Default)]
  90. 90     internal sealed class GLSLFunctionFormatDefinition : ClassificationFormatDefinition {
  91. 91         public GLSLFunctionFormatDefinition() {
  92. 92             this.DisplayName = "GLSL系统函数";
  93. 93             this.ForegroundColor = Colors.DarkTurquoise;
  94. 94         }
  95. 95     }
复制代码
 
4. 导出着色类型
Editor Classifier使用了MEF框架,关于MEF的具体细节,请参考MSDN的相关文档。
我们需要注意的是,在MEF中,光定义了着色类型还不够,我们需要导出一个ClassificationTypeDefinition,才能在系统中生效。
打开ShaderEditorType.cs,我们看到系统生成的代码如下:
  1. 1     internal static class ShaderEditorClassificationDefinition {
  2. 2         [Export(typeof(ClassificationTypeDefinition))]
  3. 3         [Name("ShaderEditor")]
  4. 4         internal static ClassificationTypeDefinition ShaderEditorType = null;
  5. 5     }
复制代码
这里的Name与之前默认生成的ShaderEditor相同,同理,我们将这里的代码修改成方才定义的类型
  1. 1     internal static class ShaderEditorClassificationDefinition {
  2. 2         [Export(typeof(ClassificationTypeDefinition))]
  3. 3         [Name("GLSLText")]
  4. 4         internal static ClassificationTypeDefinition GLSLTextType = null;
  5. 5
  6. 6         [Export(typeof(ClassificationTypeDefinition))]
  7. 7         [Name("GLSLIdentifier")]
  8. 8         internal static ClassificationTypeDefinition GLSLIdentifierType = null;
  9. 9
  10. 10         [Export(typeof(ClassificationTypeDefinition))]
  11. 11         [Name("GLSLComment")]
  12. 12         internal static ClassificationTypeDefinition GLSLCommentType = null;
  13. 13
  14. 14         [Export(typeof(ClassificationTypeDefinition))]
  15. 15         [Name("GLSLKeyword")]
  16. 16         internal static ClassificationTypeDefinition GLSLKeywordType = null;
  17. 17
  18. 18         [Export(typeof(ClassificationTypeDefinition))]
  19. 19         [Name("GLSLClass")]
  20. 20         internal static ClassificationTypeDefinition GLSLClassType = null;
  21. 21
  22. 22         [Export(typeof(ClassificationTypeDefinition))]
  23. 23         [Name("GLSLQualifier")]
  24. 24         internal static ClassificationTypeDefinition GLSLQualifierType = null;
  25. 25
  26. 26         [Export(typeof(ClassificationTypeDefinition))]
  27. 27         [Name("GLSLVariable")]
  28. 28         internal static ClassificationTypeDefinition GLSLVariableType = null;
  29. 29
  30. 30         [Export(typeof(ClassificationTypeDefinition))]
  31. 31         [Name("GLSLFunction")]
  32. 32         internal static ClassificationTypeDefinition GLSLFunctionType = null;
  33. 33     }<br>
复制代码
 
5. 关联文件类型
打开ShaderEditor.cs
  1. 1     [Export(typeof(IClassifierProvider))]
  2. 2     [ContentType("text")]
  3. 3     internal class ShaderEditorProvider : IClassifierProvider {
  4. 4         [Import]
  5. 5         internal IClassificationTypeRegistryService ClassificationRegistry = null; // Set via MEF
  6. 6
  7. 7         public IClassifier GetClassifier(ITextBuffer buffer) {
  8. 8             return buffer.Properties.GetOrCreateSingletonProperty<ShaderEditor>(delegate { return new ShaderEditor(ClassificationRegistry); });
  9. 9         }
  10. 10     }
复制代码
代码ContentType("text")创建了一个Provider并将它们对所有text类型的文件生效。
GLSL主要的文件扩展名为.vsh和.fsh,为了只对这两个扩展名生效,我们需要自定义一个ContentType,并创建两个扩展名关联。将上述代码修改为:
  1. 1     [Export(typeof(ITaggerProvider))]
  2. 2     [ContentType("glsl")]
  3. 3     [TagType(typeof(ClassificationTag))]
  4. 4     internal sealed class GLSLClassifierProvider : ITaggerProvider {
  5. 5
  6. 6         [Export]
  7. 7         [Name("glsl")]
  8. 8         [BaseDefinition("code")]
  9. 9         internal static ContentTypeDefinition GLSLContentType = null;
  10. 10
  11. 11         [Export]
  12. 12         [FileExtension(".vsh")]
  13. 13         [ContentType("glsl")]
  14. 14         internal static FileExtensionToContentTypeDefinition GLSLVshType = null;
  15. 15
  16. 16         [Export]
  17. 17         [FileExtension(".fsh")]
  18. 18         [ContentType("glsl")]
  19. 19         internal static FileExtensionToContentTypeDefinition GLSLFshType = null;
  20. 20
  21. 21         [Import]
  22. 22         internal IClassificationTypeRegistryService classificationTypeRegistry = null;
  23. 23
  24. 24         [Import]
  25. 25         internal IBufferTagAggregatorFactoryService aggregatorFactory = null;
  26. 26
  27. 27         public ITagger<T> CreateTagger<T>(ITextBuffer buffer) where T : ITag {
  28. 28             return new GLSLClassifier(buffer, classificationTypeRegistry) as ITagger<T>;
  29. 29         }
  30. 30     }
复制代码
这样我们就创建了只针对vsh和fsh文件生效的Editor。
 
6. 使用gplex进行词法分析
我们需要使用词法分析扫描器来实现具体的着色功能,gplex可以为我们生成C#语言的扫描器,下载地址:
http://gplex.codeplex.com/
解压后在binaries文件夹下找到gplex.exe,把它拷贝到项目的根目录下。
在项目根目录下新建一个GLSL文件夹,新建GLSLLexer.lex文件。并把它们添加到proj中。
在proj上右键->属性,在生成事件选项卡中,在预先生成事件命令行中输入
cd $(ProjectDir)GLSL\
$(ProjectDir)\gplex GLSLLexer
打开GLSLLexer.lex,写入以下代码:
  1. 1 %option unicode, codepage:raw
  2. 2
  3. 3 %{
  4. 4         // User code is all now in ScanHelper.cs
  5. 5 %}
  6. 6
  7. 7 %namespace Shane
  8. 8 %option verbose, summary, noparser, nofiles, unicode
  9. 9
  10. 10 %{
  11. 11     public int nextToken() { return yylex(); }
  12. 12     public int getPos() { return yypos; }
  13. 13     public int getLength() { return yyleng; }
  14. 14 %}
  15. 15
  16. 16 //=============================================================
  17. 17 //=============================================================
  18. 18
  19. 19 number ([0-9])+
  20. 20 chars [A-Za-z]
  21. 21 cstring [A-Za-z_]
  22. 22 blank " "
  23. 23 delim [ \t\n]
  24. 24 word {chars}+
  25. 25 singleLineComment "//"[^\n]*
  26. 26 multiLineComment "/*"[^*]*\*(\*|([^*/]([^*])*\*))*\/
  27. 27
  28. 28 comment {multiLineComment}|{singleLineComment}
  29. 29 class bool|int|float|bvec|ivec|vec|vec2|vec3|vec4|mat2|mat3|mat4|sampler1D|sampler2D|sampler3D|samplerCube|sampler1DShadow|sampler2DShadow
  30. 30 keyword return|if|else|while|do|for|foreach|break|continue|switch|case|default|goto|class|struct|enum|extern|interface|namespace|public|static|this|volatile|using|in|out|true|false
  31. 31 qualifier const|attribute|uniform|varying
  32. 32 systemVariable gl_BackColor|gl_BackLightModelProduct|gl_BackLightProduct|gl_BackMaterial|gl_BackSecondaryColor|gl_ClipPlane|gl_ClipVertex|gl_Color|gl_DepthRange|gl_DepthRangeParameters|gl_EyePlaneQ|gl_EyePlaneR|gl_EyePlaneS|gl_EyePlaneT|gl_Fog|gl_FogCoord|gl_FogFragCoord|gl_FogParameters|gl_FragColor|gl_FragCoord|gl_FragData|gl_FragDepth|gl_FrontColor|gl_FrontFacing|gl_FrontLightModelProduct|gl_FrontLightProduct|gl_FrontMaterial|gl_FrontSecondaryColor|gl_LightModel|gl_LightModelParameters|gl_LightModelProducts|gl_LightProducts|gl_LightSource|gl_LightSourceParameters|gl_MaterialParameters|gl_MaxClipPlanes|gl_MaxCombinedTextureImageUnits|gl_MaxDrawBuffers|gl_MaxFragmentUniformComponents|gl_MaxLights|gl_MaxTextureCoords|gl_MaxTextureImageUnits|gl_MaxTextureUnits|gl_MaxVaryingFloats|gl_MaxVertexAttribs|gl_MaxVertexTextureImageUnits|gl_MaxVertexUniformComponents|gl_ModelViewMatrix|gl_ModelViewMatrixInverse|gl_ModelViewMatrixInverseTranspose|gl_ModelViewMatrixTranspose|gl_ModelViewProjectionMatrix|gl_ModelViewProjectionMatrixInverse|gl_ModelViewProjectionMatrixInverseTranspose|gl_ModelViewProjectionMatrixTranspose|gl_MultiTexCoord0|gl_MultiTexCoord1|gl_MultiTexCoord10|gl_MultiTexCoord11|gl_MultiTexCoord2|gl_MultiTexCoord3|gl_MultiTexCoord4|gl_MultiTexCoord5|gl_MultiTexCoord6|gl_MultiTexCoord7|gl_MultiTexCoord8|gl_MultiTexCoord9|gl_Normal|gl_NormalMatrix|gl_NormalScale|gl_ObjectPlaneQ|gl_ObjectPlaneR|gl_ObjectPlaneS|gl_ObjectPlaneT|gl_Point|gl_PointParameters|gl_PointSize|gl_Position|gl_ProjectionMatrix|gl_ProjectionMatrixInverse|gl_ProjectionMatrixInverseTranspose|gl_ProjectionMatrixTranspose|gl_SecondaryColor|gl_TexCoord|gl_TextureEnvColor|gl_TextureMatrix|gl_TextureMatrixInverse|gl_TextureMatrixInverseTranspose|gl_TextureMatrixTranspose|gl_Vertex
  33. 33 systemFunction radians|degress|sin|cos|tan|asin|acos|atan|pow|exp|log|exp2|log2|sqrt|inversesqrt|abs|sign|floor|ceil|fract|mod|min|max|clamp|mix|step|smoothstep|length|distance|dot|cross|normalize|faceforward|reflect|matrixCompMult|lessThan|lessThanEqual|greaterThan|greaterThanEqual|equal|notEqual|any|all|not|texture2D|texture2DProj|texture2DLod|texture2DProjLod|textureCube|textureCubeLod
  34. 34 identifier {cstring}+{number}*[{cstring}@]*{number}*
  35. 35
  36. 36 %%
  37. 37
  38. 38 {keyword}            return (int)GLSLTokenType.Keyword;
  39. 39 {class}                return (int)GLSLTokenType.Class;
  40. 40 {qualifier}            return (int)GLSLTokenType.Qualifier;
  41. 41 {systemVariable}    return (int)GLSLTokenType.SystemVariable;
  42. 42 {systemFunction}    return (int)GLSLTokenType.SystemFunction;
  43. 43 {identifier}        return (int)GLSLTokenType.Identifier;
  44. 44 {comment}            return (int)GLSLTokenType.Comment;
  45. 45
  46. 46 %%
复制代码
保存并关闭,这时生成一下项目,我们会看到在GLSL目录下生成了GLSLLexer.cs文件,同样把这个文件添加到proj中。
 
7. 处理扫描结果 
接下来我们要在ShaderEditor.cs中处理我们的扫描结果,并最终对匹配的代码行进行着色。
首先删除默认创建的ShaderEditor类。
添加一个GLSLToken枚举,这个枚举就是GLSLLexer.cs返回的枚举类型,它用来通知我们当前的语句块是哪个类型。
代码如下:
  1. 1     public enum GLSLTokenType {
  2. 2         Text = 1,
  3. 3         Keyword,
  4. 4         Comment,
  5. 5         Identifier,
  6. 6         Class,
  7. 7         Qualifier,
  8. 8         SystemVariable,
  9. 9         SystemFunction
  10. 10     }
复制代码
创建我们自己的ShaderEditor类,代码如下:
 
  1. 1     internal sealed class GLSLClassifier : ITagger<ClassificationTag> {
  2. 2         internal GLSLClassifier(ITextBuffer buffer, IClassificationTypeRegistryService typeService) {
  3. 3             textBuffer = buffer;
  4. 4             typeDic = new Dictionary<GLSLTokenType, IClassificationType>();
  5. 5             typeDic[GLSLTokenType.Text] = typeService.GetClassificationType("GLSLText");
  6. 6             typeDic[GLSLTokenType.Identifier] = typeService.GetClassificationType("GLSLIdentifier");
  7. 7             typeDic[GLSLTokenType.Keyword] = typeService.GetClassificationType("GLSLKeyword");
  8. 8             typeDic[GLSLTokenType.Class] = typeService.GetClassificationType("GLSLClass");
  9. 9             typeDic[GLSLTokenType.Comment] = typeService.GetClassificationType("GLSLComment");
  10. 10             typeDic[GLSLTokenType.Qualifier] = typeService.GetClassificationType("GLSLQualifier");
  11. 11             typeDic[GLSLTokenType.SystemVariable] = typeService.GetClassificationType("GLSLVariable");
  12. 12             typeDic[GLSLTokenType.SystemFunction] = typeService.GetClassificationType("GLSLFunction");
  13. 13         }
  14. 14
  15. 15         public event EventHandler<SnapshotSpanEventArgs> TagsChanged {
  16. 16             add { }
  17. 17             remove { }
  18. 18         }
  19. 19
  20. 20         public IEnumerable<ITagSpan<ClassificationTag>> GetTags(NormalizedSnapshotSpanCollection spans) {
  21. 21             IClassificationType classification = typeDic[GLSLTokenType.Text];
  22. 22             string text = spans[0].Snapshot.GetText();
  23. 23             yield return new TagSpan<ClassificationTag>(
  24. 24                 new SnapshotSpan(spans[0].Snapshot, new Span(0, text.Length)),
  25. 25                 new ClassificationTag(classification));
  26. 26             scanner.SetSource(text, 0);
  27. 27             int tok;
  28. 28             do {
  29. 29                 tok = scanner.nextToken();
  30. 30                 int pos = scanner.getPos();
  31. 31                 int len = scanner.getLength();
  32. 32                 int total = text.Length;
  33. 33                 if (pos < 0 || len < 0 || pos > total) {
  34. 34                     continue;
  35. 35                 }
  36. 36                 if (pos + len > total) {
  37. 37                     len = total - pos;
  38. 38                 }
  39. 39                 if (typeDic.TryGetValue((GLSLTokenType)tok, out classification)) {
  40. 40                     yield return new TagSpan<ClassificationTag>(
  41. 41                         new SnapshotSpan(spans[0].Snapshot, new Span(pos, len)),
  42. 42                         new ClassificationTag(classification));
  43. 43                 }
  44. 44             } while (tok > (int)Tokens.EOF);
  45. 45         }
  46. 46
  47. 47         ITextBuffer textBuffer;
  48. 48         IDictionary<GLSLTokenType, IClassificationType> typeDic;
  49. 49         Scanner scanner = new Scanner();
  50. 50     }
复制代码
 
TagsChanged事件保证在代码发生改变时实时刷新编辑器。
构造方法中,通过typeService.GetClassificationType("GLSLIdentifier")取得我们定义的实例,并把它们和枚举关联起来,
GetClassificationType的参数传入着色类型的Name。
GetTags方法是由系统调用的迭代方法,yield return new TagSpan()返回我们的着色对象,即可实现着色效果。
编译并运行,可以看到vsh和fsh已经有了语法着色了。
  1. <em id="__mceDel"><em id="__mceDel"> </em></em>
复制代码
  1. 本文由哈萨雅琪原创,转载请注明出处。
复制代码
 

来源:程序园用户自行投稿发布,如果侵权,请联系站长删除
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
您需要登录后才可以回帖 登录 | 立即注册