Background
Break News
How to add local font to Tailwind Css and NextJS? - Tutorial Design Pattern? - Blockchain Technology, How to create own Bitcoin virtual currency - Zustand mordern management state - Design Pattern - Flyweight Pattern? - Docker Full training Topic

[Tips] How to "write text or draw string on bitmap image file"

Monday 15 January 2018
|
Read: Completed in minutes

[Tips] How to "write text or draw string on bitmap image file"

How to write text or draw string on bitmap image file

One beautiful day, your client request you help them build an window application about export some profile CV of users with:
- Input: image and information of user.
- Output: one template with image and information of that user.


Same as picture

How to write text or draw string on bitmap image file




This projects related to write some string, draw some image into bitmap, picture file. So you have to working with API of C# programming language about write string and draw image into picture.

Understand your request. Today, I'll help you build that application with step by step

Step1: I set that project name is: ExportCandidate

Step2: Find your template of CV on internet, Example, I use this

How to write text or draw string on bitmap image file


Is it look good? :D

Step3: I prepare for you some API support draw string and insert image into picture file


Check below code (NOT RUN)
string firstText = "Your Name";
	PointF firstLocation = new PointF(200f, 90f);
	          
	string PathSourceImg = @"img\Candicate.jpg";
	string PathDistanceImg = @"img\Candicate_dist.jpg";            
	 
	using (Graphics graphics = Graphics.FromImage(PathSourceImg))
	{
		using (Font arialFont = new Font("Verdana", 15, FontStyle.Bold))
	    {
	       graphics.DrawString(firstText, arialFont, Brushes.Blue, firstLocation);             
	    }
	}
	temp.Save(PathDistanceImg);//save the image file

If you want to write string into picture, use above API, BUT Graphics objects don't allow you draw string direct into image or picture!!! So if you want to draw string into image, you need create another temp bitmap same as size of bitmaps! after that you can draw any string into image.

Look around below Source Code (PERFECT)

string firstText = "Your Name";
	 
	PointF firstLocation = new PointF(200f, 90f);
	            
	 
	string PathSourceImg = @"img\Candicate.jpg";
	string PathDistanceImg = @"img\Candicate_dist.jpg";
	                        
	Bitmap bitmap = (Bitmap)Image.FromFile(PathSourceImg);  //load the image file
	            
	// Create a blank bitmap with the same dimensions
	Bitmap temp = new Bitmap(bitmap.Width, bitmap.Height);
	            
	using (Graphics graphics = Graphics.FromImage(temp))
	{
	    // draw a original bitmap onto the graphices of the new bitmap
	    graphics.DrawImage(bitmap, 0, 0);                
	 
	    // draw string to temp bitmap, so you can write string to bitmap
	    // using (Font arialFont = new Font("Verdana", 12, FontStyle.Bold))
	    using (Font arialFont = new Font("Verdana", 15, FontStyle.Bold))
	    {
	        graphics.DrawString(firstText, arialFont, Brushes.Blue, firstLocation);                    
	    }
	}
	temp.Save(PathDistanceImg);//save the image file

Yay, you can use above code for add string to image, but if you want to add avatar into your bitmap, how do you do it, just use below code

string firstText = "Your Name";
	 
	PointF firstLocation = new PointF(200f, 90f);
	            
	 
	string PathSourceImg = @"img\Candicate.jpg";
	string PathDistanceImg = @"img\Candicate_dist.jpg";
	 
	string ProfileImage = @"img\picture.png";
	                        
	Bitmap bitmap = (Bitmap)Image.FromFile(PathSourceImg);  //load the image file
	Bitmap bitmapProfile = (Bitmap)Image.FromFile(ProfileImage);  //load the image file
	            
	// Create a blank bitmap with the same dimensions
	Bitmap temp = new Bitmap(bitmap.Width, bitmap.Height);
	            
	using (Graphics graphics = Graphics.FromImage(temp))
	{
	    // draw a original bitmap onto the graphices of the new bitmap
	    graphics.DrawImage(bitmap, 0, 0);
	    graphics.DrawImage(bitmapProfile, 100, 100);
	 
	    // draw string to temp bitmap, so you can write string to bitmap
	    // using (Font arialFont = new Font("Verdana", 12, FontStyle.Bold))
	    using (Font arialFont = new Font("Verdana", 15, FontStyle.Bold))
	    {
	        graphics.DrawString(firstText, arialFont, Brushes.Blue, firstLocation);                    
	    }
	}
	temp.Save(PathDistanceImg);//save the image file

Use graphics.DrawImage and graphics.DrawString to draw image into another bitmap and insert string into bitmap.

The last thing, how do we know below dimensions: 200f, 90f?

PointF firstLocation = new PointF(200f, 90f);
	


You just use any edit graphics program, this tutorial I use photoshop cs6,
Click to View -> Rules (Ctrl+R), right click into rules choose points, view your rules and get your dimensions of image

Photoshop cs6 rules Ctrl+R

Photoshop cs6 rules Ctrl+R


To do this tutorial, you need equip some Photoshop skills :)

Thank you for reading this post. I hope you found it helpful and easy to follow. If you have any feedback or questions about How to "write text or draw string on bitmap image file" , please share them in the comments below. I would love to hear from you and discuss this topic further
✋✋✋✋  Webzone Tech Tips  - I am Zidane, See you next time soon ✋✋✋✋

🙇🏼 We Appreciate Your Comments and Suggestions - Webzone - all things Tech Tips web development 🙇🏼
Popular Webzone Tech Tips topic maybe you will be like it - by Webzone Tech Tips - Zidane
As a student, I found Blogspot very useful when I joined in 2014. I have been a developer for years . To give back and share what I learned, I started Webzone, a blog with tech tips. You can also search for tech tips zidane on Google and find my helpful posts. Love you all,

I am glad you visited my blog. I hope you find it useful for learning tech tips and webzone tricks. If you have any technical issues, feel free to browse my posts and see if they can help you solve them. You can also leave a comment or contact me if you need more assistance. Here is my blog address: https://learn-tech-tips.blogspot.com.

My blog where I share my passion for web development, webzone design, and tech tips. You will find tutorials on how to build websites from scratch, using hot trends frameworks like nestjs, nextjs, cakephp, devops, docker, and more. You will also learn how to fix common bugs on development, like a mini stackoverflow. Plus, you will discover how to easily learn programming languages such as PHP (CAKEPHP, LARAVEL), C#, C++, Web(HTML, CSS, javascript), and other useful things like Office (Excel, Photoshop). I hope you enjoy my blog and find it helpful for your projects. :)

Thanks and Best Regards!
Follow me on Tiktok @learntechtips and send me a direct message. I will be happy to chat with you.
Webzone - Zidane (huuvi168@gmail.com)
I'm developer, I like code, I like to learn new technology and want to be friend with people for learn each other
I'm a developer who loves coding, learning new technologies, and making friends with people who share the same passion. I have been a full stack developer since 2015, with more than years of experience in web development.
Copyright @2022(November) Version 1.0.0 - By Webzone, all things Tech Tips for Web Development Zidane
https://learn-tech-tips.blogspot.com