Используя HTMLEditorKit в Java, теги ‹img› игнорируют мои стили CSS (но текст прекрасно принимает стили)

Итак, я работаю над «окном чата» на Java, созданным с помощью HTMLEditorKit. Общий подход заключается в том, что я сначала создаю таблицу стилей, используя StyleSheet.addRule(). Таблица стилей, которую я создаю:

body  {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
p     {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
.msg  {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
.csa  {color:#ff0000; font-family:SansSerif; font-size:12pt;}
.usa  {color:#0000ff; font-family:SansSerif; font-size:12pt;}
.icon {width:16px; height:16px; object-position:0 5px; }

Затем, когда у меня есть строка чата, которую я хочу применить, я помещаю ее в div и добавляю в JTextPane:

try {       
  kit.insertHTML(doc, doc.getLength(), "\n<div class="+style+">" + s + "</div>", 0, 0, null);                   
} catch (BadLocationException ble) {
  ErrorDialog.bug(ble);           
} catch (IOException ex) {
  ErrorDialog.bug(ex);            
}
conversation.update(conversation.getGraphics()); //Force update of graphics

Пока все работает нормально! Далее возникает проблема с возможностью добавления в текст небольших изображений.

Добавление самих изображений тоже проходит нормально, пока я придерживаюсь атрибутов html, например:

<img src="dice.png" width="16" height="16">

НО, как только я пытаюсь сделать ЛЮБУЮ из следующих двух вещей, он ИГНОРИРУЕТ все мои стили:

<img src="dice.png" class="icon">

<img src="dice.png" style="{width:16px; height:16px; object-position:0 5px; }">

Я пробовал всевозможные обходные пути, включая теги span, я пробовал стили id (например, #icon и id="icon"), отдельные элементы div и т. д. Никакой радости!

Это дополнение к некоторому устаревшему программному обеспечению, работающему под довольно старой версией Java (1.8), поэтому я всегда «ожидаю худшего», но, как я уже сказал, все другое Элементы стиля CSS (в том, что касается текста и макета) работают отлично. Ищу какие-либо подсказки по устранению неполадок, ИЛИ есть ли какие-то особые ограничения HTMLEditorKit с изображениями (но опять же, все мои изображения отлично работают, пока я придерживаюсь атрибутов html вместо CSS, и все же все мои CSS отлично работают с текстом). Большое спасибо за любую помощь.


java html css swing htmleditorkit
person Brian    schedule 20.04.2020    source источник
comment
Добавление самих изображений тоже проходит нормально, так что это означает ваш последний вопрос: stackoverflow.com/questions/61310850/, был дан ответ. Поэтому вы должны принять ответ, нажав на галочку, чтобы люди знали, что исходная проблема была решена.   -  person camickr    schedule 20.04.2020
comment
Основной ответ заключается в том, что поддерживается только подмножество HTML3.2. Не знаю, поддерживается ли то, что вы хотите сделать, или нет. Я бы предложил вам использовать JTextPane и использовать текстовые атрибуты и атрибуты абзаца для стилизации вашего текста. Пример приведен в ссылке на ваш последний вопрос.   -  person camickr    schedule 20.04.2020
comment
Что касается более раннего вопроса - ответ, который там был, на самом деле не помог, или, скорее, он был полезен, но не привел меня к решению моей реальной проблемы. В конце концов я нашел полуответ в другом месте (необходимый для создания явного URL-адреса, например, с помощью ClassLoader или тому подобного), и мне удалось его запустить. Я собирался подождать несколько дней и посмотреть, не предоставил ли кто-нибудь ответ в такой форме, чтобы я мог принять его, иначе добавлю ответ сам. Я очень ценю, что вы заглянули и попытались помочь.   -  person Brian    schedule 20.04.2020
comment
1) подобные комментарии должны быть добавлены к исходному вопросу, чтобы люди знали, что вы действительно читали предложение, иначе какая будет стимулирующая помощь в будущем. 2) Демонстрационный код из учебника работает без какого-либо специального кода или загрузчика классов. 3) если вы используете другое решение, не стесняйтесь опубликовать свой собственный ответ. 4) Опубликуйте минимально воспроизводимый пример с вашим вопросом, демонстрирующим проблему, чтобы люди могли точно видеть, что вы делаете.   -  person camickr    schedule 20.04.2020
comment
Спасибо отмечу что там. Что касается этого вопроса, у меня есть серьезные стимулы запустить его в HTMLEditorKit, в частности, для использования html. Поэтому я надеюсь либо на конкретное знание ограничений HTMLEditorKit (например, если бы кто-то знал, что он не может и не должен использовать CSS для изображений), либо, что лучше всего, на кого-то, кто мог бы заметить или предложить что-то, что я сделал неправильно, чтобы получить стиль изображения идущий. Я сделал кучу поисков и не смог найти никого с ЭТОЙ проблемой, что заставило меня подумать, что, возможно, я упускаю одну вещь.   -  person Brian    schedule 20.04.2020
comment
или, что лучше всего, кто-то, кто мог бы заметить или предложить что-то, что я сделал неправильно - опять же, поэтому минимально воспроизводимый пример должен быть размещен вместе с вашим вопросом, чтобы другие (не я, потому что я не знаю HTML) могли точно видеть, что вы делаете. Помните, что в последнем вопросе у вас была опечатка. Ну, у вас может быть такая же проблема здесь. Вы включаете только тот код, который считаете важным, но у вас может быть код в другом месте, который вызывает проблему. Мы можем решить проблему только тогда, когда у нас есть весь контекст кода.   -  person camickr    schedule 20.04.2020
comment
К сожалению, это МНОГО кода. И я не уверен, что у меня достаточно знаний, чтобы запустить урезанную вещь. Если есть определенные аспекты, например. инициализации, которые уместны, то я, безусловно, мог бы предоставить. Просто делаю все возможное здесь.   -  person Brian    schedule 20.04.2020

Ответы (1)


arrow_upward
1
arrow_downward

попробуйте установить изображение на display: block или display:inline-block. inline-block может не поддерживаться. если изображение display: inline, то свойства высоты и ширины не повлияют на изображение. Также рекомендуется установить только ширину, чтобы сохранить соотношение сторон.

.icon1 {
  width: 100px;
  height: 100px;
  display: block;
}

.icon2 {
  width: 110px;
  height: 110px;
  display: inline-block;
}

.icon3 {
  width: 120px;
  display: block;
}


/* extra styles for example */

img {
  margin: 4px;
}
<div class="wrap">
  <!-- div not required, just to wrap image in this example -->
  <img src="https://placekitten.com/130/130" class="icon1">
  <img src="https://placekitten.com/128/128" class="icon2">
  <img src="https://placekitten.com/132/132" class="icon3">
</div>

Редактировать:

Использование div с фоновым изображением, установленным с помощью background-image: url(path/to/image/file), может работать, если вы установите высоту и ширину div.

person Allan J.    schedule 20.04.2020
comment
Увы, без радости. Пробовал создавать ваши точные стили, также пытался поставить, например. дисплей:блок; в атрибуте style=... для тега img. По какой-то причине я не могу заставить окно принимать стили изображения - оно прекрасно принимает все элементы стиля/класса/и т. д. для текстовых элементов. И он прекрасно принимает такие атрибуты, как width=16, для изображений. Хорошее замечание по соотношению сторон - мои исходные изображения в этом случае были квадратами, но я действительно должен просто установить высоту (что является важным ограничением для меня) и позволить ширине автоматически соответствовать. - person Brian; 20.04.2020
comment
И просто для ясности: если я поместил все это в браузер, он, что неудивительно, отлично работает — он просто не использует стили img в этом окне Java HTMLEditorKit, и я не могу понять, почему . - person Brian; 20.04.2020
comment
Также поддерживает только html 3.2, поэтому поддержка css не самая лучшая. stackoverflow.com/a/25147343/9680087 - person Allan J.; 28.04.2020