Nesse
artigo pretendo mostra como é possível criar webcontrols customizadas aonde
vamos usar o componente fckEditor para criar nosso editor, vamos criar um novo
projeto do tipo web
E criar
uma pasta control e adicionar um webusercontrol.ascx com nome ucEditor e
registrar ele na web config como mostra abaixo dentro da tag control.
|
<add tagPrefix="asp" tagName="TextEditor"
src="~/Control/ucEditor.ascx" /> |
Após
fazer isso nos conseguimos chamar nosso editor em qualquer lugar da nossa
aplicação inicializando com a tag asp: .
Após
fazer isso vamos no webcontrol ucEditor aonde vamos importa a namespace do
fckEditor no abaixo da tag control que aparece por Default quando criamos o
webcontrol.
|
<%@ Register assembly="FredCK.FCKeditorV2"
namespace="FredCK.FCKeditorV2" tagprefix="FCKeditorV2"
%> |
Depois
vamos chamar nosso editor para página.
|
<FCKeditorV2:FCKeditor
ID="fckEditor" runat="server"
BasePath="~/FCKeditor/" /> |
Abra o cs
do nosso webcontrol e vamos criar algumas propriedades e setar no nosso
fckeditor.
|
protected override void OnPreRender(EventArgs e) |
||
|
{ |
||
|
if (!IsPostBack) |
||
|
{ |
||
|
LoadEditor(); |
||
|
} |
||
|
base.OnPreRender(e); |
||
|
} |
||
|
|
||
|
public Unit
Width |
||
|
{ |
||
|
get {
return fckEditor.Width;
} |
||
|
set {
fckEditor.Width = value; } |
||
|
} |
||
|
|
||
|
public string Text |
||
|
{ |
||
|
get {
return fckEditor.Value;
} |
||
|
set {
fckEditor.Value = value; } |
||
|
} |
||
|
|
||
|
public Unit
Height |
||
|
{ |
||
|
get {
return fckEditor.Height;
} |
||
|
set {
fckEditor.Height = value; } |
||
|
} |
||
|
|
||
|
public enum LayoutTemplate |
||
|
{ |
||
|
basic = 1, |
||
|
MyToolbar = 2, |
||
|
} |
||
|
|
||
|
public LayoutTemplate
DesignerToolBox |
||
|
{ |
||
|
get {return (LayoutTemplate)(ViewState["DesignerToolBox"]
?? LayoutTemplate.basic); } |
||
|
set{(ViewState["DesignerToolBox"]) = value;} |
||
|
} |
||
|
|
||
|
public void LoadEditor() |
||
|
{ |
||
|
|
if (LayoutTemplate.MyToolbar
== DesignerToolBox) |
|
|
{ |
||
|
fckEditor.ToolbarSet = "MyToolbar"; |
||
|
} |
||
|
else |
||
|
{ |
||
|
fckEditor.ToolbarSet = "Basic"; |
||
|
} |
|
|
} |
Essa
propriedades vai ser responsável por passar os valores para o fckeditor e
também criei um método para setar o designer que vamos querer utilizar no nosso
editor Basic ou MyToolbar, após isso é só abrir a página Default.aspx e chamar
nosso editor como mostra o exemplo abaixo
|
<body> |
||
|
<form
id="form1" runat="server"> |
||
|
<div> |
||
|
<asp:TextEditor
DesignerToolBox="MyToolbar" ID="txtEditor"
runat="server" Height="300" Width="400" /> |
||
|
</div> |
||
|
</form> |
||
|
</body> |
Espero
que goste dessa maneira acabamos tento um editor de texto que pode ser chamado
em qualquer lugar da nossa aplicação de uma maneira simples e fácil e
personalizada quando executar o projeto resultado final vai ser esse.
Obs: não esqueça de abaixar o fckEditor e colocar a DLL e pasta do editor no projeto.
código fonte: http://uploaddearquivos.com.br/download/CustomizingEditor.rar
