Non-basic drawing examples

djhulp · Apr 28, 2012

Does anyone know of any resources with some information on some slightly more advanced graphics examples than those found in the articles section on this site? It seems like every example I can find out there uses a solid, predefined color (like "Green" or something), fills an area, then uses another predefined color like "Black" to write on it. Great...but what about people like me that are trying to use this in the real world where most of the colors in web site designs aren't part of the predefined color list? Or if we need to build complicated graphics? I'm looking for something that will take me a little more in depth. Help!I just finished do this. You wanted slightly more advanced.... this is long..... --------------------------------------------------------------- using System; using System.Data; using System.Collections; using System.Web; using System.Web.UI; using System.Drawing; using System.Drawing.Imaging; using System.Drawing.Drawing2D; using System.IO; using System.Web.SessionState; namespace GUI35_NET.HomePage2 { public class elityLogo : System.Web.UI.Page { public string mstrUserName = null; private Bitmap objBmp; private Graphics objGrx; private SolidBrush brsDarkBlue = new SolidBrush(Color.FromArgb(51, 102, 153)); private SolidBrush brsBlack = new SolidBrush(Color.Black); private LinearGradientBrush lgbBlackBlue = new LinearGradientBrush(new Rectangle(0, 0, 700, 300), Color.Black, Color.FromArgb(51, 102, 153), LinearGradientMode.Horizontal); private LinearGradientBrush lgBrush; private Pen penBlack2px = new Pen(Brushes.Black, 2.0f); private Pen penLightBlueAlpha50 = new Pen(Color.FromArgb(50, 221, 238, 255), 4.0f); private Pen penWhite1px = new Pen(Brushes.White, 1.0f); private Font fntVerdana10Bold = new Font("Verdana", 10, FontStyle.Bold); private SolidBrush brsWhiteAlpha50 = new SolidBrush(Color.FromArgb(50, 255, 255, 255)); private Font fntArial; private void Page_Load(object sender, System.EventArgs e) { if(!IsPostBack) { initImage(); drawLogoBackground(); drawLogo(); drawCoolPlate(); drawWelcomeMessage(); drawLinkContainers(); sendImageToOutput(); } } private void initImage() { objBmp = new Bitmap(700, 300); objGrx = Graphics.FromImage(objBmp); objGrx.CompositingQuality = CompositingQuality.HighQuality; } private void drawCoolPlate() { //Define array of points that describe the plate image Point[] pntArrayPlate = {new Point(640, 20), new Point(680, 60), new Point(680, 240), new Point(640, 280), new Point(300, 280), new Point(300, 110), new Point(640, 110), new Point(640, 20)}; //Define array of bytes that describe the point types byte[] bytArrayPlate = {(byte) PathPointType.Start, (byte) PathPointType.Line, (byte) PathPointType.Line, (byte) PathPointType.Line, (byte) PathPointType.Line, (byte) PathPointType.Line, (byte) PathPointType.Line, (byte) PathPointType.Line}; //Define new Path GraphicsPath grpPlate = new GraphicsPath(pntArrayPlate, bytArrayPlate); //Fill Path objGrx.FillPath(brsDarkBlue, grpPlate); //Outline Path objGrx.DrawPath(penBlack2px, grpPlate); //Fill inner rectangle objGrx.FillRectangle(lgbBlackBlue, 320, 130, 320, 130); //Outline inner rectangle objGrx.DrawRectangle(penBlack2px, 320, 130, 320, 130); //Tag line objGrx.DrawString("E x p a n d i n g t h e P o w e r o f D a t a", fntVerdana10Bold, brsWhiteAlpha50, new Rectangle(320, 112, 350, 20)); } private void drawLinkContainers() { DirectoryInfo diMaps = new DirectoryInfo(Server.MapPath("maps")); StreamWriter objSw = new StreamWriter(Server.MapPath("maps/" + Session["mapName"])); Rectangle recLink; Rectangle recLight; fntArial = new Font("Arial", 9, FontStyle.Bold); SolidBrush brsLight = new SolidBrush(Color.FromArgb(255, 220, 220, 220)); string strMapFile = Request.QueryString["map"]; string strLinkText = null; int intOuterRecX = 235; int intOuterRecY = 140; int intOuterRecWidth = 90; int intOuterRecHeight = 30; int intSpacer = 10; int i = 0; int j = 0; int intContainerMarker = 0; int intMapX1 = 0; int intMapY1 = 0; int intMapX2 = 0; int intMapY2 = 0; //Clean up old map files first foreach(FileInfo fiMap in diMaps.GetFiles()) { //Delete any files that were not created today if(fiMap.CreationTime.ToShortDateString() != DateTime.Now.ToShortDateString()) fiMap.Delete(); } recLink = new Rectangle(intOuterRecX, intOuterRecY, intOuterRecWidth, intOuterRecHeight); //Loop for rows for(i=0; i<8; i=i+3) { //Loop for cols for(j=0; j<3; j++) { //Define outer rectangle recLink = new Rectangle(recLink.X + intOuterRecWidth + intSpacer, intOuterRecY, intOuterRecWidth, intOuterRecHeight); //Fill outer rectangle objGrx.FillRectangle(brsDarkBlue, recLink); //Outline outer rectangle objGrx.DrawRectangle(penBlack2px, recLink); //Define inner rectangle recLight = new Rectangle(recLink.X+4, recLink.Y+4, recLink.Width-8, recLink.Height-8); //Draw inner rectangle lgBrush = new LinearGradientBrush(recLight, Color.FromArgb(153, 153, 153), Color.WhiteSmoke, LinearGradientMode.BackwardDiagonal); objGrx.FillRectangle(lgBrush, recLight); //Outline inner rectangle objGrx.DrawRectangle(penLightBlueAlpha50, recLight); //Inner rectangle edge highlights objGrx.DrawLine(penWhite1px, recLight.X, recLight.Y, recLight.Width+recLight.X, recLight.Y); objGrx.DrawLine(penWhite1px, recLight.X, recLight.Y, recLight.X, recLight.Y+recLight.Height); objGrx.DrawLine(penBlack2px, recLight.X+recLight.Width, recLight.Y, recLight.X+recLight.Width, recLight.Y+recLight.Height); objGrx.DrawLine(penBlack2px, recLight.X, recLight.Y+recLight.Height, recLight.X+recLight.Width, recLight.Y+recLight.Height); //Link Text and Map entry switch(intContainerMarker) { case -1: //Set Map Coords intMapX1 = recLink.X; intMapY1 = recLink.Y; intMapX2 = recLink.X + recLink.Width; intMapY2 = recLink.Y + recLink.Height; //Write line to Map File objSw.WriteLine("rect http://localhost/GUI35_NET/HomePage2/targetTest.aspx?clicked=" + strLinkText.Replace(" ", "") + " " + intMapX1 + "," + intMapY1 + " " + intMapX2 + "," + intMapY2); //Draw Link String objGrx.DrawString(strLinkText, fntArial, Brushes.Black, new Rectangle(recLink.X+5, recLink.Y+7, recLink.Width-4, recLink.Height)); break; case 0: strLinkText = "Components"; goto case -1; case 1: strLinkText = "Connections"; goto case -1; case 2: strLinkText = "Data Sources"; goto case -1; case 3: strLinkText = "Engine"; goto case -1; case 4: strLinkText = "Filters"; goto case -1; case 5: strLinkText = "Labels"; goto case -1; case 6: strLinkText = "Reports"; goto case -1; case 7: strLinkText = "Users"; goto case -1; case 8: strLinkText = "Workspaces"; goto case -1; } //Next Link intContainerMarker++; } //Reset X Coord recLink.X = intOuterRecX; //Move down for next row intOuterRecY = recLink.Y + intOuterRecHeight + intSpacer; } //Cleanup Map File objSw.Flush(); objSw.Close(); } private void drawWelcomeMessage() { Font fntArial = new Font("Arial", 16, FontStyle.Bold); Font fntArial2 = new Font("Arial", 28, FontStyle.Bold); mstrUserName = Request.QueryString["userName"]; objGrx.FillRectangle(brsDarkBlue, 300, 20, 325, 80); objGrx.DrawRectangle(penBlack2px, 300, 20, 325, 80); lgBrush = new LinearGradientBrush(new Rectangle(304, 24, 317, 72), Color.DarkSlateGray, Color.WhiteSmoke, LinearGradientMode.BackwardDiagonal); objGrx.FillRectangle(lgBrush, 304, 24, 317, 72); objGrx.DrawRectangle(penBlack2px, 304, 24, 317, 72); objGrx.FillRectangle(new SolidBrush(Color.FromArgb(50, 255, 255, 255)), 314, 34, 297, 52); objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(100, 255, 255, 255)), 3), 314, 34, 611, 34); objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(100, 255, 255, 255)), 3), 314, 34, 314, 86); objGrx.DrawLine(penBlack2px, 611, 34, 611, 86); objGrx.DrawLine(penBlack2px, 314, 86, 611, 86); objGrx.DrawString("Elity InSight", fntArial2, Brushes.Black, 351, 37); objGrx.DrawString("Elity InSight", fntArial2, Brushes.WhiteSmoke, 349, 35); objGrx.DrawString("Elity InSight", fntArial2, Brushes.Crimson, 350, 36); } private void drawLogo() { Int32 i; Int32 j; Point[] pntArray = {new Point(165-50, 200-50), new Point(200-50, 165-50), new Point(235-50, 200-50), new Point(200-50, 235-50)}; Point[] pntArrayBlack = {new Point(pntArray[0].X - 4, pntArray[0].Y), new Point(pntArray[1].X, pntArray[1].Y - 4), new Point(pntArray[2].X + 4, pntArray[2].Y), new Point(pntArray[3].X, pntArray[3].Y + 4)}; byte[] bytArray = {(byte)PathPointType.Start, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line}; objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(75, Color.Black)), (float) 10), new Point(pntArray[2].X+4, pntArray[2].Y), new Point(pntArray[3].X, pntArray[3].Y+4)); GraphicsPath pthDiamond = new GraphicsPath(pntArray, bytArray); objGrx.FillPath(new SolidBrush(Color.Black), new GraphicsPath(pntArrayBlack, bytArray)); lgBrush = new LinearGradientBrush(new Rectangle(pntArray[0].X, pntArray[0].Y, 70, 70), Color.DarkSlateGray, Color.WhiteSmoke, LinearGradientMode.BackwardDiagonal); lgBrush.GammaCorrection = true; objGrx.FillPath(lgBrush, pthDiamond); Point[] pntArrayLight = {new Point(pntArray[0].X+8, pntArray[0].Y), new Point(pntArray[1].X, pntArray[1].Y+8), new Point(pntArray[2].X-8, pntArray[2].Y), new Point(pntArray[3].X, pntArray[3].Y-8)}; GraphicsPath grpLight = new GraphicsPath(pntArrayLight, bytArray); objGrx.FillPath(new SolidBrush(Color.FromArgb(50, 255, 255, 255)), grpLight); objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(100, 255, 255, 255)), 3), pntArrayLight[0], pntArrayLight[1]); for(i=2;i<=9;i++) { switch(i) { case 0: //Red Diamond pntArrayBlack[0].X = pntArray[0].X - 4; pntArrayBlack[0].Y = pntArray[0].Y; pntArrayBlack[1].X = pntArray[1].X; pntArrayBlack[1].Y = pntArray[1].Y - 4; pntArrayBlack[2].X = pntArray[2].X + 4; pntArrayBlack[2].Y = pntArray[2].Y; pntArrayBlack[3].X = pntArray[3].X; pntArrayBlack[3].Y = pntArray[3].Y + 4; pthDiamond = new GraphicsPath(pntArray, bytArray); pntArrayLight[0].X = pntArray[0].X+8; pntArrayLight[0].Y = pntArray[0].Y; pntArrayLight[1].X = pntArray[1].X; pntArrayLight[1].Y = pntArray[1].Y+8; pntArrayLight[2].X = pntArray[2].X-8; pntArrayLight[2].Y = pntArray[2].Y; pntArrayLight[3].X = pntArray[3].X; pntArrayLight[3].Y = pntArray[3].Y-8; grpLight = new GraphicsPath(pntArrayLight, bytArray); //Test Drop Shadow objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(75, Color.Black)), (float) 10), new Point(pntArray[2].X+4, pntArray[2].Y), new Point(pntArray[3].X, pntArray[3].Y+4)); //End Drop Shadow objGrx.FillPath(Brushes.Black, new GraphicsPath(pntArrayBlack, bytArray)); pthDiamond = new GraphicsPath(pntArray, bytArray); lgBrush = new LinearGradientBrush(new Rectangle(pntArray[0].X, pntArray[0].Y, 70, 70), Color.DarkRed, Color.Crimson, LinearGradientMode.BackwardDiagonal); lgBrush.GammaCorrection = true; objGrx.FillPath(lgBrush, pthDiamond); objGrx.FillPath(new SolidBrush(Color.FromArgb(75, 255, 0, 0)), grpLight); objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(100, 255, 255, 255)), 3), pntArrayLight[0], pntArrayLight[1]); break; case 1: //Grey Diamonds pntArrayBlack[0].X = pntArray[0].X - 4; pntArrayBlack[0].Y = pntArray[0].Y; pntArrayBlack[1].X = pntArray[1].X; pntArrayBlack[1].Y = pntArray[1].Y - 4; pntArrayBlack[2].X = pntArray[2].X + 4; pntArrayBlack[2].Y = pntArray[2].Y; pntArrayBlack[3].X = pntArray[3].X; pntArrayBlack[3].Y = pntArray[3].Y + 4; pthDiamond = new GraphicsPath(pntArray, bytArray); pntArrayLight[0].X = pntArray[0].X+8; pntArrayLight[0].Y = pntArray[0].Y; pntArrayLight[1].X = pntArray[1].X; pntArrayLight[1].Y = pntArray[1].Y+8; pntArrayLight[2].X = pntArray[2].X-8; pntArrayLight[2].Y = pntArray[2].Y; pntArrayLight[3].X = pntArray[3].X; pntArrayLight[3].Y = pntArray[3].Y-8; grpLight = new GraphicsPath(pntArrayLight, bytArray); //Test Drop Shadow objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(75, Color.Black)), (float) 10), new Point(pntArray[2].X+4, pntArray[2].Y), new Point(pntArray[3].X, pntArray[3].Y+4)); //End Drop Shadow lgBrush = new LinearGradientBrush(new Rectangle(pntArray[0].X, pntArray[0].Y, 70, 70), Color.DarkSlateGray, Color.WhiteSmoke, LinearGradientMode.BackwardDiagonal); lgBrush.GammaCorrection = true; objGrx.FillPath(new SolidBrush(Color.Black), new GraphicsPath(pntArrayBlack, bytArray)); objGrx.FillPath(lgBrush, pthDiamond); objGrx.FillPath(new SolidBrush(Color.FromArgb(50, 255, 255, 255)), grpLight); objGrx.DrawLine(new Pen(new SolidBrush(Color.FromArgb(100, 255, 255, 255)), 3), pntArrayLight[0], pntArrayLight[1]); break; case 2: for(j=0;j<=3;j++) { pntArray[j].X -= 45; pntArray[j].Y -= 45; } goto case 1; case 3: for(j=0;j<=3;j++) { pntArray[j].X -= 45; pntArray[j].Y += 45; } goto case 1; case 4: for(j=0;j<=3;j++) { pntArray[j].X += 45; pntArray[j].Y += 45; } goto case 1; case 5: goto case 4; case 6: for(j=0;j<=3;j++) { pntArray[j].X += 45; pntArray[j].Y -= 45; } goto case 1; case 7: goto case 6; case 8: for(j=0;j<=3;j++) { pntArray[j].Y -= 90; } goto case 0; case 9: for(j=0;j<=3;j++) { pntArray[j].X -= 90; } goto case 1; } } } private void drawLogoBackground() { //Dark Blue Back objGrx.FillRectangle(brsDarkBlue, 0, 0, 700, 300); //Logo Conatiner Point[] pntArrayContainer = {new Point(150, 10), new Point(640, 10), new Point(690, 60), new Point(690, 240), new Point(640, 290), new Point(150, 290)}; byte[] bytArrayContainer = {(byte)PathPointType.Start, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line}; GraphicsPath grpContainer = new GraphicsPath(pntArrayContainer, bytArrayContainer); objGrx.FillPath(lgbBlackBlue, grpContainer); GraphicsPath myPath = new GraphicsPath(); //Path is Circle myPath.AddEllipse(10, 10, 280, 280); //PathGradientBrush Constructor with Specified Path PathGradientBrush pthGrBrush = new PathGradientBrush(myPath); //Set the Center Color pthGrBrush.CenterColorWell, thanks for the effort I guess... I don't feel like I'm in any better shape than I was in before. I'm looking for some in depth discussion of the mechanics of how the engine builds stuff. For example imagine a graphic that looked like this (where each letter was a pixel): BBBbbbbbbbbbbbbbbbbbbbbbbbbBBBBBBBB BBBbbbbbbbbbbbbbbbbbbbbbbbbBBBBBBBB BBBbbbbbbbbbbbbbbbbbbbbbbbbBBBBBBBB BBBbbbbbbbbbbbbbbbbbbbbbbbbBBBBBBBB B in this case is a darker blue like #0851A5 and b is a lighter blue like 4271B5. Now if I were to pull up photoshop, set up those 2 colors, color in each of the pixels, and save it as an optimized GIF, the image looks fine. Use ASP.NET graphics to draw 3 filled areas with the same 2 colors, save it as a gif, and it gets all screwy. Change it to a jpeg...it's better but still different. This is a specific example, sure, but it's hard to do anything complicated when something so simple won't come out the way you want it. Anyway, still searching for a good place where I can get some real answers on this.Look at the method, sendImageToOutput(), in my code. You will see that I use an EncodingParamter to specify the image quality of the JPEG. There are other Encoders that can be defined to specify different attribute of an image, based on the Codec that you are using. I was running into the same problem you are describing: my image did not look very sharp. It took me an entire day to find ANY info on this, and the info was sparse at best. You can use Encoders to specify Quality, ColorDepth, Compression, etc. If you look for info on GDI, much of it still applies, in theory, to GDI+, which the System.Drawing and System.Imaging Namespaces use in the Framework.Well...quality 100 fixed the simple problem as described above, sure enough. Thanks for the tip on that, sounds like you've been through much of the same as me. Now on to the fun stuff =""BRoyCheck out some of the articles at: http://aspalliance.com/chrisg/default.asp?category=6 There are some very interesting articles, like creating transparent GIFs, reading animated GIFs, altering JPEG compression rates on images, etc. Also, if you want to see a more practical use of dynamic images in ASP.NET, check out: http://msdn.microsoft.com/msdnmag/issues/02/02/ASPDraw/ASPDraw.asp -and- http://www.4guysfromrolla.com/webtech/chapters/ASPNET2/ch02.4.shtml hth

Non-basic drawing examples

djhulp

New Member