sexta-feira, 24 de julho de 2009

ASP.NET - Gráfico de Gantt

Há alguns dias atrás, eu e um colega de trabalho decidimos colocar um Gráfico de Gantt em um projeto.

Queríamos algo parecido com o gráfico do Microsoft Project.

Como não achei soluções gratuitas na web que me agradassem, iniciei o desenvolvimento de um componente de Gráfico de GANTT em ASP.NET.

Bom, estou disponibilizando o código desse componente. Escrevi o código todo em português, então é um bom material para estudo.

Está bem enxuto, adicionei apenas os recursos que eu acho úteis para exibição do relatório. É interessante adicionar outras funcionalidades, como eventos e estilos na tabela, mas não o farei por enquanto.



Faça download aqui do projeto de exemplo com o código do componente.

Para inserir o componente em uma página:

Coloque as classes dentro da pasta App_Code.

Registre o namespace no topo do arquivo .aspx.
<%@ Register Namespace="CustomControls" TagPrefix="cc" %>
Insira o componente manualmente.
<cc:GraficoGantt runat="server" ID="GraficoGantt1"></cc:GraficoGantt>

sábado, 18 de julho de 2009

ASP.NET - MessageBox

Quem já desenvolveu para Windows Forms com .NET, provavelmente já utilizou a classe MessageBox para exibir mensagens de diálogo ao usuário. Ex:
MessageBox.Show("Ocorreu um erro catastrófico, o programa será fechado.");
Porém, o conceito da plataforma ASP.NET é totalmente diferente, e nela essa classe não existe.

Então como exibir mensagens para o usuário no ASP.NET?

Por algum tempo utilizei:
ScriptManager.RegisterClientScriptBlock(Page, GetType(), "mensagem", "alert('Ocorreu um erro catastrófico durante a excluso do item.')", true);
Que nada mais é do que registrar um bloco de javascript na página, e nesse bloco chamamos a função alert passando a mensagem desejada como parâmetro.

A procura de uma solução que me agradasse mais, resolvi pesquisar por algo semelhante à classe MessageBox para ASP.NET, e encontrei algumas implementações que recebem a mensagem a ser exibida e adicionam na página os códigos necessários.

Ex de utilização:
MessageBox.show("MENSAGEM");

Aqui está a classe MessageBox que exibe mensagens utilizando a função alert. Para utilizar coloque o arquivo MessageBox.cs dentro da pasta App_Code.

Entretanto, a janela exibida pela função alert é de responsabilidade do browser, pode ter diversas formas e cores, geralmente são irritantes e não combinam com a identidade visual do sistema.

Janela de alerta do Opera 9.51

Resolvi então modificar a classe MessageBox para exibir mensagens sem a função alert.
Integrei a classe ao Framework ExtJS, adicionei também suporte aos ícones que eu desejava nas mensagens, e vejam que resultado legal:



Modos de utilização:
MessageBox.Show("Mensagem1", MessageBox.MessageType.Success);
MessageBox.Show("Mensagem2", MessageBox.MessageType.Warning);
MessageBox.Show("Mensagem3", MessageBox.MessageType.Info);
MessageBox.Show("Mensagem4", MessageBox.MessageType.Error);
Baixe aqui um projeto de exemplo, com a classe MessageBox e os arquivos do ExtJS necessários.

Manter a exibição de mensagens encapsulada na classe MessageBox simplifica o código e permite alterar facilmente o modo como todas as mensagens do projeto aparecem.

Agora é só modificar para atender melhor às suas necessidades.

quinta-feira, 16 de julho de 2009

ASP.NET - Controle DList

EDITADO EM 03/03/2010
  • Correção de falhas
  • Adicionado suporte a vários tipos de itens, cada um com um template próprio.
Sei que não tem muitas informações sobre a utilização do componente, mas quem quiser saber mais basta perguntar.


EDITADO em 03/08/2009
  • O código do componente está mais organizado.
  • Adicionado o LayoutTemplate.

Constantemente tenho necessidade de criar uma interfance com uma lista de cadastro dinâmica, conforme a imagem abaixo. Onde o número de alternativas pode variar de 1 até N.



Resolvi então criar um Custom Control, que chamei de DList (Dynamic List), uma espécie de DataList sem DataSource.

Então vamos colocar a mão na massa e criar interfaces utilizando o componente.
  1. Abra o Visual Studio 2008, e crie um novo Website, utilizando a linguagem C#.
  2. Faça download de um projeto de exemplo com as classes do componente DList aqui.
  3. Copie a pasta DList de dentro da pasta App_Code do projeto de exemplo para a pasta App_Code do seu projeto.
  4. Adicionamos então uma referência para uma dll utilizada pelas classes, clique com o botão direito sobre a solução, em seguida clique em "Add reference", localize o item "System.Design" e clique em "Ok".
Pronto, agora podemos utilizar o controle DList.
Para utilizá-lo em alguma página, registre o namespace adicionado a seguinte linha no início do arquivo .aspx
<@ Register Namespace="CustomControls" TagPrefix="cc" %>
Adicione o controle na página com a seguinte linha:
<cc:DList runat="server" ID="DList1" />
O componente suporta 3 templates:
  • LayoutTemplate, utilizado para layout do componente, coloque um PlaceHolder para determinar o local onde os itens serão adicionados;
  • ItemTemplate, utilizado para a criação de cada item;
  • SeparatorTemplate, adicionado entre os itens.
O componente possui 3 eventos:
  • ItemIndexChange, disparado sempre que há alteração na posição de um elemento, facilitando a atualização de numeradores.
  • ItemCreate, disparado sempre que um item é criado, permitindo adição de componentes dinamicamente.
  • ItemCommand, disparado sempre que um comando "borbulha" de algum componente interno.
A classe DListItem, possui uma propriedade chamada ViewStateData, que pode ser utilizada para armazenar informações no viewState do item, evitando o uso de hidden fields dentro do template.
Atualmente o controle atende às minhas necessidades, caso eu adicione novas funcionalidades ou faça modificações, postarei o código atualizado.
Estou a disposição para dúvidas, sugestões, pedidos, ou discutir abordagens para essa situação.

AS3 SVG Renderer

Primeiramente, gostaria de dizer que não tenho experiência com blogs, então me perdoem pela falta de jeito. Espero que aos poucos eu vá me acostumando.

Estou criando esse blog para difundir conhecimentos e idéias a respeito de tecnologia, principalmente ASP.NET, Flash, Flex, AS3, bem como divulgar alguns projetos.

Aproveitando o primeiro post, vou falar a respeito de um projeto open-source que mantenho: AS3 SVG Renderer. Uma bilbioteca para renderização de SVG (Scalable Vectorial Graphics) em tempo real em AS3, que pode ser utilizada no Flash ou Flex.

O projeto está hospedado no google code: http://code.google.com/p/as3svgrendererlib/

Comecei a me envolver com a renderização de SVG para utilização em um projeto, com mapas da Universidade Vale do Rio Doce. Ao buscar soluções que permitissem exibir SVG no Flash dinamicamente, me deparei com a biblioteca AS3 SVG Renderer, inicialmente desenvolvida por Charles Dietrich.

Embora ainda estivesse em um estado inicial, a bilbioteca não estava sendo continuada, devido ao envolvimento do Charles Dietrich em outros projetos. De acordo com minhas necessidades, adicinei novas funcionalidades a bliboteca, expandindo a compatiblidade com o formato SVG. Ao submeter minhas modificações ao mantenedor da biblioteca, ele convidou-me a dar continuidade à mesma.

Hoje considero a biblioteca em um estado muito satisfatório, suportando muitas das características do SVG.


Exemplos de imagens geradas com a bilbioteca.

Caso queira alguma explicação sobre a utlização da bilbioteca, dar sugestões, pedir correções, discutir idéias, e outros, deixe uma mensagem no blog ou mande um e-mail.

Gostaria de ser informado a respeito de projetos que utilizem a biblioteca. Saber o quão útil a biblioteca é para outras pessoas, é um forte fator de motivação para dar continuidade à mesma.

Abraços.