Criando Editor de texto personalizado em asp.net

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.

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

Criando Editor de texto personalizado em asp.net

Nesse artigo pretendo mostrar como registrar um userwebcontrol na web.config e também como personalizar o editor de texto fckEditor para usar nas nossas aplicações web de maneira facil e simples na utlização.

Artigos relacionados