Desenvolvimento - C#
C# - Desenvolvendo um componente Gauge
Como programador do bom Delphi 5.0, senti falta de um componente chamado Gauge que tínhamos para mostrar a progressão de um determinado processamento. Neste artigo vou demonstrar o desenvolvimento desse componente.
por Rener Silva de MenezesNeste artigo vou demonstrar o desenvolvimento desse componente, utilizando basicamente o namespace System.Drawing para desenhar o Gauge.
O preenchimento do Gauge é do tipo gradiente.
private Brush GetFundoGradiente()
{
RectangleF recF = new
RectangleF((float) 0f, 0f, calculaPercentual(),
(float) base.Size.Height);
LinearGradientBrush gradiente = new LinearGradientBrush(recF, Inicial, Final, (float) 270f);
float[] Intensidades = {0.0f, 0.3f, 1.0f};
float[] Posicoes = {0.0f, 0.2f, 1.0f};
Blend blend = new Blend();
blend.Factors = Intensidades;
blend.Positions = Posicoes;
gradiente.Blend = blend;
return gradiente;
}
Esse método retorna um objeto LinearGradientBrush, onde foi passado o retângulo, as cores inicial e final e o ângulo da linha do gradiente. Além disso, a propriedade Blend do objeto gradiente recebe o objeto blend que determina a intesidade e as posições das cores do gradiente.
Para calcular o percentual de progressão do Gauge, foi
utilizado regra de 3 simples, vejamos.
private int calculaPercentual() { int x, z; z = base.Width * Valor; x = z /
100; return x; }
Por exemplo, se o tamanho do Gauge for de 200px e o percentual for 20%, para determinarmos o tamanho do preenchimento aplicamos a regra da seguite forma:
200 = 100
X = 4000/100
X = 40
Ou seja, o tamanho do preenchimento será de 40 px.
No evento Paint do componente executamos o seguinte
código para desenhá-lo:
private
void Gauge_Paint(object sender, System.Windows.Forms.PaintEventArgs
e) { Graphics graphics1 =
e.Graphics; Pen
pen1 = new Pen(Borda,
2f); graphics1.DrawRectangle(pen1,(float) 0f, 0f, base.Width, (float)
base.Size.Height); if (Valor > 0) { } }
Inicialmente desenhamos um retângulo do tamanho do componente, com a cor da borda selecionada pelo usuário através da propriedade Borda. Posteriormente é feita uma verificação se a propriedade Valor é maior do que 0. Se for, então o retângulo será preenchido com o gradiente de acordo com percentual calculado. Mais abaixo no código, o texto contendo a propriedade Valor e o símbolo de "%" são desenhados, com a fonte e a cor selecionadas nas propriedades Font e ForeColor respectivamente. Vejam as figuras abaixo.
X = 20
graphics1.FillRectangle(this.GetFundoGradiente(), (float) 0f, 0f, calculaPercentual(), (float) base.Size.Height);
graphics1.DrawString(Convert.ToString(Valor) + "%", this.Font,
new SolidBrush(this.ForeColor),(float) base.Size.Width/2 - 9f,
(float) base.Size.Height/2 -
7f);