Neodynamic ImageDraw (2.0 or later) for ASP.NET
Microsoft .NET Framework (2.0 or later)
Microsoft Visual Studio .NET (2005 or later - Visual Web Developer Express Edition)
ASP.NET 2.0 features new Resources capabilities allowing you, for example, to store image files embedded into RESX files without you need to deploy those files on production servers. ImageDraw was designed keeping in mind that feature and thus, you can manipulate and use those embedded images without effort.
In this article we will analyze the following scenarios:
Preparing Embedded Images Resources
Before starting with each aforementioned scenario we are going to prepare the needed items and application project.
Follow these steps:
Now that the embedded image files are ready to use in the Website project let's begin developing each scenario.
To render an image embedded into a RESX file - the T-Shirt image for example - follow these steps:
<form id="form1" runat="server">
<div>
<neoimg:ImageDraw ID="ImageDraw1" runat="server">
</neoimg:ImageDraw>
</div>
</form>
"<%$ Resources:MyResources, t_shirt %>"
Your code should look like the following:
<form id="form1" runat="server">
<div>
<neoimg:ImageDraw ID="ImageDraw1" runat="server">
<Elements>
<neoimg:ImageElement Source="Image" SourceImage="<%$ Resources:MyResources, t_shirt %>"></neoimg:ImageElement>
</Elements>
</neoimg:ImageDraw>
</div>
</form>
To render an image embedded into a RESX file - the T-Shirt image for example - and apply onto it some built-in ImageDraw Imaging Effects (Actions) such us ConvertToNegative and Scale, follow these steps:
<form id="form1" runat="server">
<div>
<neoimg:ImageDraw ID="ImageDraw1" runat="server">
<Elements>
<neoimg:ImageElement Source="Image" SourceImage="<%$ Resources:MyResources, t_shirt %>">
<Actions>
<neoimg:ConvertToNegative />
<neoimg:Scale HeightPercentage="50" WidthPercentage="50" />
</Actions>
</neoimg:ImageElement>
</Elements>
</neoimg:ImageDraw>
</div>
</form>
ImageDraw allows Image Composition concept in ASP.NET applications. In this scenario we're going to use an ImageDraw control to render a Composite Image consisting of the two images embedded into a RESX file - the T-Shirt image and the ASP.NET logo. Follow these steps:
<form id="form1" runat="server">
<div>
<neoimg:ImageDraw ID="ImageDraw1" runat="server">
</neoimg:ImageDraw>
</div>
</form>
<form id="form1" runat="server">
<div>
<neoimg:ImageDraw ID="ImageDraw1" runat="server">
<Elements>
<neoimg:ImageElement Source="Image" SourceImage="<%$ Resources:MyResources, t_shirt %>"></neoimg:ImageElement>
<neoimg:ImageElement Source="Image" SourceImage="<%$ Resources:MyResources, aspnetlogo %>" X="70" Y="50"></neoimg:ImageElement>
</Elements>
</neoimg:ImageDraw>
</div>
</form>
ImageDraw allows Image Composition concept in ASP.NET Data Binding scenarios as well. In this sample we're going to use a DataList control with an ImageDraw control to render Composite Images consisting of a set of local images (t-shirts) and an image embedded into a RESX file (the ASP.NET logo). The complete demo sample is available for downloading at the end of this article.
Follow these steps:
<asp:DataList ID="DataList1" runat="server" RepeatColumns="4" RepeatDirection="Horizontal" CellPadding="10">
<ItemTemplate>
<neoimg:ImageDraw ID="ImageDraw1" runat="server" AlternateText='<%# Eval("color", "ASP.NET t-shirt - Color: {0}") %>' CacheExpiresAtDateTime="">
<Elements>
<neoimg:ImageElement Source="File" DataImageFileField="imageFileName" DataImageFileFormatString="~/images/{0}">
<Actions>
<neoimg:Scale HeightPercentage="50" WidthPercentage="50" />
</Actions>
</neoimg:ImageElement>
<neoimg:ImageElement Source="Image" SourceImage="<%$ Resources:MyResources, aspnetlogo %>" X="40" Y="30">
<Actions>
<neoimg:Scale HeightPercentage="50" WidthPercentage="50" />
</Actions>
</neoimg:ImageElement>
</Elements>
<Canvas Height="124" Width="137" />
</neoimg:ImageDraw>
</ItemTemplate>
<HeaderTemplate>
<span style="color: royalblue; font-family: Arial"><strong>
Buy your ASP.NET t-shirt now!</strong></span>
</HeaderTemplate>
</asp:DataList>
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim ds As New DataSet()
ds.ReadXml(Server.MapPath("t-shirts.xml"))
Me.DataList1.DataSource = ds
Me.DataList1.DataBind()
End Sub
protected void Page_Load(object sender, EventArgs e)
{
DataSet ds = new DataSet();
ds.ReadXml(Server.MapPath("t-shirts.xml"));
this.DataList1.DataSource = ds;
this.DataList1.DataBind();
}
Sample Files Download
Here are the VB.NET and C# versions of the Data Binding sample and the ASP.NET Resource RESX file to reproduce the first three scenarios.
For ImageDraw 3.0
For ImageDraw 2.0
Remember to download and install ImageDraw in order to reproduce this sample demo.
We provide best-in-class customer service and support directly from members of our dev team! If we are available when you contact us, you will get a response in few minutes; otherwise the maximum turnaround is 24hs in most cases.