Градиентный фон на PHP

31.07.2019 | Категория: Web-мастеру и не только | Автор: ManHunter

Градиентный фон на PHP

Продолжаем работать с графикой на PHP. Сегодня будем рисовать градиентную заливку фона, когда один цвет плавно перетекает в другой.

Для горизонтального градиента у меня получился следующий скрипт. Размеры фона, а также начальные и конечные цвета задаются в первых строчках.

Code (PHP) : Убрать нумерацию

// Размеры изображения
$width=600;
$height=225;
// Начальный цвет градиента
$start_color=0x55FFFF;
// Конечный цвет градиента
$end_color=0xFF0000;
$R1=($start_color >> 16) & 0xFF;
$G1=($start_color >> 8) & 0xFF;
$B1=$start_color & 0xFF;
$R2=($end_color >> 16) & 0xFF;
$G2=($end_color >> 8) & 0xFF;
$B2=$end_color & 0xFF;
$im=ImageCreateTrueColor($width, $height);
// Нарисовать горизонтальный градиент
for ($x=0; $x<$width; $x++) {
$R=$R1-round(($R1-$R2)/$width*$x);
$G=$G1-round(($G1-$G2)/$width*$x);
$B=$B1-round(($B1-$B2)/$width*$x);
$color=ImageColorAllocate($im,$R,$G,$B);
ImageLine($im,$x,0,$x,$height,$color);
}

После этого готовое изображение можно вывести в браузер или использовать для дальнейшей работы, накладывая на него нужные элементы. Чтобы нарисовать вертикальный градиент, немного меняется основной цикл, остальные параметры остаются прежними:

Code (PHP) : Убрать нумерацию

// Нарисовать вертикальный градиент
for ($y=0; $y<$height; $y++) {
$R=$R1-round(($R1-$R2)/$height*$y);
$G=$G1-round(($G1-$G2)/$height*$y);
$B=$B1-round(($B1-$B2)/$height*$y);
$color=ImageColorAllocate($im,$R,$G,$B);
ImageLine($im,0,$y,$width,$y,$color);
}

Градиентный фон можно использовать, например, для создания эффектной рамки вокруг превьюшки на основании усредненного цвета верхней и нижней границы изображения. Также можно сделать более сложный вариант, например, тройной градиент, в этом случае фон до половины заливается градиентом от Цвета1 до Цвета2, а от половины до конца от Цвета2 до Цвета3. Это вы уже можете сделать самостоятельно.

Градиентный фон на PHP

Более сложный градиент можно получить, если цвет пересчитывается динамически для каждой точки. Времени на это потребуется больше, чем на рисование отдельных линий, но и результат выглядит гораздо лучше.

Code (PHP) : Убрать нумерацию

$width=600;
$height=450;
$im=ImageCreateTrueColor($width, $height);
for ($x=0; $x<$width; $x++) {
for ($y=0; $y<$height; $y++) {
$gradient=ImageColorAllocate($im,
(255/$width)*$x,
(255/$height)*$y,
255
);
ImageSetPixel($im,$x,$y,$gradient);
}
}

Меняя коэффициент изменения, значение и положение фиксированной составляющей цвета, можно достигнуть очень интересных результатов. Примерно по такому же алгоритму рисуются, например, поля выбора цвета в графических редакторах.

Просмотров: 1702 | Комментариев: 1

Метки: PHP, графика

Внимание! Статья опубликована больше года назад, информация могла устареть!

Добавить комментарий

Заполните форму для добавления комментария

Если программист в девять утра уже на работе, значит он там же и ночевал

Главная страница Web-мастеру и не только Образ мышления: Assembler Мои программы Software Темная сторона Силы Обзоры техники А еще я туда ем! Жизнь в оффлайне Всякая всячина

Карта сайта Ссылки Обратная связь Правила сайта Настройки сайта RSS-канал

Материалы, опубликованные на этом сайте, не рекомендуются к просмотру лицам в возрасте до 16 лет без присутствия взрослых.

Метки статей

Свернуть

Вам помог этот сайт?

Поблагодарили 33,219 раз

День ОМОНа России

Всемирный день трезвости и борьбы с алкоголизмом

Нашли на сайте орфографическую ошибку? Выделите ее мышкой и нажмите

Ctrl

Enter

Буду очень благодарен, если размеcтите мою кнопочку:

<a href="https://www.manhunter.ru" target="_blank"><img src="https://www.manhunter.ru/images/button.gif" alt="Личный блог ManHunter'а" title="Личный блог ManHunter'а" width="88" height="31" /></a>

$Яндекс тИЦ: {YANDEX_TIC}$

Яндекс ИКС: 400

Сейчас я слушаю

---

- автообновление

Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2023
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.07 сек. / MySQL: 2 (0.0055 сек.) / Память: 4.5 Mb

	2023 - ОКТЯБРЬ
Пн	Вт	Ср	Чт	Пт	Сб	Вс
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28	29
30	31

Градиентный фон на PHP

Комментарии

Добавить комментарий