کار با تصاویر در سی شارپ (مبتدی)

در این آموزش قصد داریم با نحوه ی بارگذاری، ایجاد و ذخیره تصاویر در سی شارپ آشنا شویم. سعی شده تا مطالب ارائه شده در این آموزش ساده و کاربردی باشد و همچنین از توضیحات اضافی و غیر ضروری پرهیز شده تا مطالعه آن در کوتاهترین زمان ممکن صورت بگیرد. در انتها نیز نمونه پروژه ای برای درک بهتر آموزش در اختیار شما قرار گرفته است.
برای کارکردن با تصاویر ابتدا باید Using System.Drawing رو به قسمت using ها اضافه کنید تا کلاس های مربوط به این کار به پروژه اضافه شوند.

 img-in-csharp1خواندن تصاویر از فایل

برای بارگذاری فایل های تصویری میتوانید از نمونه کد زیر استفاده کنید:

Image newImage = Image.FromFile("SampImag.jpg");

توسط متد Image.FromFile می توان اغلب فایل های تصویری نظیر فایل هایی با پسوند .bmp ، .jpg ، .png و… را بارگذاری کرد. با استفاده از کد بالا می توانید فایل تصویری SampImag که پسوند آن .jpg است و در کنار فایل اجرایی برنامه قرار گرفته را بارگذاری کنید. چنانچه فایل تصویری مورد نظر شما در جای دیگری از حافظه باشد، باید آدرس دقیق فایل را به این متد بدهیم تا تصویر مورد نظر به درستی بارگذاری شود. منظور از آدرس کامل این است که برای آدرس دهی از نام درایو شروع کرده و سپس نام پوشه یا پوشه هایی که باید پیمایش شوند تا به فایل مورد نظر برسیم را نوشته و پس از هر کدام یک علامت اسلش قرار میدهیم تا به فایل مورد نظر برسیم. مثال:


Image newImage = Image.FromFile("C:\\myapp\SampImag.jpg");

اگر بخواهیم کاربر عکس مورد نظر خود را برای بارگذاری در برنامه انتخاب کند، باید از کنترل OpenFileDialog استفاده کنیم. برای این کار یک OpenFileDialog بر روی فرم قرار می دهیم و نام آن را myOpenFileDialog و خصوصیت Filter آن را برابر “All Files|*.*” می گذاریم. برای نمایش تصویر باید از کنترل PictureBox استفاده کنیم. بر روی فرم برنامه یک PictureBox قرار دهید و نام آن را myPictureBox بگذارید و خصوصیت SizeMode آن را به StretchImage تغییر دهید تا در صورت بارگذاری تصاویر با سایز بالا، تمام تصویر نمایش داده شود. یک Button هم برای انتخاب عکس در نظر می گیریم و خصوصیت Text آن را برابر “بارگذاری عکس” و Name آن را برابر LoadImageBtn قرار می دهیم. حالا در رویداد LoadImageBtn_Click کد زیر را کپی می کنیم. با اینکار هنگام کلیک بر روی دکمه مورد نظر، پنجره انتخاب فایل نمایان می شود و کاربر می تواند عکس مورد نظر خود را انتخاب کند. پس از انتخاب توسط کاربر، عکس مورد نظر برای نمایش در PictureBox بارگذاری خواهد شد.

images-in-c-sharp-level1-2


myOpenFileDialog.ShowDialog();

if (myOpenFileDialog.FileName != "")

{

Image newImage = Image.FromFile(myOpenFileDialog.FileName);

pictureBox1.Image = newImage;

} 

ایجاد تصاویر با برنامه نویسی

منظور از ایجاد تصاویر این است که بجای بارگذاری فایل تصویری، تصویر را با کدنویسی ایجاد کنیم. برای ایجاد تصویر می توانید از نمونه کد زیر استفاده کنید:


Image newImag = new Bitmap(260,120);

myPictureBox.Image = newImag;

چنانچه کد بالا را اجرا کنید، تغییری در PictureBox  مشاهده نخواهید کرد. دلیل آن این است که شما فقط تصویر را ایجاد کرده اید، اما این تصویر در حالت پیشفرض Transparent است. برای اینکه بتوانید آن را مشاهده کنید، ابتدا باید آن را رنگ آمیزی نمایید. برای انجام این کار باید از کلاس Graphics کمک بگیرید. یک Object از این کلاس بسازید و تصویری که ایجاد نمودید را به آن بدهید تا بتوانیم اعمال گرافیکی نظیر رنگ آمیزی، ترسیم نقطه، خط، اشکال هندسی و متن را بر روی تصویر اعمال کنیم. برای ساخت Object از کلاس Graphics می توانید از نمونه کد زیر کمک بگیرید:


Graphics myGraphic = Graphics.FromImage(newImage);

پس از اینکه شیء myGraphic را ساختید، قادر خواهید بود تا اعمال گرافیکی ذکر شده را بر روی آن انجام دهید:

رنگ آمیزی عکس در سی شارپ

images-in-c-sharp-level1-3

با استفاده از متد FillRectangle مربوط به شیء myGraphic می توانید تصویر خود را رنگ آمیزی کنید. در واقع این تابع یک مستطیل توپر رسم می کند که شما باید مختصات ابتدا و انتهای قطر آن و همچنین رنگ مورد نظر خود را برای رسم مشخص کنید. این متد به چهار طریق مختلف مقدار دهی می شود. ساده ترین نوع آن تعیین مختصات شروع و طول و عرض مستطیل است. به نمونه کد زیر دقت کنید:


myGraphic.FillRectangle(Brushes.DarkGreen, 0, 0, 260, 120);

در نمونه کد بالا، رنگ مورد نظر “سبز تیره” و به ترتیب مختصات x و y شروع رسم، طول و ارتفاع مستطیل مشخص شده است. همانطور که می بینید این مستطیل تمام تصویر را دربرمی گیرد. چنانچه مختصات و طول و عرض اشکال را خارج از محدوده تصویر انتخاب کنید قادر به رویت آن ها نخواهید بود.

نکته: مختصات ۰ و ۰ بیانگر سمت چپ و بالا می باشد. در کلاس Graphics مبدا تصاویر همیشه این نقطه است. به بیان ساده تر، محور y ها در این کلاس با پایین آمدن افزایش یافته و محور x ها با حرکت به سمت راست!

ترسیم متن بر روی عکس در سی شارپ

images-in-c-sharp-level1-1

برای ترسیم متن علاوه بر تعیین رنگ و متن مورد نظر، باید Font مورد نظر خود را هم تعیین کنید. از آنجایی که فونت مورد نظر باید در سیستم مقصد نصب شده باشد و آموزش نصب فونت هدف این آموزش نیست، ما از فونت Tahoma که در تمامی ویندوزها به صورت پیشفرض موجود است استفاده می کنیم. البته در آموزشی جداگانه نحوه‌ی استفاده از فونت دلخواه در سی شارپ را توضیح داده‌ایم که به کمک آن می‌توانید از هر فونت دلخواهی(بدون نیاز به نصب بر روی سیستم کاربر نهایی) استفاده نمایید.

از طرفی، خوشبختانه امکان ترسیم متن فارسی در سی شارپ وجود دارد و برای رسم متن فارسی نیاز به کدنویسی اضافه نخواهیم داشت. اما متاسفانه در حالت پیشفرض، متن های فارسی مانند متن های انگلیسی از چپ به راست رسم می شوند، یعنی مختصات شروع رسم آنها در سمت چپ نوشته قرار می گیرد و در نتیجه برای نمایش صحیح متن فارسی باید مختصات مناسب را با چند بار آزمون و خطا بدست آورد. به نمونه کد زیر دقت نمایید:


Font myFont = new Font("Tahoma",9, FontStyle.Bold);
string myString = "امپراتوری من | تازه های علم و فناوری";
myGraphic.DrawString(myString, myFont, Brushes.White, 15,60);

دخیره تصاویر در حافظه

برای ذخیره تصویر یک SaveFileDialog بر روی فرم قرار دهید و نام آن را mySaveFileDialog قرار داده و خصوصیت Filter آن را برابر “Portable Network Graphic|*.png” قرار دهید. اکنون کافیست از متد Save مربوط به کلاس Image استفاده کنیم. اگر بخواهیم تصاویر با پسوند مشخصی ذخیره شوند می توانیم از امکانات using System.Drawing.Imaging بهره ببریم. به کمک این کلاس می توانیم فرمت مورد نظر برای ذخیره تصویر را تعیین کنیم. به نمونه کد زیر دقت کنید:


mySaveFileDialog.ShowDialog();

if (mySaveFileDialog.FileName !="")

{

Image newImage = pictureBox1.Image;

newImage.Save(mySaveFileDialog.FileName,ImageFormat.Png);

}

موفق و پیروز باشید!

برای آموزش بیشتر در مورد کار با تصاویر در در سی شارپ(پیشرفته) و یا فراگیری نحوه‌ی بارگذاری عکس از Resource در سی شارپ، می‌توانید از پست‌های مربوطه دیدن نمایید. همچنین به کمک این آموزش می‌توانید کاربردهایی نظیر ساخت کدامنیتی تصویری(کپچا) را نیز فرابگیرید.
همچنین می توانید نمونه پروژه مربوط به این آموزش را دانلود نمایید:
پسورد فایل: www.myempire.ir

[button color=”red” size=”medium” link=”https://myempire.ir/wp-content/uploads/ImageClasswww.myempire.ir_.zip” target=”blank” ]دریافت نمونه پروژه[/button]

39 دیدگاه دربارهٔ «کار با تصاویر در سی شارپ (مبتدی);

  1. مرسی از آموزش خوبتون.میخاستم اگه میشه لطف کنید بگید چه طور باید وقتی داره رو کشیدم تو سی شارپ save کنم؟

    1. با سلام،
      اگه یک شی Image ایجاد کردید و دایره رو توسط شی Graphics روی Image ساخته شده کشیدید(توسط متد DrawEllipse برای دایره توخالی و متد FillEllipse برای دایره توپر)، برای ذخیره کردن عکس کافیه که از متد Save مربوط به شی Image استفاده کنید. اگر توضیحات واضح نیستند بگید تا بیشتر براتون توضیح بدم.
      موفق باشید

  2. ممنون
    واقعا کاربردی بود
    بازم از این چیزا بذارید
    راستی من کلاس مقدماتی سی شارپ رفتم ولی همچین چیزایی بهم یاد ندادن!
    بیشتر تو کنسول بود و یکی دو جلسه با فرم کار کرد.
    اگه بخوام با فرم بیشتر آشنا بشم باید چیکار کنم؟ کلاس خاصی واسش هست؟ اسمش چیه؟

    1. خواهش میکنم علی جان، نظر لطفته.
      در آینده حتما پست های شبیه این مطلب منتشر میشه.
      راستش من خودم برای برنامه نویسی تا حالا جایی کلاس نرفتم و دقیقا نمیدونم سرفصل هایی که بیرون درس میدن چیا هست. از طرفی ویندوز فرم برخلاف چیزی که به نظر میرسه خیلی ساده و راحته. من اصول برنامه نویسی شی گرا رو تو دانشگاه یاد گرفتم و بعدها هر جایی که نیاز به انجام کار خاصی داشتم و در موردش اطلاعات نداشتم تو اینترنت دنبال جواب گشتم. اگر فرصت پیدا کنم حتما در مورد ویندوز فرم هم پست ای آموزشی مینویسم.

  3. سلام آقای شیری
    بسیار خوب و عالی بود
    همان طور که صحبتش را کردیم
    با آرزوی موفقیت روزافزون D:

    1. سلام سید جان
      خیلی ممنونم، نظر لطفته ^_^
      البته هنوز یه سری از مطالب رو در مورد “کار کردن با تصاویر در سی شارپ” وقت نکردم اضافه کنم.

  4. سلام و خسته نباشید و ممنون بابت این آموزش
    دارم یه برنامه مینویسم و میخوام پروژم این امکان رو داشته باشه :
    وقتی کاربر کلید “قرار دادن تصویر” رو انتخاب کرد با استفاده از Open File Dialog یک یا چندتا عکس رو انتخاب کنه و آدرس این عکس ها در SQL ذخیره بشه تا بعدا کاربر بتونه تو فرم گزارش ها عکس ها رو ببینه!!!
    اگه کمکم کنید خییییییییییلی ممنون میشم
    امیدوارم تونسته باشم منظورمو برسونم

    1. سلام،
      کنترل OpenFileDialog یک خصوصیت به نام FileName داره که وقتی کاربر فایلی رو انتخاب میکنه، این خصوصیت آدرس فایل انتخاب شده رو نگهداری میکنه. میتونید مقدار این خصوصیت رو به عنوان آدرس فایل در دیتابیس ذخیره کنید.
      اگر توضیحات بیشتر لازم داشتید بگید تا بیشتر توضیح بدم.
      موفق و پیروز باشید.

      1. اگه زحمتی نیست توضیح بیشتر میخوام…
        واینکه چطور میشه که کاربر وقتی یک کلید برای انتخاب عکس رو زد، چندتا عکس رو انتخاب کنه و آدرس همشون ذخیره بشه؟اصلا چنین چیزی امکان داره؟
        ممنون بابت پاسخ گویی سریعی که داشتید…

      2. خواهش میکنم.
        امکان انتخاب چندین عکس بطور همزمان توسط کنترل OpenFileDialog وجود دارد. کافیه خصوصیت MultiSelect کنترل رو True کنی. در این حالت میتونی به کمک خصوصیت FileNames مربوط به کنترل، لیست فایل های انتخاب شده رو بدست بیاری. اگه برای پروژه زیاد عجله نداری، تا فردا میتونم نمونه کدش رو بذارم رو سایت.

      3. خییییییییلی ممنون
        فکرنمیکردم به همین راحتی بشه چندتا عکس رو انتخاب کرد 🙂
        آره بیزحمت ممنون میشم اگه نمونه کد رو بزارید

  5. سلام مجدد خدمت آقا یوسف عزیز
    با راهنمایی شما تونستم که تو جدولم تو sql آدرس فایل رو ذخیره کنم
    اما حالا میخوام که با استفاده از اون آدرس ذخیره شده، عکس نمایش داده بشه!!!!
    چیکار باید کرد؟چه کدی رو کجا باید بنویسم؟

    1. سلام دوباره،
      بابت اینکه دیر دارم جواب میدم معذرت میخوام.
      برای نمایش عکس راه های زیادی وجود داره…
      اگه میخوای عکس رو توی کنترل PictureBox نشون بدی، یه شیء از جنس کلاس Image بساز و آدرس فایلش رو از داخل دیتابیس انتخاب کن.
      نمونه کد:

      Image newImage = Image.FromFile("فایل موجود در دیتابیس");
      pictureBox1.Image = newImage;
      

      موفق و پیروز باشی…

  6. سلام
    ممنون از آموزش خوبتون

    میشه لطف کنید بگید یک مکعب رو چطور میشه رنگ کرد(سه بعدی)

    مکعب رو با دستور CPI.Plotter3D کشیدم نمیدونم چطور رنگش کنم
    موفق باشید

  7. با سپاس از آموزش زیبایتان.برای مشاهده مستطیل رسم شده در تصویر بعداز رسم شکل دوباره تصویر را در pictureboxفراخوانی کنید:

    Graphics myGraphic = Graphics.FromImage(newImage);

    myGraphic.FillRectangle(Brushes.DarkGreen,0, 0, 260, 120);
    pictureBox1.Image = newImage;

  8. سلام میشه لطف کنید برنامه ای که چند عکس داخل یک دایره قرار دارد رابذارید

  9. سلام خسته نباشین
    ببخشید میخواستم بدونم چطوری میتونیم روی دکمه عکس بزاریم با استفاده از
    image
    به طوری که تصویرمون فقط یک طرف دکمه رو بپوشونه نه همه شو؟؟

  10. با سلام میخام تو فرم نرم افزارم یک تصویر دایره ای بیارم و با کلیک بر روی هر نقطه از این تصویر مختصات اون نقطه رو بهم بده
    یا بر اساس نقطه ثقل دایره مقدار فاصله تا مرکز دایره رو بهم بده
    ممنون میشم راهنمایی کنید
    از طریق میل ب اطلاعم برسونید

  11. سلام و خسته نباشید بنده تازه شروع به یادگیری برنامه نویسی با #C کردم چندتا ویندوز فرم در محیط ویژوال استودیو ایجاد کردم که همگی دارای بگراند image هستند و برای دکمه هایی هم که قرار داده بودم برای اتصال این فرم ها با هم از پیکچر باکس استفاده کرده بودم اما توی فرم آخری وقتی به پیکچر باکس عکس را دادم با ارور برخورد کردم که این صفحه از عکس دیگری پشتیبانی می کند بعد هم عکس وهم صفحه را پاک کردم اما باعث شد تمامی صفحات قبلی هم که درست کرده بودم به مشکل بخورند تا قبلش درست بودند الان این ارور برای همه صفحاتم آمده است The type ‘videocloob.Properties.Resources’ has no property named ‘_3’. اون ۳ آخر اسم عکس است که هر صفحه فرق می کند اسمش عکس ها در پوشه Resources در برنامه هستند چطور می توانم این خطا ها را در صفحات درست کنم اگر می توانید لطفا راهنمایی کنید با تشکر.

  12. سلام ببخشید اگه بخوایم تصویری که کاربر در برنامه وارد میکنه فیلتر بشه و به عنوان مثال برنامه تا ی حجمی رو از تصاویر قبول کنه باید چکار کنیم؟
    مرسی اگه راهنماییم کنین.

  13. درود
    به ما گفتن برای پروژه کلاسی
    برنامه ای با سی پلاس پلاس بنویسید
    که یه عکس باشه و دو کلید که روی یه کلید بزنی عکس رو نشون بده و روی کلید دوم میزنی عکس رو پنهان کنه
    من ترم اولم و دو جلسه پیش غایب بودم میشه راهنماییم کنید ممنون.
    عکسها و کلید رو گذاشتم فقط باید چی بنویسم یا چیکار کنم نشون بده

    1. سلام.
      اگر با زبان سی پلاس پلاس کار می کنید متاسفانه نمیتونم کمکتون کنم. اما اگر میتونید با سی شارپ برنامه‌تون رو بنویسید، خیلی ساده میشه این کار رو با event کلیک دکمه ها هندل کرد. یک picturebox در پنجره برنامه بذارید و یک دکمه مسئول enable کردن و دیگری مسئول disable کردن picturebox شود. به همین راحتی!

  14. جناب یوسفی سلام. وقت شما بخیر.
    من مشکلی پیدا کردم ممنون میشم کمک کنید. دارم یک برنامه لاگین طراحی میکنم که اگر شناسه کاربری عکس انتخاب نکرد یک عکس پیش فرض در دیتا بیس ذخیره بشه. ولی هر کاری میکنم نمیشه. ممنون میشم اگه راهنمایی کنید.

    1. سلام،
      معمولا از دیتابیس برای ذخیره فایل استفاده نمیکنن، اما اگر نیاز داری که فایلی رو داخل دیتابیس قرار بدی(مثلا همین تصویر پش‌فرض، ابتدا فایل عکس رو به base64 تبدیل کن. اینطوری میتونی محتوای متنی حاصل رو به راحتی تو دیتابیس ذخیره کنی و هر کجا که بهش نیاز داشتی با دیکد کردن اطلاعات ذخیره شده در دیتابیس، به عکس مورد نظر دسترسی پیدا کنی.

  15. سلام اگه بعد دادن آدرست تصویر استفاده کننده پوشه برنامه رو به یکجای دیگه منطقل کنه اون وقت تصویر باز نمیشه . برای رفع این مشکل باید چی کار کنم؟

    1. در این مطلب ما برای اعمال تغییرات بر روی تصاویر از یک openFileDialog استفاده کردیم. آدرسی که توسط این کامپوننت بدست میاد آدرس مطلق فایل هست که چیزی شبیه نمونه زیر هست:
      C:\Users\Admin\Desktop\Image.jpg
      اما اگر میخواهید تصویری در برنامه‌تان نمایش داده شود که همیشه ثابت باشد و با جابجایی پوشه‌ی برنامه به جایی دیگر نمایش تصویر به هم نخورد، می‌توانید از دو روش کمک بگیرید.
      اول: می‌توانید به چای آدرس مطلق از آدرس نسبی استفاده کنید. آدرس نسبی از جایی که فایل اجرایی برنامه هست آغاز می‌شود. مثلا آدرس زیر:
      images/Image.jpg
      آدرس فوق به معنای این است که در کنار فایل اجرایی برنامه، یک پوشه به نام images وجود دارد که فایل Image.jpg در داخل آن قرار دارد. در این وضعیت اگر پوشه‌ی برنامه‌تان که حاوی فایل اجرایی برنامه و پوشه‌ی images است را جابجا کنید، برنامه بدون مشکل تصویر را باز خواهد کرد.
      دوم: می‌توانید با استفاده از امکان Resource فایل تصویری مورد نظر خود را به فایل اجرایی برنامه الحاق کنید. در این وضعیت هم اطمینان خواهید داشت که برنامه همیشه می‌تواند فایل تصویری را بدرستی باز کند. اطلاعات بیشتر در مورد استفاده از Resouce در این مطلب موجود هست.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *