Рамка для фото в виде смартфона
Рамка для фото в виде смартфона
Для одной презентации понадобилось достаточно большое количество картинок, на которых представлены скриншоты мобильной версии продукта. С самими картинками проблем не возникло, нащелкали на смартфонах сколько надо скриншотов. Согласно поставленной задаче, для пущей убедительности картинки должны быть, так сказать, "в интерьере", то есть как будто отрисованные на экране смартфонов. Конечно, фотошоп никто не отменял, можно было заморочиться и наделать все ручками, но программистское мышление взяло вверх. Как верно подметил герой одного старого мультика, "лучше день потерять, зато потом за пять минут долететь".
Первым делом в этих ваших интернетах была найдена картинка с нейтральным изображением смартфона, без логотипов и других опознавательных знаков. Затем я разделил ее на три части: верх, низ и центральная часть, которая должна растягиваться на любую высоту, так как скриншоты делались на устройствах с разными пропорциями экрана. Готовые кусочки изображения можете скачать по ссылке ниже:
Изображения для создания рамкиТеперь дело за PHP. Скрипт берет исходную картинку, подгоняет ее по ширине до экрана виртуального смартфона. Затем формируется целевое изображение из верхней и нижней части, средняя часть растягивается до высоты отмасштабированного скриншота. Последним слоем в границы рамки вписывается исходная картинка и готовое изображение сохраняется на диск.
Code (PHP) : Убрать нумерацию
- $im=ImageCreateFromJPEG('Screenshot_1.jpg');
- // Размеры исходного изображения
- $width=ImageSX($im);
- $height=ImageSY($im);
- // Ширина виртуального экрана
- $inner_width=427;
- $coeff=$inner_width/$width;
- $dst_w=ceil($width*$coeff);
- $dst_h=intval($height*$coeff);
- // Размеры нового изображения
- $new_x=482;
- $new_y=80+55+$dst_h;
- // Создать пустое изображение
- $dst_im=ImageCreateTrueColor($new_x, $new_y);
- // Верхняя часть изображения
- $src1=imagecreatefrompng('image1.png');
- $tmp_h1=ImageSY($src1);
- ImageCopyResampled($dst_im, $src1, 0, 0, 0, 0,
- $new_x, $tmp_h1, $new_x, $tmp_h1);
- ImageDestroy($src1);
- // Заполнить среднюю часть изображения
- $src2=imagecreatefrompng('image2.png');
- $tmp_h2=ImageSY($src2);
- $y=0;
- while($y<$dst_h) {
- ImageCopyResampled($dst_im, $src2, 0, ($tmp_h1+$y), 0, 0,
- $new_x, $tmp_h2, $new_x, $tmp_h2);
- $y+=$tmp_h2;
- }
- ImageDestroy($src2);
- // Нижняя часть изображения
- $src3=imagecreatefrompng('image3.png');
- $tmp_h3=ImageSY($src3);
- ImageCopyResampled($dst_im, $src3, 0, (55+$dst_h), 0, 0,
- $new_x, $tmp_h3, $new_x, $tmp_h3);
- ImageDestroy($src3);
- // Наложить исходное изображение
- ImageCopyResampled($dst_im, $im, 28, 66, 0, 0,
- $dst_w, $dst_h, $width, $height);
- ImageDestroy($im);
- header("Content-type: image/png");
- ImagePNG($dst_im,NULL);
- ImageDestroy($dst_im);
Рамка для фото в виде смартфона
В зависимости от размеров исходной картинки меняется и создаваемое изображение, оно автоматически подгоняется под нужные пропорции. Итоговый результат всех устроил, презентация прошла на отлично. Может быть скрипт пригодится кому-нибудь еще.
Просмотров: 2689 | Комментариев: 4
Внимание! Статья опубликована больше года назад, информация могла устареть!
Комментарии
Отзывы посетителей сайта о статье
ManHunter
(17.07.2020 в 16:33):
https://www.php.net/manual/en/...ge.php#88456
Дмитрий
(17.07.2020 в 16:20):
Здравствуйте!
Спасибо за полезный скрипт. Подскажите пожалуйста, как сохранять финальное изображение с сохранением прозрачности?
Я убрал белый фон, формат png, но при финальном сохранении получается черный фон вместо прозрачного! Буду очень благодарен за подсказку
Спасибо за полезный скрипт. Подскажите пожалуйста, как сохранять финальное изображение с сохранением прозрачности?
Я убрал белый фон, формат png, но при финальном сохранении получается черный фон вместо прозрачного! Буду очень благодарен за подсказку
Алекс
(22.12.2018 в 01:32):
Спасибо за идею! Очень полезный блог у Вас!
Ellephant
(02.12.2018 в 09:00):
Спасибо за рамочки )
Добавить комментарий
Заполните форму для добавления комментария
Материалы, опубликованные на этом сайте, не рекомендуются к просмотру лицам в возрасте до 16 лет без присутствия взрослых.
Вам помог этот сайт?
Поблагодарили 35,692 раза
Поблагодарили 35,692 раза
Буду очень благодарен, если размеcтите мою кнопочку:
 |
Яндекс ИКС: 360 |
 |
 |