GDI+

APR 17 2008

Date Image Thing
Author: Joe Maddalone

I want to be trendy, too

For shiggles, I wanted to add a nice little trendy date format to my postings, but everything I found seemed a bit too wordy for me. It always looks like this:

<div class="post-date">
<span class="month">10</span>
<span class="day">04</span>
<span class="year">1977</span>
</div>

This site is dynamically generated, so it wouldn't take too much effort in order to implement such a structure, but I'm stubborn... so here goes

Overprocessed, Nerdy Post Date Image Generation


<%@ Import Namespace="System.Drawing" %>
 <%@ Import Namespace="System.Drawing.Imaging" %>
 <script language="VB" runat="server">
 Sub Page_Load(sender as Object, e as EventArgs)
 dim strDt as string = request.querystring("dt")
 dim strMonth as string = left(MonthName(Month(strDt)),3).ToUpper()
 dim strDay as string = Day(strDt).ToString()
 if strDay.Length=1
 	strDay="0" & strDay
 end if
 dim strYear as string = Year(strDt).ToString()
 
  Dim baseMap as Bitmap = new Bitmap(95, 13)
  '13 cuts it off, which looks cool -- see emersian.com
  Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
  Dim upBrush as SolidBrush = new SolidBrush(Color.black)
  Dim downBrush as SolidBrush = new SolidBrush(Color.steelblue)
  Dim MonthFont as Font = new Font("tahoma", 11,FontStyle.Bold)
  Dim dtFont as Font = new Font("tahoma", 14,FontStyle.Bold)
  myGraphic.FillRectangle(new SolidBrush(Color.white), 0, 0, 100, 25)  
  myGraphic.DrawString(strMonth, MonthFont, upBrush, 0, 0)
  myGraphic.DrawString(strDay, MonthFont, downBrush, 30, 0)
  myGraphic.DrawString(strYear, MonthFont, upBrush, 50, 0)
  myGraphic.TextRenderingHint = System.Drawing.Text.TextRenderingHint.AntiAlias 
  
  Response.ContentType = "image/gif"
  baseMap.Save(Response.OutputStream, ImageFormat.GIF)

  myGraphic.Dispose()
  baseMap.Dispose()
 End Sub
 </script>
%>

Usage

< img src="dt.aspx?dt=DATE STRING HERE" />

3 Comments

OCT 28 2005

GDI+ Font Embedding
Author: Joe Maddalone

The Code: h1.aspx

<%@ Page EnableSessionState="false" Trace=True Language="vb" debug="true" validateRequest=false %> 
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Imaging" %>
<%@ Import namespace="System.Drawing.Drawing2D" %>
<%@ Import namespace="System.Drawing.Text" %>

<script language="VB" runat="server">
Sub Page_Load(sender as Object, e as EventArgs)
dim myString as String
myString = request.querystring("h1")

Dim baseMap as Bitmap = new Bitmap(600, 50)
Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
Dim upBrush as SolidBrush = new SolidBrush(Color.FromArgb(0,0,0))
Dim backBrush as SolidBrush = new SolidBrush(Color.FromArgb(255,255,255))
Dim familyNameAndStyle As String 
Dim FontCollection As New PrivateFontCollection()  
FontCollection.AddFontFile(Server.MapPath("TYPEWRIT.TTF"))  
Dim thisFont As FontFamily
thisFont = FontCollection.Families(0)  
Dim fontTitle As New Font(thisFont, 18)  
'or use a system font
'Dim fontTitle as Font = new Font("tahoma", 16)
familyNameAndStyle = thisFont.Name

myGraphic.TextRenderingHint = System.Drawing.Text.TextRenderingHint.ClearTypeGridFit  
myGraphic.SmoothingMode = SmoothingMode.Antialias ' antialias objects  
myGraphic.FillRectangle(backBrush, 0, 0, 600, 50)  
myGraphic.DrawString(myString, fontTitle, upBrush, 5, 5)

Response.ContentType = "image/jpeg"
baseMap.Save(Response.OutputStream, ImageFormat.JPEG)
myGraphic.Dispose()
baseMap.Dispose()
End Sub
</script>

Usage

<img src="h1.aspx?h1=Hello World" />

Example

0 Comments

SEP 10 2005

Dynamic Color Shifting
Author: Joe Maddalone

The Code: colorshift.aspx

	
<%@ Page Explicit="True" Language="VB" Debug="True" %> 
<%@ import namespace="system.drawing" %>
<%@ import namespace="system.drawing.imaging" %>
<%@ Import Namespace="system.io" %>
<script runat="server">
Dim Filename
dim Img as System.Drawing.Bitmap
dim x,y,h,w,l,s as Integer
sub CreateGraphic()
	Filename = Request.QueryString("filename")
	Filename = server.mappath(Filename)
	Img = system.drawing.bitmap.FromFile(Filename)
	s = Request.QueryString("s")
	h = Img.height
	w = Img.width
	for y = 1 to h-1
		for x = 1 to w-1
		Dim c as Color = Img.GetPixel(x,y)
		l = CInt(c.R*0.3 + c.G*0.59 + c.B*0.11)
			if s = 0 then		'0 = GRAYSCALE
				Img.SetPixel(x,y,Color.FromArgb(l,l,l))
			elseif s = 1 then	'1 = RED
				Img.SetPixel(x,y,Color.FromArgb(l,0,0))
			elseif s = 2 then	'2 = GREEN
				Img.SetPixel(x,y,Color.FromArgb(0,l,0))
			elseif s = 3 then	'3 = BLUE
				Img.SetPixel(x,y,Color.FromArgb(0,0,l))
			elseif s = 4 then	'4 = PURPLE
				Img.SetPixel(x,y,Color.FromArgb(l,0,l))
			elseif s = 5 then	'5 = YELLOW
				Img.SetPixel(x,y,Color.FromArgb(l,l,0))
			elseif s = 6 then	'6 = BLUE-GREEN
				Img.SetPixel(x,y,Color.FromArgb(0,l,L))
			end if
		next
		next
end sub
</script>
<%
CreateGraphic
Img.Save(Response.OutputStream, ImageFormat.JPEG)
Img.dispose()
response.end
%>

Usage

<img src="colorshift.aspx?filename=FILENAME.JPG&s=CHOOSE 0 THRU 6 SEE CODE" />

Example

4 Comments

SEP 10 2005

GDI+ Security String image
Author: Joe Maddalone

The Code: verify.aspx

	
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Imaging" %>
<%@ Import namespace="System.Drawing.Drawing2D" %>
<script language="VB" runat="server">
Sub Page_Load(sender as Object, e as EventArgs)
Dim r as New Random
Dim baseMap as Bitmap = new Bitmap(200, 50)
Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
Dim HBrush As HatchBrush = New HatchBrush( RandomHatch(), GetRandomColor(r))
Dim upBrush as SolidBrush = new SolidBrush(GetRandomColor(r))
Dim fontTitle as Font = new Font("tahoma", 24)
myGraphic.FillRectangle(HBrush, 0, 0, 200, 50)  


myGraphic.DrawString(RandomStringGenerator(6), fontTitle, upBrush, r.Next(0, 80), r.Next(0, 10))
Response.ContentType = "image/jpeg"
baseMap.Save(Response.OutputStream, ImageFormat.JPEG)
myGraphic.Dispose()
baseMap.Dispose()
End Sub

Public Function RandomStringGenerator(ByVal intLen As Integer) As String
    Dim rRandom As New Random()
    Dim Zero As Integer = Asc("0")
    Dim Nine As Integer  = Asc("9")
    Dim capA As Integer  = Asc("A")
    Dim capZ As Integer  = Asc("Z")
    Dim litA As Integer  = Asc("a")
    Dim litZ As Integer  = Asc("z")    
    
Dim iRandNum as integer
	Dim strTemp as String = ""
	Dim i As Integer
	While i < intLen
	iRandNum = rRandom.Next(Zero, litZ)
		If ((((iRandNum > = Zero) And (iRandNum <= Nine) Or _
		(iRandNum > = capA) And (iRandNum < = capZ) Or _
		(iRandNum > = litA) And (iRandNum < = litZ)))) Then 
			strTemp = strTemp + Chr(iRandNum) 
			i+=1
	       End If
	End while
	Return strTemp
End Function

Public Function RandomHatch() As HatchStyle 
	Randomize() 
	Select Case Rnd() * 56 
		Case Is < 1 : Return HatchStyle.BackwardDiagonal
		Case Is < 2 : Return HatchStyle.Cross
		Case Is < 3 : Return HatchStyle.DarkDownwardDiagonal
		Case Is < 4 : Return HatchStyle.DarkHorizontal
		Case Is < 5 : Return HatchStyle.DarkUpwardDiagonal
		Case Is < 6 : Return HatchStyle.DarkVertical
		Case Is < 7 : Return HatchStyle.DashedDownwardDiagonal
		Case Is < 8 : Return HatchStyle.DashedHorizontal
		Case Is < 9 : Return HatchStyle.DashedUpwardDiagonal
		Case Is < 10 : Return HatchStyle.DashedVertical
		Case Is < 11 : Return HatchStyle.DiagonalBrick
		Case Is < 12 : Return HatchStyle.DiagonalCross
		Case Is < 13 : Return HatchStyle.Divot
		Case Is < 14 : Return HatchStyle.DottedDiamond
		Case Is < 15 : Return HatchStyle.ForwardDiagonal
		Case Is < 16 : Return HatchStyle.Horizontal
		Case Is < 17 : Return HatchStyle.HorizontalBrick
		Case Is < 18 : Return HatchStyle.LargeCheckerBoard
		Case Is < 19 : Return HatchStyle.LargeConfetti
		Case Is < 20 : Return HatchStyle.LargeGrid
		Case Is < 21 : Return HatchStyle.LightDownwardDiagonal  
		Case Is < 22 : Return HatchStyle.LightHorizontal
		Case Is < 23 : Return HatchStyle.LightUpwardDiagonal
		Case Is < 24 : Return HatchStyle.LightVertical
		Case Is < 25 : Return HatchStyle.DottedGrid
		Case Is < 26 : Return HatchStyle.Max
		Case Is < 27 : Return HatchStyle.Min
		Case Is < 28 : Return HatchStyle.NarrowHorizontal
		Case Is < 29 : Return HatchStyle.NarrowVertical
		Case Is < 30 : Return HatchStyle.OutlinedDiamond
		Case Is < 31 : Return HatchStyle.Percent05
		Case Is < 32 : Return HatchStyle.Percent10
		Case Is < 33 : Return HatchStyle.Percent20
		Case Is < 34 : Return HatchStyle.Percent25
		Case Is < 35 : Return HatchStyle.Percent30
		Case Is < 36 : Return HatchStyle.Percent40
		Case Is < 37 : Return HatchStyle.Percent50
		Case Is < 38 : Return HatchStyle.Percent60
		Case Is < 39 : Return HatchStyle.Percent70
		Case Is < 40 : Return HatchStyle.Percent75
		Case Is < 41 : Return HatchStyle.Percent80
		Case Is < 42 : Return HatchStyle.Percent90
		Case Is < 43 : Return HatchStyle.Plaid
		Case Is < 44 : Return HatchStyle.Shingle
		Case Is < 45 : Return HatchStyle.SmallCheckerBoard
		Case Is < 46 : Return HatchStyle.SmallConfetti
		Case Is < 47 : Return HatchStyle.SmallGrid
		Case Is < 48 : Return HatchStyle.SolidDiamond
		Case Is < 49 : Return HatchStyle.Sphere
		Case Is < 50 : Return HatchStyle.ZigZag
		Case Is < 51 : Return HatchStyle.Trellis
		Case Is < 52 : Return HatchStyle.Vertical
		Case Is < 53 : Return HatchStyle.Wave
		Case Is < 54 : Return HatchStyle.Weave
		Case Is < 55 : Return HatchStyle.WideDownwardDiagonal
		Case Is < 56 : Return HatchStyle.WideUpwardDiagonal
	End Select 
End Function 


Private Function GetRandomColor(r) As Color
    Return Color.FromArgb(r.Next(0, 256), r.Next(0, 256), r.Next(0,256))
End Function
</script>

Usage

<img src="verify.aspx" />

Real Time Example

10 Comments

SEP 10 2005

Dynamic GDI+ meets CSS
Author: Joe Maddalone

The Code: nav.aspx

	
<%@ Import Namespace="System.Drawing" %>
 <%@ Import Namespace="System.Drawing.Imaging" %>
 <script language="VB" runat="server">
 Sub Page_Load(sender as Object, e as EventArgs)
  Dim baseMap as Bitmap = new Bitmap(210, 106)
  Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
  Dim upBrush as SolidBrush = new SolidBrush(Color.FromArgb(255,255,255))
  Dim downBrush as SolidBrush = new SolidBrush(Color.FromArgb(55,55,0))
  Dim fontTitle as Font = new Font("tahoma", 24)
  myGraphic.FillRectangle(new SolidBrush(Color.White), 0, 0, 210, 160)  
  
  myGraphic.FillRectangle(new SolidBrush(Color.lightblue), 2, 2, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.lightblue), 54, 2, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.lightblue), 106, 2, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.lightblue), 158, 2, 50, 50)  
  
  
  myGraphic.FillRectangle(new SolidBrush(Color.red), 2, 54, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.yellow), 54, 54, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.green), 106, 54, 50, 50)  
  myGraphic.FillRectangle(new SolidBrush(Color.blue), 158, 54, 50, 50)  
  
  
  myGraphic.DrawString("1", fontTitle, upBrush, 10, 10)
  myGraphic.DrawString("1", fontTitle, downBrush, 10, 60)
  myGraphic.DrawString("2", fontTitle, upBrush, 64, 10)
  myGraphic.DrawString("2", fontTitle, downBrush, 64, 60)
  myGraphic.DrawString("3", fontTitle, upBrush, 116, 10)
  myGraphic.DrawString("3", fontTitle, downBrush, 116, 60)
  myGraphic.DrawString("4", fontTitle, upBrush, 168, 10)
  myGraphic.DrawString("4", fontTitle, downBrush, 168, 60)  
   Response.ContentType = "image/jpeg"
  baseMap.Save(Response.OutputStream, ImageFormat.JPEG)

  myGraphic.Dispose()
  baseMap.Dispose()
 End Sub
 </script>
%>

The Code 2: nav.html

	
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>
 <title>nav</title>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <style media="screen">

#iconmenu {
	position:relative;
	margin:10px auto;
	padding:3px;
	width:206px;
	height:52px;
	background:url(pattern.gif)
}

#iconmenu li {
	width:50px;
	height:50px;
	position:absolute;
	top:2px;
	background:url(nav.aspx) 0 0 no-repeat;
	display:block;
	list-style:none
}

#iconmenu a {
	width:50px;
	height:50px;
	display:block;
	border:solid 1px #fff
}

#iconmenu a:hover {
	border:solid 1px #fff
}

#iconmenu #panel1c {
	left:2px
}

#iconmenu #panel2c {
	left:54px;
	background-position:-52px 0
}

#iconmenu #panel3c {
	left:106px;
	background-position:-106px 0
}

#iconmenu #panel4c {
	left:158px;
	background-position:-158px 0
}

#iconmenu #panel1c a:hover {
	background:url(nav.aspx) -2px -54px no-repeat
}

#iconmenu #panel2c a:hover {
	background:url(nav.aspx) -54px -54px no-repeat
}

#iconmenu #panel3c a:hover {
	background:url(nav.aspx) -106px -54px no-repeat
}

#iconmenu #panel4c a:hover {
	background:url(nav.aspx) -158px -54px no-repeat
}


 </style>
</head>

<body>
 <ul id="iconmenu">
  <li id="panel1c"><a href="#" onClick="alert('ONE');"></a></li>
  <li id="panel2c"><a href="#" onClick="alert('TWO');"></a></li>
  <li id="panel3c"><a href="#" onClick="alert('THREE');"></a></li>
  <li id="panel4c"><a href="#" onClick="alert('FOUR');"></a></li>
 </ul>
</body>
</html>

The Result

click here

2 Comments

SEP 10 2005

Quick Watermark
Author: Joe Maddalone

The Code: watermark.aspx

	
<%@ Page Explicit="True" Language="VB" Debug="True" %> 
<%@ Import Namespace="system.drawing" %>
<%@ Import Namespace="system.drawing.imaging" %>
<%@ Import Namespace="system.drawing.drawing2d" %>
<%@ Import Namespace="system.io" %>
<script runat="server">
  
  dim Filename as String
  dim Width, Height, shadowSize as Integer
  dim Bitmap as system.drawing.bitmap
  dim ImgFormat as ImageFormat
  dim Img as System.Drawing.Image
  Dim baseMap as Bitmap 
	dim top, left as Integer  
sub CreateGraphic()
	Dim letterBrush as SolidBrush = new SolidBrush(Color.FromArgb(50, 255, 255, 255))
	Dim shadowBrush as SolidBrush = new SolidBrush(Color.FromArgb(50, 0, 0, 0))
	Dim fontTitle as Font = new Font("tahoma", 20, FontStyle.Bold)
	Filename = Request.QueryString("filename")
	Filename = server.mappath(Filename)
	ImgFormat = ImageFormat.jpeg : response.contenttype="image/jpeg"  ' Default=jpeg '
	Img = system.drawing.image.FromFile(Filename)    
	Width  = Img.Width
	Height = Img.Height
  	baseMap = new Bitmap(Width,Height)
  	Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
  	with myGraphic
		.DrawImage(Img, 0,0, Width,Height)
		.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias
		.DrawString("LABS.INSERT-TITLE.COM", fontTitle, shadowBrush, 5, 60)
		.DrawString("LABS.INSERT-TITLE.COM", fontTitle, letterBrush, 7, 62)
	end with
	Img.dispose()

end sub
</script>
<%
CreateGraphic
baseMap.Save(Response.OutputStream, ImageFormat.JPEG)
baseMap.dispose()
Img = Nothing   
response.end
%>
</script>

Usage

	
<img src="watermark.aspx?filename=FILENAME.JPG" />

Example

13 Comments

SEP 10 2005

Quick Dropshadow
Author: Joe Maddalone

The Code: shadow.aspx

	
<%@ Page Explicit="True" Language="VB" Debug="True" %> 
<%@ Import Namespace="system.drawing" %>
<%@ Import Namespace="system.drawing.imaging" %>
<%@ Import Namespace="system.drawing.drawing2d" %>
<%@ Import Namespace="system.io" %>
<script runat="server">
  dim Filename as String
  dim Width, Height, shadowSize as Integer
  dim Bitmap as system.drawing.bitmap
  dim Graphix as Graphics
  dim ImgFormat as ImageFormat
  dim Img as System.Drawing.Image
  Dim baseMap as Bitmap 
  dim top, left as Integer

sub CreateGraphic()
   Filename = Request.QueryString("filename")
   Filename = server.mappath(Filename)
   ImgFormat = ImageFormat.jpeg : response.contenttype="image/jpeg"
   Img = system.drawing.image.FromFile(Filename)    
   Width  = Img.Width
   Height = Img.Height
   shadowSize = 10
   baseMap = new Bitmap(Width+shadowSize,Height+shadowSize)
   Dim myGraphic as Graphics = Graphics.FromImage(baseMap)
   with myGraphic
   .FillRectangle(new SolidBrush(Color.white), 0, 0, Width+shadowSize, Height+shadowSize)  
   .FillRectangle(new SolidBrush(Color.darkgray), 10, 10, Width+shadowSize, Height+shadowSize) 
   .FillRectangle(new SolidBrush(Color.black), 0, 0, Width+6, Height+6) 
   .DrawImage(Img, 2,2, Width+2,Height+2)
   end with
   Img.dispose()
end sub
</script>
<%
CreateGraphic
baseMap.Save(Response.OutputStream, ImageFormat.JPEG)
baseMap.dispose()
Img = Nothing   
response.end
%>

Usage

<img src="shadow.aspx?filename=FILENAME.JPG" />

Example

1 Comments

LATEST POSTS

Portfolio of the Future Just a random bit of sketching I was doing. Random things this month On my way to the interwebs I recall all I have learned today. CSV Splitter Reinventing the wheel one app at a time. Competetive Data Scraping Not yet an Olympic sport. Date Image Thing GDI+ to overprocess blog post dates!

GDI+

I want to be trendy, too

Overprocessed, Nerdy Post Date Image Generation

Usage

The Code: h1.aspx

Usage

Example

The Code: colorshift.aspx

Usage

Example

The Code: verify.aspx

Usage

Real Time Example

The Code: nav.aspx

The Code 2: nav.html

The Result

The Code: watermark.aspx

Usage

Example

The Code: shadow.aspx

Usage

Example

Posts

Stores

LATEST POSTS

ADS

MOST POPULAR