WEBSWAPP Silverlight ASP.NET 3.5 ASP.NET 2.0 ASP.NET 1.0
Nested Data
Images
Dynamic Controls
System.Drawing
    
<%@ Page Language="C#" AutoEventWireup="true"%> <%@ Import Namespace="System" %> <%@ Import Namespace="System.Collections" %> <%@ Import Namespace="System.ComponentModel" %> <%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Drawing" %> <%@ Import Namespace="System.Drawing.Imaging" %> <%@ Import Namespace="System.Drawing.Text" %> <%@ Import Namespace="System.Drawing.Drawing2D" %> <%@ Import Namespace="System.Web" %> <%@ Import Namespace="System.Web.SessionState" %> <%@ Import Namespace="System.Web.UI" %> <%@ Import Namespace="System.Web.UI.WebControls" %> <%@ Import Namespace="System.Web.UI.HtmlControls" %> <script runat="server" language="C#"> private string fileName = System.DateTime.Now.ToString("hhMMss"); private enum FontFamilies { Georgia, Comic_Sans_MS, Arial, Batang, Book_Antiqua, Bookman_Old_Style, Century, Century_Gothic, Courier_New, Garamond, Tahoma, Times_New_Roman, Verdana } private void Page_Load(object sender, System.EventArgs e) { if (!Page.IsPostBack) { System.Web.UI.WebControls.ListItem li = new System.Web.UI.WebControls.ListItem("", ""); ddlbgColor.DataSource = Enum.GetNames(typeof(System.Drawing.KnownColor)); ddlbgColor.DataBind(); ddlbgColor.Items.Insert(0, li); // ddlForeColor.DataSource = Enum.GetNames(typeof(System.Drawing.KnownColor)); ddlForeColor.DataBind(); li = new System.Web.UI.WebControls.ListItem("", ""); ddlForeColor.Items.Insert(0, li); // ddlButtonBGColor.DataSource = Enum.GetNames(typeof(System.Drawing.KnownColor)); ddlButtonBGColor.DataBind(); li = new System.Web.UI.WebControls.ListItem("", ""); ddlButtonBGColor.Items.Insert(0, li); // ddlFont.DataSource = Enum.GetNames(typeof(FontFamilies)); ddlFont.DataBind(); } } private void btnSubmit_Click(object sender, System.EventArgs e) { Bitmap bitmap = null; int bitmapHeight = 60; int bitmapWidth = 750; int fontSize = 3; int offsetY = 2; int offsetX = 2; string ButtonText = "WEBSWAPP Development Inc."; Color foreColor = Color.Gold; Color bgColor = Color.White; Color buttonBGColor = Color.Navy; //set the variables from the user entry if any exists if (txtForButton.Text != "") ButtonText = txtForButton.Text; try { if (txtWidth.Text != "") if (Convert.ToInt16(txtWidth.Text) != 0) bitmapWidth = Convert.ToInt16(txtWidth.Text); } catch { //keep the default value } try { if (txtHeight.Text != "") if (Convert.ToInt16(txtHeight.Text) != 0) bitmapHeight = Convert.ToInt16(txtHeight.Text); } catch { //keep the default value } if (ddlbgColor.SelectedItem.Value != "") bgColor = Color.FromName(ddlbgColor.SelectedValue); if (ddlForeColor.SelectedValue != "") foreColor = Color.FromName(ddlForeColor.SelectedValue); if (ddlButtonBGColor.SelectedValue != "") buttonBGColor = Color.FromName(ddlButtonBGColor.SelectedValue); if (txtSize.Text != "") fontSize = Convert.ToInt16(txtSize.Text); //create the bitmap bitmap = new Bitmap(bitmapWidth, bitmapHeight); //set resolution to high bitmap.SetResolution(600, 300); //create a graphics object from the bitmap Graphics g = Graphics.FromImage(bitmap); //paint the background as specified by the user or else paint it as the default g.Clear(bgColor); //add border to mark a button shape Point[] poly = {new Point(10-offsetX, 3-offsetY), new Point(bitmapWidth-10-offsetX, 3-offsetY), new Point(bitmapWidth-5-offsetX, 5-offsetY), new Point(bitmapWidth-3-offsetX, 10-offsetY), new Point(bitmapWidth-3-offsetX, bitmapHeight-10-offsetY), new Point(bitmapWidth-5-offsetX, bitmapHeight-5-offsetY), new Point(bitmapWidth-10-offsetX, bitmapHeight-3-offsetY), new Point(10-offsetX, bitmapHeight-3-offsetY), new Point(5-offsetX, bitmapHeight-5-offsetY), new Point(3-offsetX, bitmapHeight-10-offsetY), new Point(3-offsetX, 10-offsetY), new Point(5-offsetX, 5-offsetY), new Point(10-offsetX, 3-offsetY)}; g.FillPolygon(new SolidBrush(buttonBGColor), poly); //draw the text g.TextRenderingHint = TextRenderingHint.AntiAlias; Matrix mx = new Matrix(.99f, 0, 0, .99f, 3, 3); g.Transform = mx; Font fn = new Font(ddlFont.SelectedItem.Value.Replace("_", " "), 4, GraphicsUnit.Point); g.DrawString(ButtonText, fn, new SolidBrush(Color.Black), 20, 10, StringFormat.GenericTypographic); g.Dispose(); //graphics 2 Graphics g2 = Graphics.FromImage(bitmap); g2.InterpolationMode = InterpolationMode.HighQualityBicubic; g2.TextRenderingHint = TextRenderingHint.AntiAlias; g2.DrawImage(bitmap, new Rectangle(0, 0, bitmapWidth + 10, bitmapHeight + 10), 0, 0, bitmap.Width - 10, bitmap.Height - 10, GraphicsUnit.Pixel); g2.DrawString(ButtonText, fn, new SolidBrush(foreColor), 20, 10, StringFormat.GenericTypographic); if (writeFile(bitmap)) { image1.Src = @"~\writeable\" + fileName + ".jpg"; image1.Visible = true; } } private bool writeFile(Bitmap bm) { bool ret = false; try { //save high-res image bm.Save(Server.MapPath(@"~\writeable\temp.bmp"), ImageFormat.Bmp); //Get the list of available encoders ImageCodecInfo[] codecs = ImageCodecInfo.GetImageEncoders(); //find the encoder with the image/jpeg mime-type ImageCodecInfo ici = null; foreach (ImageCodecInfo codec in codecs) { if (codec.MimeType == "image/jpeg") { ici = codec; break; } } //Create a collection of encoder parameters (we only need one in the collection) EncoderParameters ep = new EncoderParameters(); //save the image with 100% quality as compared with the original ep.Param[0] = new System.Drawing.Imaging.EncoderParameter(System.Drawing.Imaging.Encoder.Quality, (long)100); bm.Save(Server.MapPath(@"~\writeable\" + fileName + ".jpg"), ici, ep); ret = true; } catch { Response.Write("Could not write to a temporary file! Please contact the website admin at Phillip.Williams@webswapp.com"); ret = false; } return ret; } </script> <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> <script type="text/javascript" language="javascript" > function Format(keyword) { switch (keyword) { case "flower": Settings("Flower", 3, 170, 65, 3, 135, 147, 163); break; /// case "OK": Settings("OK", 3, 100, 60, 11, 164, 72, 165); break; /// case "Cancel": Settings("Cancel", 2, 160, 70, 10, 164, 127, 165); break; /// case "Business Logo": Settings("WEBSWAPP Development Inc.", 6, 520, 75, 10, 74, 143, 76); break; /// case "Olives": Settings("Olives", 5, 150, 80, 1, 120, 125, 165); break; } } function Settings(var1, var2, var3, var4, var5, var6, var7, var8) { var txt = findControl ("txtForButton","input"); if (txt) txt.value = var1; // txt = findControl ("txtSize","input"); if (txt) txt.value = var2; // txt = findControl ("txtWidth", "input"); if (txt) txt.value = var3; // txt = findControl ("txtHeight","input"); if (txt) txt.value = var4; // var ddl = findControl("ddlFont","select"); ddl.selectedIndex = var5; // ddl = findControl("ddlbgColor","select"); ddl.selectedIndex = var6; // ddl = findControl("ddlButtonBGColor","select"); ddl.selectedIndex = var7; // ddl = findControl("ddlForeColor","select"); ddl.selectedIndex = var8; } function findControl(ControlID, TagName) { var ret = null; var aControls = document.getElementsByTagName(TagName); if (aControls) { for (var i = 0; i < aControls.length; i++) { if (aControls[i].id.lastIndexOf(ControlID) == aControls[i].id.length - ControlID.length && aControls[i].id.length != ControlID.length && aControls[i].id.lastIndexOf(ControlID) > 0) { ret = aControls[i]; break; } } } return ret; } </script> <table class="tblBody"> <tr> <td> <p> This demo relies on saving the image to a file before using it. <a href="http://mcts-study-practices.com/mcts70-536/chapter6/practice1_4.aspx"> Click here, however, to view a tutorial</a> that draws an image without saving it a file using the ASP.NET 2.0 System.Drawing namespace</p> <h3> Using System.Drawing library to draw text and a button on the web</h3> <p> In this sample I I create a high-resolution bitmap object. I clear its background color, draw a polygon and fill it with a color then draw a text. Choose out of the predefined settings or specify the following parameters then press submit to receive a JPG image of the resulting button with a text on it.</p> <img runat="server" id="image1" visible="false"> <table width="95%"> <tr> <td valign="top" width="40%"> <table> <tr> <th> Predefined settings</th> </tr> <tr> <td> <a href="Javascript:Format('flower');">Flower button</a> </td> </tr> <tr> <td> <a href="Javascript:Format('OK');">OK button</a> </td> </tr> <tr> <td> <a href="Javascript:Format('Cancel');">Cancel button</a> </td> </tr> <tr> <td> <a href="Javascript:Format('Business Logo');">Business Logo</a> </td> </tr> <tr> <td> <a href="Javascript:Format('Olives');">Olives</a> </td> </tr> </table> </td> <td width="60%"> <table> <tr> <td> Text on the button (max. 22 char)</td> <td> <asp:TextBox ID="txtForButton" MaxLength="24" runat="server" Width="300"></asp:TextBox></td> </tr> <tr> <td> Font Size (max. 1 char)</td> <td> <asp:TextBox ID="txtSize" MaxLength="1" runat="server" Width="20"></asp:TextBox></td> </tr> <tr> <td> Bitmap width (max. 999px)</td> <td> <asp:TextBox ID="txtWidth" Width="30" MaxLength="3" runat="server"></asp:TextBox></td> </tr> <tr> <td> Bitmap Height (max. 99 px)</td> <td> <asp:TextBox ID="txtHeight" Width="30" MaxLength="2" runat="server"></asp:TextBox></td> </tr> <tr> <td> Font</td> <td> <asp:DropDownList ID="ddlFont" runat="server" onchange="getIndex();"> </asp:DropDownList></td> </tr> <tr> <td> Image Background Color</td> <td> <asp:DropDownList ID="ddlbgColor" runat="server" onchange="getIndex();"> </asp:DropDownList></td> </tr> <tr> <td> Button Background Color</td> <td> <asp:DropDownList ID="ddlButtonBGColor" runat="server" onchange="getIndex();"> </asp:DropDownList></td> </tr> <tr> <td> ForeGround Color</td> <td> <asp:DropDownList ID="ddlForeColor" runat="server" onchange="getIndex();"> </asp:DropDownList></td> </tr> <tr> <td colspan="2" align="center"> <asp:Button ID="btnSubmit" CssClass="NormalButton" OnClick="btnSubmit_Click" runat="server" Text="Submit"></asp:Button></td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </asp:Content>