Как узнать ширину строки в пикселях

Обновлено: 04.07.2024

Разумно. Хм, тогда стоит немного переделать метод, или дописать например еще один, в котором будет указываться в качестве одного из аргументов JComponent на котором будет выводиться текст.

к примеру я собираюсь выводить текст на JTextArea, данный объект уже существует и я могу запросить у него Graphics (да даже если и не существует можно просто сделать new JTextArea().getGraphics()

В общем вот я пока шло время немного дописал.

Я верно понял? :upset:

Учитывая, что мне никогда не было нужды вычислять длину текста, я полагаю, что ты неправильно решаешь свою задачу (ту, для которой тебе нужно знать размер текста).

Мдя :oops: такая же мысль посещала и меня.

Посему я решил описать то, что я вообще хочу достичь, а то уж больно сильное ощущение что решаю задачу через .
К тому же ширина текста все же вычисляется с погрешностью (в частности для инглишь букв почему-то, русские буквы считаются точно).

Итак, имеется текстовый компонент (я выбрал JTextArea, поскольку он умеет переносить строку) установленной ширины (неизменной), а высота должна меняться в зависимости от введенного текста. Так вот, как определить какой должна быть высота компонента . То есть сам компонент конечно может сказать PrefferedSize, но ведь только для обоих направлений, а я ширину фиксирую, таким образом это уже не прокатит.

В общем я нашел только то решение, что обсуждалось выше. Просто брал текст, который будет устанавливаться в компонент, вычислял длину каждой строки текста и если длина строки превышала ширину компонента, то увеличивал счетчик строк на результат от деления (длинная строка с учетом переноса может занимать как 2, 3, 4 и так далее строк фактически, но компонент переносы за отдельные строки не считает). Затем умножал полученное фактическое количество строк (уже с учетом переноса) на высоту каждой строки и получал искомую высоту. Метод, что совершенно очевидно - дурацкий, но другого не придумал, а задачу нужно решить.

Я хотел бы использовать JavaScript для вычисления ширины строки. Возможно ли это без использования моноширинного шрифта?

Если это не встроенный, моя единственная идея-создать таблицу Ширин для каждого символа, но это довольно неразумно, особенно поддерживая Unicode и разные размеры типов (и все браузеры, если на то пошло).

создать DIV стиле со следующими стилями. В вашем JavaScript установите размер шрифта и атрибуты, которые вы пытаетесь измерить, поместите свою строку в DIV, а затем прочитайте текущую ширину и высоту DIV. Он будет растягиваться, чтобы соответствовать содержимому,и размер будет в пределах нескольких пикселей от размера строки.

  • более лаконичный и безопасный, чем другие (DOM-based) методы, потому что он не изменяет глобальное состояние, такое как ваш DOM.
  • дальнейшая настройка возможна путем изменение дополнительных свойств текста холста, например textAlign и textBaseline .

вот один я взбил вместе без примера. Похоже, мы все на одной странице.

используя его просто: "a string".width()

**добавил white-space: nowrap таким образом, строки с шириной больше ширины окна могут быть вычислены.

вы можете использовать холст, так что вам не придется иметь дело так много с CSS свойствами:

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

Мне нравится ваша "единственная идея" просто делать статическую карту ширины символов! Это действительно хорошо работает для моих целей. Иногда, по соображениям производительности или потому, что у вас нет легкого доступа к DOM, вам может просто понадобиться быстрый хакерский автономный калькулятор, откалиброванный до одного шрифта. Итак, вот один калиброванный для Helvetica; передайте строку и (необязательно) размер шрифта:

этот гигантский уродливый массив-это ширина символов ASCII, индексированная символьным кодом. Так что это просто поддерживает ASCII (в противном случае он принимает среднюю ширину символа). К счастью, ширина в основном линейно масштабируется с размером шрифта, поэтому он работает довольно хорошо при любом размере шрифта. Ему явно не хватает какого-либо понимания Кернинга или лигатур или чего-то еще.

для "калибровки" я просто визуализировал каждый символ до charCode 126 (The mighty tilde) на svg и получил ограничивающую рамку и сохранил ее в этом массиве;больше кода и объяснения и демо здесь.

код-обрезает ниже, "вычисляет" ширину span-тега, добавляет". "к нему, если он слишком длинный и уменьшает длину текста, пока он не поместится в своем родителе (или пока он не попробовал более тысячи раз)

CSS

HTML

JavaScript (с jQuery)

Вопросы касаются дисплея от "Nokia" (1.44 128x128). Используется библиотека "SPI.h", "Adafruit_GFX.h" и "TFT_ILI9163C.h".

Первый вопрос: как узнать высоту и ширину строки в пикселях, которая отрисовывается на дисплее? (Нужно, чтобы отрисовать строку ровно по середине. А не подбирать вручную)

Второй вопрос: есть функция "setTextSize", которая может принимать 3 значения (1,2 и 3). Значение 1 для меня слишком маленькое, а 2 - слишком большое. Можно ли как-то изменить размер внутри библиотеки?

  • Войдите или зарегистрируйтесь, чтобы получить возможность отправлять комментарии

ЕвгенийП аватар

Первый вопрос: как узнать высоту и ширину строки в пикселях, которая отрисовывается на дисплее? (Нужно, чтобы отрисовать строку ровно по середине. А не подбирать вручную)

Высоту - посмотреть высоту шрифта в библиотеке. Ширину - сложить вместе ширину всех напечатанных символов.

Второй вопрос: есть функция "setTextSize", которая может принимать 3 значения (1,2 и 3). Значение 1 для меня слишком маленькое, а 2 - слишком большое. Можно ли как-то изменить размер внутри библиотеки?

Можно добавить свой шрифт или залезть в библиотеку и поменятьсуществующий.

  • Войдите или зарегистрируйтесь, чтобы получить возможность отправлять комментарии

Покопался в исходниках и нашел ответ на первый вопрос:

Чтобы найти высоту и ширину дисплея, надо использовать функции "height()" и "width()" соответственно.

Для определения высоты и ширины строки существует функция "getTextBounds( char*, int16_t, int16_t, int16_t*, int16_t*, uint16_t*, uint16_t* )" (более красивый вид " getTextBounds ( string , x , y , & x1 , & y1 , & w , & h ) "), где

первый аргумент - строка.

второй - координата x, откуда рисуется строка.

третий - координата y, откуда рисуется строка.

четвертый - в него будет записана координата x1, то есть где заканчивается строка по x.

третий - в него будет записана координата y1, то есть где заканчивается строка по y.

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

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

Получается, чтобы нарисовать строку посередине (по x), нужно вычислить "(width()-w)/2".

Проблемы, которые были замечаны:

1) Функция "getTextBounds" не возвращает x1 и y1 (точнее возвращает "0").

2) В старых версиях библиотеки "Adafruit_GFX.h" функция "getTextBounds" постоянно возвращает значение w и h (ширины и длины) равное"65565". В последней версии на текущую дату, ширина и длина возвращаются корректно, кроме случая, когда строка состоит из русских букв. В этом случае надо поделить w и h на 2. (почему так происходит - не знаю. Найдено экспериментально).

3) Если засунуть строку (то есть переменную типа "String" или просто написать, допустим, "Hello World") в первый аргумент функции "getTextBounds", то появится предупреждение, так как первый аргумент - это "char*", а не "String". На работу это никак не повлияет, но кого-то может смутить, поэтому можно использовать функцию, которая будет преобразовывать "String" в "char*" (функция "string2char" в примере ниже).


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

Итак, для того, чтобы узнать размер строки будем пользоваться функцией TextWidth() объекта TCanvas.

Например, нужно узнать ширину строки "Добрый день!". В обработчике события клика по кнопке пишем:

Тут все просто. Функция TextWidth возвращает тот самый размер который нам нужен. После того, как получили размер, просто выводим его значение с помощью ShowMessage(), чтобы поглядеть, что же мы получили.

А как узнать ширину строки жирного начертания? Ведь такая строка будет занимать больший размер! Да тут все просто. Ведь функция TextWidth() это метод объекта TCanvas. А у TCanvas можно установить любые параметры шрифта. Например:

Просто нужно установить нужный стиль шрифта перед вычислением.

Также хочу заметить, в примерах я использовал канву формы.

Помимо функции TextWidth() для вычисления ширины, существует функция TextHeight() для вычисления высоты.

Обсудить на форуме

Мое решение, которое оценивает весь символ шириной 8 пикселей, приведен ниже:

Любая идея или решение высоко ценятся.

Чтобы получить более точное измерение, вы можете заполнить TextField строкой, а затем измерить ширину текста TextField.

У меня нет прав на публикацию других людей, поэтому я отправляю это как отдельный ответ, но кредит должен идти в Cameron, если это работает:

Если я увижу, что это так, и он отредактирован, я удалю его для чистоты.

Извините за пост мусора, изначально пытался ответить на вопрос, просто сделал это ошибочно. так или иначе проверил этот, и он, похоже, работает. Я сделал это в Flex, но вы должны просто использовать AS3-часть без проблем, я просто завернул текстовое поле в UIComponent, чтобы получить его на сцене, но использование autosize, похоже, отлично работает:

Можно с помощью JS через canvas или другим способом узнать длину строки по заданному шрифту и его величине в миллиметрах? Через метод measureText() можно получить длину в пикселях.


4 ответа 4



"Стандартного размера пикселя" не существует! Все зависит от разрешающих возможностей устройства вывода. Загляните в вики, прочтите про DPI. Далее формула пересчета станет очевидной:

  • знаем DPI (сколько пикселей устройство вывода укладывает в дюйм)
  • знаем сколько пикселей приходится на строку
  • осталось перевести дюймы в миллиметры


Всё ещё ищете ответ? Посмотрите другие вопросы с метками javascript canvas шрифты или задайте свой вопрос.

Похожие

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

дизайн сайта / логотип © 2019 Stack Exchange Inc; пользовательское содержимое попадает под действие лицензии cc by-sa 4.0 с указанием ссылки на источник. rev 2019.11.15.35459

Читайте также: