افزودن تاریخ روی تصویر

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

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

1. یک ادیتور متنی ترجیحا emacs
2. PHP همراه با کتابخانه GD
3. ادیتور تصویر GIMP
4. چند دقیقه زمان برای خواندن این پست و ساخت این برنامه کوچک

بخش اول ساخت تصویر اولیه:
اگر نمی خواهید وارد پروسه ساخت تصویر شوید یا ادیتور تصویری در دسترس ندارید تصویر زیر را دریافت کرده و به سراغ بخش دوم بروید.
[caption id="attachment_1297" align="alignnone" width="50" caption="تصویر اولیه"][/caption]
قدم اول: GIMP را باز می کنیم با استفاده از کلیدهای CRTL+N یک تصویر جدید با ابعاد ۵۰ در ۵۸ پیکسل ایجاد می کنیم.
قدم دوم: کل تصویر را انتخاب می کنیم (ctrl+a) و روی آن کلیک راست می کنیم از منوهای موجود روی Select می رویم و از زیر منوی آن روی Rounded Rectangle کلیک می کنیم. در کادر باز شده مقدار Radius را حدود 45 درصد تعیین می کنیم وok می کنیم تا گوشه های ناحیه انتخاب حدودا گرد شود.

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

قدم چهارم: روی جعبه رنگ  دابل کلیک می کنیم و رنگ دلخواه خود را انتخاب می کنیم/ تایپ می کینم/ می سازیم
قدم پنجم: حالا Shift+B را می زنیم تا سطل رنگ انتخاب شود و با آن ناحیه انتخاب شده را رنگ می کنیم.

قدم ششم: بار دیگر کلید R فشار می دهیم با پایین نگهداشتن کلید کنترل این بار قسمت بالایی رنگ شده را انتخاب می کنیم تا از ناحیه انتخاب شده خارج شود حالا قسمت پایین در ناحیه انتخاب است. پس چند بار دکمه Delete را فشار می دهیم تا آن قسمت بار دیگر سفید شود.

قدم هفتم: قدم چهار و پنج را برای قسمت پایینی تکرار کنید.
قدم هشتم: کلید crtl+s را فشار دهید و تصویر را با نام مناسب و پسوند png ذخیره کنید (مثلا simple.png)
بخش دوم
در بر روی میزبان php خود یک پوشه بسازید و تصویری را که ساختید در آنجا آپلود کنید یا به آن انتقال دهید همچنین یک فونت ttf نظیر FreeSansBold در به آن پوشه انتقال دهید حالا به سراغ برنامه می رویم
قرار است که ماه و روزی که از متد get می آیند را روی تصویر قرار دهیدم و اگر از این ماه روز(day & month) خبری نبود امروز و این ماه را روی تصویر قرار دهیم پس خواهیم داشت:
[php]
$mah=(isset($_GET['month']))?$_GET['month']:date("M");
$roz=(isset($_GET['day']))?$_GET['day']:date("j");
[/php]
(با تشکر از جناب oia جهت اصلاح خطوط بالا)حالا فایل تصویری را که ساختیم به عنوان فرم به برنامه می دهیم:
[php] $tasvir = imagecreatefrompng('simple.png');[/php]
پس از این پهنای نوشته را بر براساس فونت و اندازه خواسته شده پیدا می کنیم برای اینکار از تابع imagettfbbox استفاده می کنیم. این تابع به ترتیب اندازه فونت (که ما ۱۲و ۱۶ را انتخاب کرده ایم)، زاویه نوشته برحسب درجه (که ما ۰ یعنی در راستای افق مدنظرمان است)، آدرس فایل فونت و متن مورد نظر را می گیرد و پهنایی را که متن اشغال می کند را بر می گردانند. پهنای کل تصویر(فرم) هم با imagesx به دست می آبد شاید بپرسید که پهنای تصویر مشخص است؛ درواقع تعداد پیکسل های تصویر (۵۰ در ۵۸) را می دانیم تعداد. پیکسل و تراکم (DPI) اندازه تصویر را مشخص می کنند که ما از محاسبه دستی آن می گذریم.
[php] $pM = imagettfbbox(10, 0, "./FreeSansBold.ttf", $mah);
$pR = imagettfbbox(15, 0, "./FreeSansBold.ttf", $roz);
$pahna= imagesx($tasvir); [/php]
حالا باید رنگ قلم را بر اساس فرم بسازیم با همان ترکیب قرمز-سبز-آبی ۰-۲۵۵ این کار را هم با تابع imagecolorallocate انجام می دهیم که به ترتیب تصویر غلظت رنگ قرمز(۰-۲۵۵)، غلظت رنگ آبی(۰-۲۵۵)، غلظت رنگ سبز(۰-۲۵۵) را می گیرد و رنگ مورد نظر را می سازد:
[php] $sefid = imagecolorallocate($tasvir, 255, 255, 255); [/php]
حالا با تابع imagettftext متن مورد نظر را روی تصویر می نویسیم. این تابع به ترتیب تصویر اندازه فونت، زاویه چرخش، متن، فاصله از سمت چپ، فاصله از بالا، رنگ فونت و متن را گرفته و متن را روی تصویر/فرم می نویسد. فاصله از سمت چپ(برای اینکه متن در وسط تصویر باشد): پهنای تصویر+ پهنای متن، تقسیم ۲. و ارتفاع از بالا را با حدس زدن و کم زیاد کردن به دست می آوریم:
[php] imagettftext($tasvir, 16, 0, ($pahna - $pR[2]) / 2, 28, $sefid, "./FreeSansBold.ttf", $roz);
imagettftext($tasvir, 12, 0, ($pahna - $pM[2]) / 2, 55, $sefid, "./FreeSansBold.ttf", $mah); [/php]
حالا تصویر هدر صفحه را از متن به تصویر jpg  تغییر می دهیم (با این کار به مرورگر خواهیم گفت که محتویات این صفحه به جای متن ساده از یک تصویر تشکیل شده):
[php] header('content-type: image/jpeg'); [/php]
بالاخره تصویر نهایی را jpg  ساخته و به خروجی می فرستیم(اگر بخواهیم این تصویر ذخیره شود آرگمان دوم را نام/آدرس محل ذخیره تصویر می دهیم(به طور پشفرض null) و اگر بخواهیم کیفیت تصویر را از مقدار پیشفرض یعنی حدود ۷۵ تغییر دهیم آرگمان سوم را از صفر تا صد تعیین می کنیم):
[php] imagejpeg($tasvir); [/php]
در آخر با تخریب تصویر حافظه اشغال شده را آزاد می کنیم
[php] imagedestroy($tasvir); [/php]
در نهایت خواهیم داشت:
[php]
$mah=(isset($_GET['month']))?$_GET['month']:date("M");
$roz=(isset($_GET['day']))?$_GET['day']:date("j");
$tasvir = imagecreatefrompng('./simple.png');
$pM = imagettfbbox(12, 0, "./FreeSansBold.ttf", $mah);
$pR = imagettfbbox(16, 0, "./FreeSansBold.ttf", $roz);
$pahna= imagesx($tasvir);
$sefid = imagecolorallocate($tasvir, 255, 255, 255);
imagettftext($tasvir, 16, 0, ($pahna - $pR[2]) / 2, 28, $sefid, "./FreeSansBold.ttf", $roz);
imagettftext($tasvir, 12, 0, ($pahna - $pM[2]) / 2, 55, $sefid, "./FreeSansBold.ttf", $mah);
header('content-type: image/jpeg');
imagejpeg($tasvir);
imagedestroy($tasvir);
[/php]
در زیر دو خروجی نمونه از برنامه مشاهده می کنید:

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