Thursday, July 30, 2015

Convert text into image and show image preview in asp.net

In this article I am going to explain how to Convert text into image and show image preview in asp.net

Description:
In the previous article I have explained Pass parameter to RDLC report and CreateRDLC report using Store procedure

When users enter text in textbox/input, entered text will be converting into png image and showing its preview.

Implementation:
Add a webform to project. Drag and drop the required control from toolbox to webform.
HTML Markup of webform:
<table><tr><td>Enter Text</td><td>
        <asp:TextBox ID="txtname" runat="server"></asp:TextBox></td></tr>
        <tr><td></td><td>
            <asp:Button ID="btnconvert" runat="server" Text="Convert Text Into Image" /></td></tr>
        <tr><td></td><td>
            <asp:Image ID="imgpreview" runat="server" /></td></tr>
    </table>

Add the namespaces to code file
C#:
using System.Drawing.Text;
using System.Drawing.Drawing2D;
using System.IO;
using System.Drawing.Imaging;
using System.Drawing;

VB:
Imports System.Drawing.Text
Imports System.Drawing.Drawing2D
Imports System.IO
Imports System.Drawing.Imaging
Imports System.Drawing

Converting the text into image and show the preview
Write the below given code on button click
C#:
protected void btnconvert_Click(object sender, EventArgs e)
    {
        ConvertTextIntoImage(txtname.Text);
    }
    private Bitmap ConvertTextIntoImage(string strImageText)
    {
        Bitmap objBmpImage = new Bitmap(1, 1);
        Font objFont = new Font("century", 50, System.Drawing.FontStyle.Bold, System.Drawing.GraphicsUnit.Pixel);
        Graphics objGraphics = Graphics.FromImage(objBmpImage);
        int intWidth = (int)objGraphics.MeasureString(strImageText, objFont).Width;
        int intHeight = (int)objGraphics.MeasureString(strImageText, objFont).Height;
        objBmpImage = new Bitmap(objBmpImage, new Size(intWidth, intHeight));
        objGraphics = Graphics.FromImage(objBmpImage);
        objGraphics.Clear(Color.Transparent);
        objGraphics.SmoothingMode = SmoothingMode.AntiAlias;
        objGraphics.TextRenderingHint = TextRenderingHint.AntiAlias;
        objGraphics.DrawString(strImageText, objFont, new SolidBrush(Color.FromArgb(134, 75, 33)), 0, 0);
        objGraphics.Flush();
        objGraphics.Dispose();
        string fileName = Path.GetFileNameWithoutExtension(Path.GetRandomFileName()) + ".png";
        objBmpImage.Save(Server.MapPath("~/images/") + fileName, ImageFormat.Png);
        imgpreview.ImageUrl = "~/images/" + fileName;
        return (objBmpImage);
    }

VB:
Protected Sub btnconvert_Click(sender As Object, e As EventArgs) Handles btnconvert.Click
        ConvertTextIntoImage(txtname.Text)
    End Sub
    Private Function ConvertTextIntoImage(strImageText As String) As Bitmap
        Dim objBmpImage As New Bitmap(1, 1)
        Dim objFont As New Font("century", 50, System.Drawing.FontStyle.Bold, System.Drawing.GraphicsUnit.Pixel)
        Dim objGraphics As Graphics = Graphics.FromImage(objBmpImage)
        Dim intWidth As Integer = CInt(objGraphics.MeasureString(strImageText, objFont).Width)
        Dim intHeight As Integer = CInt(objGraphics.MeasureString(strImageText, objFont).Height)
        objBmpImage = New Bitmap(objBmpImage, New Size(intWidth, intHeight))
        objGraphics = Graphics.FromImage(objBmpImage)
        objGraphics.Clear(Color.Transparent)
        objGraphics.SmoothingMode = SmoothingMode.AntiAlias
        objGraphics.TextRenderingHint = TextRenderingHint.AntiAlias
        objGraphics.DrawString(strImageText, objFont, New SolidBrush(Color.FromArgb(134, 75, 33)), 0, 0)
        objGraphics.Flush()
        objGraphics.Dispose()
        Dim fileName As String = Path.GetFileNameWithoutExtension(Path.GetRandomFileName()) + ".png"
        objBmpImage.Save(Server.MapPath("~/images/") & fileName, ImageFormat.Png)
        imgpreview.ImageUrl = Convert.ToString("~/images/") & fileName
        Return (objBmpImage)
    End Function
Build, run the project and see the result.
 Result:
Convert text into image and show image preview in asp.net

    In this article we have learn how to Convert text into image and show image preview in asp.net (C#, VB). I hope you enjoyed this article. 

No comments:

Post a Comment