การเขียนโปรแกรมกราฟิกใน C# อาจดูเหมือนง่ายหรือยากกว่าที่คุณคิด ในบทความนี้ คุณจะได้เรียนรู้วิธีสร้างกราฟิกแบบเวกเตอร์ที่สวยงามโดยทางโปรแกรม ไม่ว่าคุณกำลังสร้างกราฟิกโดยเป็นส่วนหนึ่งของโปรเจ็กต์ปัจจุบันของคุณหรือเป็นพื้นฐานของเกมหรือแอพของคุณเอง! คุณจะได้เรียนรู้การสร้างภาพที่สวยงามอย่างง่ายดาย มาเริ่มกันเลย!
หัวข้อต่อไปนี้จะครอบคลุมในบทความนี้:
- API การเขียนโปรแกรมกราฟิกแบบเวกเตอร์ C#
- โครงสร้างของกราฟิกแบบเวกเตอร์
- การเขียนโปรแกรมกราฟิกโดยใช้ C#
- เส้นโค้งในการเขียนโปรแกรมกราฟิก
- รูปหลายเหลี่ยมและสี่เหลี่ยมผืนผ้า
- วิธีการวาดเส้น
- วิธีการวาดเส้นทาง
- วาดพื้นที่เติม
C# Vector Graphics Programming API - ดาวน์โหลดฟรี
ในการสร้างกราฟิกแบบเวกเตอร์ที่น่าทึ่งใน C# เราจะใช้ API Aspose.Drawing for .NET เป็นไลบรารีกราฟิก 2D ข้ามแพลตฟอร์มสำหรับการวาดข้อความ รูปทรงเรขาคณิต และรูปภาพโดยทางโปรแกรม อนุญาตให้โหลด บันทึก และจัดการ รูปแบบไฟล์ที่รองรับ
โปรด ดาวน์โหลด DLL ของ API หรือติดตั้งโดยใช้ NuGet
PM> Install-Package Aspose.Drawing
โครงสร้างของกราฟิกแบบเวกเตอร์
กราฟิกแบบเวกเตอร์ประกอบด้วยรูปทรงเรขาคณิต: เส้น เส้นโค้ง และเส้นทาง วัตถุเหล่านี้มีคุณสมบัติต่างๆ เช่น ความยาวและสี สามารถจัดการได้ด้วยโปรแกรม C#
การเขียนโปรแกรมกราฟิกด้วยภาษา C#
เราสามารถวาดหรือวาดรูปร่างประเภทต่างๆ รวมถึงเส้นโค้ง เส้น สี่เหลี่ยม พื้นที่เติม วงรี และรูปหลายเหลี่ยม API มีวิธีการต่างๆ ในการวาดรูปร่างเหล่านี้ เราสามารถสร้างกราฟิกแบบเวกเตอร์ได้หลากหลายโดยทางโปรแกรมโดยทำตามขั้นตอนด้านล่าง:
- สร้างวัตถุของคลาส Bitmap
- เริ่มต้นวัตถุของคลาสกราฟิกจากบิตแมป
- กำหนดวัตถุคลาส Pen หรือ SolidBrush ด้วยพารามิเตอร์ที่ต้องการ
- ใช้วิธีการเฉพาะรูปร่างของคลาสกราฟิกเพื่อวาดรูปร่างที่ต้องการ
- ในตอนท้ายให้บันทึกภาพ
ตอนนี้เรามาดูวิธีการทำตามขั้นตอนเหล่านี้ใน C#
เส้นโค้งในการเขียนโปรแกรมกราฟิกโดยใช้ C#
เราสามารถวาดส่วนโค้ง วงกลม วงรี หรือเส้นโค้งปิดได้โดยใช้วิธีการต่อไปนี้
- DrawArc() วิธีการวาดส่วนโค้ง
- DrawEllipse() วิธีการวาดวงรี
- วิธีการ DrawClosedCurve() เพื่อวาดเส้นโค้งปิด
- DrawCurve() วิธีการวาดเส้นโค้ง
โปรดทำตามขั้นตอนด้านล่างเพื่อวาดรูปร่างโค้ง:
- ขั้นแรก สร้างอินสแตนซ์ของคลาสบิตแมป
- จากนั้น สร้างวัตถุคลาสกราฟิกโดยใช้เมธอด FromImage() จากวัตถุบิตแมปที่สร้างขึ้นใหม่
- จากนั้น กำหนดวัตถุคลาสปากกาด้วยสีและขนาดที่ระบุ
- หลังจากนั้นเรียกเมธอด DrawClosedCurve() เพื่อวาดเส้นโค้งปิด
- หรือทำซ้ำขั้นตอนข้างต้นเพื่อเพิ่มส่วนโค้งและวงรี
- สุดท้าย บันทึกภาพผลลัพธ์โดยใช้เมธอด Save()
ตัวอย่างโค้ดต่อไปนี้แสดงวิธีการวาดรูปร่างโค้งใน C#
// ตัวอย่างโค้ดนี้สาธิตวิธีการวาดเส้นโค้ง ส่วนโค้ง และวงกลมแบบปิด
// สร้างบิตแมป
Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
// เริ่มต้นกราฟิกจากบิตแมป
Graphics graphics = Graphics.FromImage(bitmap);
// กำหนดปากกาที่จะวาด
Pen penBlue = new Pen(Color.Blue, 4);
// วาดเส้นโค้ง
graphics.DrawClosedCurve(penBlue, new Point[] { new Point(10, 700), new Point(250, 500), new Point(500, 10), new Point(750, 500), new Point(990, 700) });
// วาดส่วนโค้ง
Pen penRed = new Pen(Color.Red, 2);
graphics.DrawArc(penRed, 0, 0, 700, 700, 0, 180);
// วาดวงรี
Pen penGreen = new Pen(Color.Green, 2);
graphics.DrawEllipse(penGreen, 10, 10, 500, 500);
// บันทึกบิตแมปเป็น PNG
bitmap.Save("C:\\Files\\Drawing\\Curves.png");
รูปหลายเหลี่ยมและสี่เหลี่ยมในการเขียนโปรแกรมกราฟิกโดยใช้ C#
เราสามารถวาดรูปหลายเหลี่ยมและสี่เหลี่ยมได้โดยทำตามขั้นตอนที่กล่าวมาก่อนหน้านี้ อย่างไรก็ตาม เราต้องใช้วิธีการต่อไปนี้ในขั้นตอน #4:
- DrawPolygon() วิธีการวาดรูปหลายเหลี่ยม
- วิธีการ DrawRectangle() เพื่อวาดรูปสี่เหลี่ยมผืนผ้า
ตัวอย่างโค้ดต่อไปนี้แสดงวิธีการวาดรูปหลายเหลี่ยมและสี่เหลี่ยมใน C#
// ตัวอย่างโค้ดนี้สาธิตวิธีการวาดรูปหลายเหลี่ยมและสี่เหลี่ยมผืนผ้า
// สร้างบิตแมป
Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
// เริ่มต้นกราฟิกจากบิตแมป
Graphics graphics = Graphics.FromImage(bitmap);
// กำหนดปากกาที่จะวาด
Pen penBlue = new Pen(Color.Blue, 4);
// วาดรูปหลายเหลี่ยม
graphics.DrawPolygon(pen, new Point[] { new Point(100, 100), new Point(500, 700), new Point(900, 100) });
// วาดรูปสี่เหลี่ยมผืนผ้า
Pen penRed = new Pen(Color.Red, 2);
graphics.DrawRectangle(penRed, 10, 10, 900, 700);
// บันทึกบิตแมปเป็น PNG
bitmap.Save("C:\\Files\\Drawing\\Shapes.png");
เส้นในการเขียนโปรแกรมกราฟิกโดยใช้ C#
ในทำนองเดียวกัน เราสามารถวาดเส้นโดยทำตามขั้นตอนที่กล่าวไว้ก่อนหน้านี้ อย่างไรก็ตาม เราต้องใช้เมธอด DrawLine() ในขั้นตอน #4 เพื่อวาดเส้น
ตัวอย่างโค้ดต่อไปนี้แสดงวิธีการวาดเส้นใน C#
// ตัวอย่างโค้ดนี้สาธิตวิธีการวาดเส้น
// สร้างบิตแมป
Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
// เริ่มต้นกราฟิกจากบิตแมป
Graphics graphics = Graphics.FromImage(bitmap);
// กำหนดปากกาที่จะวาด
Pen penBlue = new Pen(Color.Blue, 4);
// วาดเส้น
graphics.DrawLine(pen, 10, 700, 500, 10);
graphics.DrawLine(pen, 500, 10, 990, 700);
// บันทึกบิตแมปเป็น PNG
bitmap.Save("C:\\Files\\Drawing\\Lines.png");
เส้นทางในการเขียนโปรแกรมกราฟิกโดยใช้ C#
ในกราฟิกแบบเวกเตอร์ เส้นทางแสดงถึงชุดของเส้นตรงเรียบที่กำหนดโดยจุดเริ่มต้นและจุดสิ้นสุด พร้อมด้วยจุดอื่นๆ เราสามารถวาดเส้นทางได้โดยทำตามขั้นตอนด้านล่าง:
- ขั้นแรก สร้างอินสแตนซ์ของคลาสบิตแมป
- ถัดไป เริ่มต้นวัตถุคลาสกราฟิกจากวัตถุบิตแมปที่สร้างขึ้นใหม่โดยใช้เมธอด FromImage()
- จากนั้น กำหนดวัตถุคลาสปากกาด้วยสีและขนาดที่ระบุ
- จากนั้น สร้างอินสแตนซ์ของคลาส GraphicsPath
- จากนั้นเพิ่มบรรทัดโดยใช้เมธอด AddLine()
- หลังจากนั้น เรียกใช้เมธอด DrawPath() ด้วยวัตถุ Pen และ GraphicsPath
- สุดท้าย บันทึกภาพผลลัพธ์โดยใช้เมธอด Save()
ตัวอย่างโค้ดต่อไปนี้แสดงวิธีการวาดเส้นทางใน C#
// ตัวอย่างรหัสนี้สาธิตวิธีการวาดเส้นทาง
// สร้างบิตแมป
Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
// เริ่มต้นกราฟิกจากบิตแมป
Graphics graphics = Graphics.FromImage(bitmap);
// กำหนดปากกาที่จะวาด
Pen penBlue = new Pen(Color.Blue, 4);
// เริ่มต้นเส้นทางกราฟิก
GraphicsPath path = new GraphicsPath();
// เพิ่มบรรทัดที่ 1
path.AddLine(100, 100, 1000, 400);
// เพิ่มบรรทัดที่ 2
path.AddLine(1000, 600, 300, 600);
// เพิ่มสี่เหลี่ยมผืนผ้า
path.AddRectangle(new Rectangle(500, 350, 200, 400));
// เพิ่มวงรี
path.AddEllipse(10, 250, 450, 300);
// วาดเส้นทาง
graphics.DrawPath(pen, path);
// บันทึกบิตแมปเป็น PNG
bitmap.Save("C:\\Files\\Drawing\\Shapes.png");
เติมพื้นที่ในการเขียนโปรแกรมกราฟิกโดยใช้ C#
เราสามารถวาดพื้นที่เติมได้โดยทำตามขั้นตอนด้านล่าง:
- ขั้นแรก สร้างอินสแตนซ์ของคลาสบิตแมป
- ถัดไป เริ่มต้นวัตถุคลาสกราฟิกจากวัตถุบิตแมปที่สร้างขึ้นใหม่โดยใช้เมธอด FromImage()
- จากนั้น สร้างอินสแตนซ์ของคลาส GraphicsPath
- เพิ่มรูปหลายเหลี่ยมโดยใช้เมธอด AddPolygon()
- จากนั้น สร้างอินสแตนซ์ของคลาส Region
- จากนั้นเพิ่มออบเจกต์ GraphicsPath อื่นและเพิ่มสี่เหลี่ยมผืนผ้าโดยใช้เมธอด AddRectangle()
- ถัดไป เรียกใช้เมธอด Exclude() เพื่อแยกเส้นทางภายในออกจากพื้นที่
- จากนั้นกำหนดวัตถุคลาส SolidBrush ด้วยสีที่ระบุ
- หลังจากนั้น ให้เรียกเมธอด FillRegion() ด้วยวัตถุ SolidBrush และ GraphicsPath
- สุดท้าย บันทึกภาพผลลัพธ์โดยใช้เมธอด Save()
ตัวอย่างโค้ดต่อไปนี้แสดงวิธีการวาดพื้นที่เติมใน C#
// ตัวอย่างรหัสนี้สาธิตวิธีการวาดภูมิภาค
// สร้างบิตแมป
Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
// เริ่มต้นกราฟิกจากบิตแมป
Graphics graphics = Graphics.FromImage(bitmap);
// เพิ่มรูปหลายเหลี่ยม
path.AddPolygon(new Point[] { new Point(100, 400), new Point(500, 100), new Point(900, 400), new Point(500, 700) });
// เริ่มต้นภูมิภาค
Region region = new Region(path);
// เส้นทางกราฟิกภายใน
GraphicsPath innerPath = new GraphicsPath();
// เพิ่มสี่เหลี่ยมผืนผ้า
innerPath.AddRectangle(new Rectangle(300, 300, 400, 200));
// ไม่รวมเส้นทางภายใน
region.Exclude(innerPath);
// กำหนดแปรงที่เป็นของแข็ง
Brush brush = new SolidBrush(Color.Blue);
// เติมพื้นที่
graphics.FillRegion(brush, region);
// บันทึกบิตแมปเป็น PNG
bitmap.Save("C:\\Files\\Drawing\\Lines.png");
รับใบอนุญาตชั่วคราวฟรี
คุณสามารถ รับใบอนุญาตชั่วคราวได้ฟรี เพื่อลองใช้ Aspose.Drawing for .NET โดยไม่มีข้อจำกัดในการประเมิน
บทสรุป
ในบทความนี้ เราได้เรียนรู้วิธีการ:
- สร้างบิตแมปใหม่
- วาดสี่เหลี่ยมผืนผ้า วงรี ฯลฯ บนบิตแมป
- วาดเส้นและเส้นทาง
- บันทึกภาพบิตแมปเป็น PNG ใน C#
นอกจากการเขียนโปรแกรมกราฟิกใน C# แล้ว คุณสามารถเรียนรู้เพิ่มเติมเกี่ยวกับ Aspose.Drawing for .NET โดยใช้ เอกสารประกอบ และสำรวจคุณสมบัติต่างๆ ที่ API รองรับ ในกรณีที่มีความคลุมเครือ โปรดติดต่อเราได้ที่ ฟอรัมสนับสนุนฟรี