在去年的年初我改进了给CuteEditor5增加了高亮代码显示功能

===========================================================================
CuteEditor在很多网站上都有介绍了,是一款超级Cool的web在线编辑器,下载地址用google找一下就能找到,就不提供了,但是安装方法还是要说一下,因本次是使用vs2005。

      我们在vs2005里面新建个web site吧,把CuteEditor.dll(主控件)、CuteEditor.lic(许可证)、CuteEditor.ImageEditor.dll(因为5.0增加了个EditorImage的功能)、NetSpell.SpellChecker.dll(拷这个的原因是默认打开拼写检查)这几个文件拷贝到web site的bin目录下,刷新bin目录(不像vs2003需要引用dll),同时我们也要把解压缩后的CuteSoft_Client目录全部拷贝到应用程序的根目录下。然后把CuteEditor添加到工具面板.我们在工具面板里面右键选择"选择项",在出来的对话框里面选择"游览",找到CuteEditor.dll,一路确定就可以了。

      我们再添加个CuteEditor.aspx,把工具面板里面的Editor拖到页面上来,这时你就可以运行你的程序使用CuteEditor了,运行如下图:
给CuteEditor5增加了高亮代码显示功能

      上面的只是个最简单的安装,还有比如控制CueEditor的显示,已经安全性和那个什么上传的啊,还有控制用户上传的目录啊,或者给每个用户建个他们自己的图片目录啊,还必须要另外设置,这些暂时先略过吧,您可以自己看一下说明进行设置,这里不多说了。我们现在要开始要给CuteEditor增加高亮代码显示功能,俺这里使用的是CodeHighlighter控件,您可以到http://www.codehighlighter.com下载最新版,最新版同时支持.net1和.net2,因为使用的是vs2005,俺就使用了最新版,现在我们先来给CuteEditor增加一个按钮和打开插入高亮代码的页面代码。

CuteEditor.aspx代码

在CuteEditor.aspx.vb的Page_Load事件下增加代码

运行如下图:

给CuteEditor5增加了高亮代码显示功能

工具栏中多了一个按钮,接下来把codehighlighter的dll控件也按刚才的方法copy到bin目录下,再把Languages目录拷贝到应用程序根目录下,这里还要对web.config进行配置一下,在<configuration>的<configSections>下增加一句:
给CuteEditor5增加了高亮代码显示功能<section name="codeHighlighter" type="ActiproSoftware.CodeHighlighter.CodeHighlighterConfigurationSectionHandler, ActiproSoftware.CodeHighlighter.Net20" />

在<configuration>和</configuration>间加
给CuteEditor5增加了高亮代码显示功能 <codeHighlighter>
给CuteEditor5增加了高亮代码显示功能
<cache languageTimeout="3" />
给CuteEditor5增加了高亮代码显示功能
<keywordLinking enabled="true" target="_blank" defaultKeywordCollectionKey="ActiproKeywords">
给CuteEditor5增加了高亮代码显示功能
<keywordCollection key="ActiproKeywords">
给CuteEditor5增加了高亮代码显示功能
<explicitKeyword tokenKey="IdentifierToken" patternValue="Actipro" url="http://www.actiprosoftware.com" caseSensitive="false" />
给CuteEditor5增加了高亮代码显示功能
<explicitKeyword tokenKey="IdentifierToken" patternValue="CodeHighlighter" url="http://www.codehighlighter.com" caseSensitive="false" />
给CuteEditor5增加了高亮代码显示功能
</keywordCollection>
给CuteEditor5增加了高亮代码显示功能
</keywordLinking>
给CuteEditor5增加了高亮代码显示功能
<languages>
给CuteEditor5增加了高亮代码显示功能
<language key="BatchFile" definitionPath="~/Languages/ActiproSoftware.BatchFile.xml" />
给CuteEditor5增加了高亮代码显示功能
<language key="C#" definitionPath="~/Languages/ActiproSoftware.CSharp.xml" semanticParserType="CodeHighlighterTest.SemanticCSharpParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="CSS" definitionPath="~/Languages/ActiproSoftware.CSS.xml" semanticParserType="CodeHighlighterTest.SemanticCssParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="HTML" definitionPath="~/Languages/ActiproSoftware.HTML.xml" semanticParserType="CodeHighlighterTest.SemanticHtmlParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="INIFile" definitionPath="~/Languages/ActiproSoftware.INIFile.xml" />
给CuteEditor5增加了高亮代码显示功能
<language key="Java" definitionPath="~/Languages/ActiproSoftware.Java.xml" semanticParserType="CodeHighlighterTest.SemanticJavaParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="JScript" definitionPath="~/Languages/ActiproSoftware.JScript.xml" semanticParserType="CodeHighlighterTest.SemanticJScriptParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="Perl" definitionPath="~/Languages/ActiproSoftware.Perl.xml" />
给CuteEditor5增加了高亮代码显示功能
<language key="PHP" definitionPath="~/Languages/ActiproSoftware.PHP.xml" />
给CuteEditor5增加了高亮代码显示功能
<language key="Python" definitionPath="~/Languages/ActiproSoftware.Python.xml" />
给CuteEditor5增加了高亮代码显示功能
<language key="SQL" definitionPath="~/Languages/ActiproSoftware.SQL.xml" semanticParserType="CodeHighlighterTest.SemanticSqlParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="VB.NET" definitionPath="~/Languages/ActiproSoftware.VBDotNet.xml" semanticParserType="CodeHighlighterTest.SemanticVBDotNetParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="VBScript" definitionPath="~/Languages/ActiproSoftware.VBScript.xml" semanticParserType="CodeHighlighterTest.SemanticVBDotNetParser, CodeHighlighterTest" />
给CuteEditor5增加了高亮代码显示功能
<language key="XML" definitionPath="~/Languages/ActiproSoftware.XML.xml" />
给CuteEditor5增加了高亮代码显示功能
</languages>
给CuteEditor5增加了高亮代码显示功能
<lineNumberMargin foreColor="Teal" paddingCharacter=" " visible="true" />
给CuteEditor5增加了高亮代码显示功能
<outlining enabled="true" imagesPath="~/Images/OutliningIndicators/" />
给CuteEditor5增加了高亮代码显示功能
<spacesInTabs count="4" />
给CuteEditor5增加了高亮代码显示功能
</codeHighlighter>

建立InsertCode.aspx文件(代码高亮处理)代码如下:

 


InsertCode.aspx.vb代码:

 

End Class

好了,现在可以运行试用了,点击“插入代码”按钮:

给CuteEditor5增加了高亮代码显示功能

把你要转换的代码放到代码区,选择代码的语言,点击“确定”后代码自动转换成高亮代码插入到编辑器中了

给CuteEditor5增加了高亮代码显示功能
 怎么样,爽吧,使用CuteEditor5强大的功能,支持多种浏览器,还支持xhtml,加上代码高亮,编辑器几乎完美,嘿嘿,俺现在就是用这个。

相关文章: