СКРИПТЫ alt phpjshtmlcssblog
Мы переходим на новый движок - возможны сбои в работе сайта! подробнее...
ТЕГИ:
php (263)
js (131)
html (129)
css (96)
html tags (59)
form html (29)
php array (28)
edit text (25)
foto (23)
fonts (22)
forum (19)
board (17)
hosting (17)
html book (17)
atom (17)
Показать еще :
js jquery (16)
svg (16)
js method (16)
ruweb.net (15)
php file (15)
color (14)
htaccess (13)
osclass (13)
table (12)
jquery (12)
path (12)
yandex (11)
online (11)
php date (11)
notepad (11)
input (11)
icon (11)
php img (10)
url (10)
info (10)
jsphp (8)
task (8)
form (8)
comment (7)
php url (7)
cookie (6)
ftp (6)
bbcode (6)
js url (6)
click (6)
search (5)
adminka (5)
reg.ru (5)
value (5)
js id (5)
js form (4)
js copy (4)
select (4)
captcha (3)
js time (3)
vs code (3)
vk (3)
seo (2)
ukoz (2)
tag hr (2)
js post (2)
header (1)
ssl (1)
books (1)
numbers (1)
smile (1)

От чего зависит расположение нанесенного текста на картинке с помощью php

Расположение текста нанесенного помощью php. Можно назвать - это позиционирование теста на картинке. Разберемся, как должно работать данное позиционирование и от чего зависит.
См. еще : как написать текст на картинке. Но позиционирование текста - это одна большая и самое главное "другая тема!"

Как позиционировать текст на картинке через php

  1. Определение размеров текста php.
  2. Позиция текста в левом верхнем углу php
  3. Позиция текста в правом верхнем углу php
  4. Позиция текста в правом нижнем углу php
  5. Позиция текста в левом нижнем углу php
  6. Устанавливаем текст ровно посередине картинки php
  7. Точность позиционирования текста на картинке через php

  1. Определение размеров текста php.

    Для того, чтобы начать позиционировать текст -нам нужно знать одну единственную вещь!

    Сколько пикселей по высоте и ширине занимает наш текст.

    И уже после этого мы сможем продолжить!

    Но как узнать физические размеры нашей будущей надписи - ведь все шрифты разные и текст на картинки всегда будет разной ширины и высоты!

    Что делать!?

    Нам нужно написать текст на картинке, о померить её физический размер линейкой! Да-да! Так вот олд-скульно!

    Запустил приведенный скрипт создания надписи php.

    Скачал данную картинку на комп.

    Открыл программу Paint

    Сверху актировал инструмент "выделить" - обводим нашу надпись.

    И внизу смотрим размеры нашей надписи в пикселях.

    К сожалению ровно не получилось - "104 х 23 пикселя", но это всего лишь цифры, у будет некий дискомфорт от некруглости чисел. wall

    Определение размеров текста php.
    Определение размеров текста php.


  2. Позиция текста в левом верхнем углу php

    Чтобы на какой-то картинке тренироваться возьмем вот такую, ширина и высота 400px, это будет вот такое по умолчанию:

    Позиция текста в левом верхнем углу php
    Позиция текста в левом верхнем углу php

    Позиция текста на картинке слева в верхнем углу :

    Мы опять возвращаемся к нашему скрипту и будем менять позицию нашего кода надписи на картинке.

    Меняем значение по горизонтали и по вертикали, это 17 и 18 строка нашего скрипта:

    Позиция текста на картинке слева в верхнем углу :
    Позиция текста на картинке слева в верхнем углу :

    На вот такие(как вы помните - высота нашего текста - 23 px) :

    $y = 23; // Смещение сверху (координата y)

    $x = 0; // Смещение слева (координата x)

    Перезагружаем и получаем результат:
    Позиция текста на картинке слева в верхнем углу :
    Позиция текста на картинке слева в верхнем углу :


  3. Позиция текста в правом верхнем углу php

    Как мы из первого пункта помним - наш текст имеет ширину 104 пикселя.

    А наша подопытная картинка, на которой и будем позиционировать текст - имеет ширину 400 пикселей.

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

    400 - 104 = 296.

    Сверху опять поступаем на высоту текста - 23, с слева = 296

    $y = 23; // Смещение сверху (координата y)

    $x = 296; // Смещение слева (координата x)

    Результат позиции текста спра в верхнем углу через php

    Результат позиции текста спра в верхнем углу через php
    Результат позиции текста спра в верхнем углу через php


  4. Позиция текста в правом нижнем углу php

    Для того, что бы поставить текст справа в в нижнем углу, нам нужно:

    Смещаем по вертикали на всю ширину картинки, т.е. на 400px.

    А смещенеи текста сслева оставляем также 296.

    И видим результат, что наш текст идет нижней частью по краю нашей картинки.

    Задаем параметры смещения текст ан картинке php:

    $y = 400; // Смещение сверху (координата y)

    $x = 296; // Смещение слева (координата x)

    Результат позиции текст справа в нижнем углу:

    Результат позиции текст справа в нижнем углу:
    Результат позиции текст справа в нижнем углу:


  5. Позиция текста в левом нижнем углу php

    Алгоритм смещения текст в php? надеюсь понятен.

    Теперь, если вы хотите сместить текст, вам нужно только изменить координаты текста :

    $y = 400; // Смещение сверху (координата y)

    $x = 0; // Смещение слева (координата x)

    Результат позиционирования текста слева в нижнем углу:

    Результат позиционирования текста слева в нижнем углу:
    Результат позиционирования текста слева в нижнем углу:


  6. Устанавливаем текст ровно посередине картинки php

    Следующая интересная задачка- нам нужно установить текст ровно посередине и по горизонтали и по вертикали!

    Теперь расположим наш текст ровно посередине.

    Позиционируем по высоте:

    Нам нужно высоту нашей картинки разделить на 2

    И прибавить половину высоты нашего текста:

    $y = 400/2 + 23/2;

    Позиционируем текст по ширине:

    Нам нужно высоту нашей картинки разделит на 2

    И отнять половину высоты нашего текста:

    $y = 400/2 - 104/2;

    Итого:

    $y = 400/2 + 23/2; // Смещение сверху (координата y)

    $x = 400/2 - 104/2; // Смещение слева (координата x)

    Результат позиции текста посередине через php :

    Результат позиции текста посередине через php :
    Результат позиции текста посередине через php :


  7. Точность позиционирования текста на картинке через php

    Нам только и всего-то осталось проверить точность позиционирования текста посередине и по вертикали и по горизонтали!

    Скачаем картинку на компьютер, нажимаем ПКМ

    Откроем картинку в уже выше озвученной программе.

    И видим, что слева и справа от надписи некоторое несоответствие в ширине:

    149

    147

    Эту картинку, скриншот, можно увеличить в отдельном окне нажмите по нему!
    Точность позиционирования текста на картинке через php
    Точность позиционирования текста на картинке через php

    По вертикали проверку показывать не буду - там разница в 1 пиксель! Можете проделать точно такие же действия самостоятельно!

    Вывод :

    Данные погрешности, вне зависимости от того откуда он появились можно проигнорировать, как несущественные!

Пользуйтесь на здоровье! Не забудьте сказать спасибо

Сообщение системы комментирования :

01.09.2021

Форма пока доступна только админу... скоро все заработает...надеюсь...

Последние комментарии :
Марат :
17.09.2021 28:02
Установка Яндекс поиск на сайт! Контент обновлен на 100%. Такое ощущение, что старый текст не я…
подробнее.
Марат :
07.09.2021 23:21
Частенько приходится исправлять ошибки и вот...как-то я обратил внимание на надпись: "нажми ctrl enter" на сайте и…
подробнее.
Марат :
23/07/2021 10:58
Сам офигеваю...
подробнее.
александр анатольевич таширев :
21/07/2021 02:47
прикольно
подробнее.
Марат :
17/07/2021 04:14
Рад, что помог! Приходите ещё!
подробнее.
Slomal Plintus :
16/07/2021 06:41
спасибо за ответ, очень помогло!
подробнее.