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

现在的位置: 首页 > 综合 > 正文

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

2013年10月20日 ⁄ 综合 ⁄ 共 6465字 ⁄ 字号小中大 ⁄ 评论关闭

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了，运行如下图：

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

CuteEditor.aspx代码

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="CuteEditor.aspx.vb" Inherits="_CuteEditor" %>

<%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>web3.cn——给CuteEditor5增加了高亮代码显示功能</title>

function ShowMyDialog(button)

{

//use CuteEditor_GetEditor(elementinsidetheEditor) to get the cute editor instance

var editor=CuteEditor_GetEditor(button);

//show the dialog page , and pass the editor as newwin.dialogArguments

var newwin=showModelessDialog("insertcode.aspx?_rand="+new Date().getTime()

,editor,"dialogWidth:600px;dialogHeight:430px");

}

</script>

</head>

<body>

<div>

<CE:Editor ID="Editor1" runat="server">

</CE:Editor>

</div>

</form>

</body>

</html>

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

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

Dim pos As Integer

pos = Editor1.ToolControls.IndexOf("Italic") + 20

'图片位置（Themes/%ThemeName%/Images/csharp.gif）

Dim ctrl As System.Web.UI.WebControls.WebControl

ctrl = Editor1.CreateCommandButton("MyButton", "csharp.gif", "插入代码")

ctrl.Attributes("onclick") = "ShowMyDialog(this)"

'把按钮加入编辑器中

Editor1.InsertToolControl(pos, "MyButton", ctrl)

End Sub

运行如下图：

工具栏中多了一个按钮，接下来把codehighlighter的dll控件也按刚才的方法copy到bin目录下，再把Languages目录拷贝到应用程序根目录下，这里还要对web.config进行配置一下，在<configuration>的<configSections>下增加一句：

在<configuration>和</configuration>间加

</keywordCollection>

</keywordLinking>

</languages>

</codeHighlighter>

建立InsertCode.aspx文件（代码高亮处理）代码如下：

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="insertcode.aspx.vb" Inherits="insertcode" %>

<%@ Register TagPrefix="CH" Namespace="ActiproSoftware.CodeHighlighter" Assembly="ActiproSoftware.CodeHighlighter.Net20" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

body { BACKGROUND-COLOR: #e5e5e5 }

.tb { FONT-SIZE: 13px }

.code { width:400px;height:255px; }

</style>

</head>

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

【上篇】室内装潢设计—Sweet Home 3D
【下篇】hdu 2844

作者: ridden

该日志由 ridden 于11年前发表在综合分类下，最后更新于 2013年10月20日.
转载请注明: 给CuteEditor5增加了高亮代码显示功能 | 学步园 +复制链接

抱歉!评论已关闭.

返回首页

（其他合作也可洽谈）

必威体育

必威电竞

学步园