Monday, March 26, 2007
« Pure CSS Tabs with ASP.NET 2.0 Master Pa... | Main | In need of a Feed? FeedGhost to the res... »

So I feel that my last post on pretty gray info bars in Photoshop could do with a second chapter :)

This is a pretty long series so I'll be breif - what follows is the rough outline of how to achieve the same result as a User Control in your Visual Studio project.  The advantage of this aproach would be to allow you to dymanically add text or other sparkle of your own creation :-)

Here's a sample:

Code follows :-)

namespace GrayBar
{
   public partial class GrayBar : UserControl
   {
      public enum GrayBarModes
      {
         GreenTick = 0,
         YellowBang = 1,
         RedX = 2
      }

      public GrayBar()
      {
         InitializeComponent();
      }

      protected override void OnPaint(PaintEventArgs e)
      {
         Graphics g = this.CreateGraphics();
         g.SmoothingMode = SmoothingMode.HighQuality;

         // Fill the whole canvas
         Rectangle wholeControlSpace = new Rectangle(0, 0, this.Width, this.Height);
         Brush controlFiller = new LinearGradientBrush(wholeControlSpace, Color.DarkGray, Color.LightGray, LinearGradientMode.Vertical);
         g.FillRectangle(controlFiller, wholeControlSpace);

         // Make icon in corner
         Rectangle iconSpace = new Rectangle(1, 1, this.Height - 2, this.Height - 2);
         Brush iconFiller = new LinearGradientBrush(iconSpace, Color.Gray, Color.DarkGray, LinearGradientMode.Vertical);
         g.FillEllipse(iconFiller, iconSpace);
         base.OnPaint(e);

         Font iconFont = new Font(FontFamily.GenericSansSerif, 12, FontStyle.Regular);
         string iconText = "";
         Brush iconTextBrush = new SolidBrush(Color.NavajoWhite);

         float fontHight = this.Height; 

         // The Font, Text and Colour depends on the setting on our GrayBarMode property
         switch (GrayBarMode)
         {
            case GrayBarModes.GreenTick:
               iconFont = new Font("Wingdings 2", fontHight, GraphicsUnit.Pixel);
               iconText = "P"; // P == "tick" in "Wingdings 2"
               iconTextBrush = new LinearGradientBrush(iconSpace, Color.DarkGreen, Color.LightGreen, LinearGradientMode.Vertical);
               break;
            case GrayBarModes.YellowBang:
               iconFont = new Font("Arial", fontHight, FontStyle.Bold, GraphicsUnit.Pixel);
               iconText = "!"
               iconTextBrush = new LinearGradientBrush(iconSpace, Color.Orange, Color.Yellow, LinearGradientMode.Vertical);
               break;
            case GrayBarModes.RedX:
               iconFont = new Font("Arial", fontHight, FontStyle.Bold, GraphicsUnit.Pixel);
               iconText = "X"
               iconTextBrush = new LinearGradientBrush(iconSpace, Color.Maroon, Color.Red, LinearGradientMode.Vertical);
               break;
            default:
               throw new ApplicationException("Unknow Mode");
         }

         float iconTextXPos = (iconSpace.Width / 2) - (iconFont.GetHeight(g) / 4);
         float iconTextYPos = (iconSpace.Height / 2) - (iconFont.GetHeight(g) / 2);
         g.DrawString(iconText, iconFont, iconTextBrush, iconTextXPos, iconTextYPos);

      }

      private GrayBarModes _GrayBarMode = GrayBarModes.GreenTick;
      public GrayBarModes GrayBarMode
      {
         get
         {
            return _GrayBarMode;
         }
         set
         {
            _GrayBarMode = value;
         }
      }

      private string _MessageText;
      public string MessageText
      {
         get
         {
            return _MessageText;
         }
         set
         {
            _MessageText = value;
         }
      }

   }
}

C# | Geeking Out! | UX
Comments are closed.