Высота заголовка DataGrid

Коллеги, добрый день!
Возникла необходимость сделать заголовки DataGrid многострочными. То есть, чтобы текст в заголовке столбца переносился по словами, и высота строки заголовка соответственно изменялась.

К строке заголовка и ячейке заголовка можно применить стиль:

import com.haulmont.cuba.gui.components.DataGrid.HeaderRow;

HeaderRow defaultHeaderRow = meetingsDataGrid.getDefaultHeaderRow();
defaultHeaderRow.setStyleName("text-wrapping-by-words-header");
defaultHeaderRow.getCell("country").setStyleName("text-wrapping-by-words-header");

Однако, подходящего стиля не нашел: и перенос текста и изменение высоты не срабатывают.

  .text-wrapping-by-words-header{
    word-break:normal;
    white-space: normal;
    font-weight: bold;
    text-align: center;
    height: 80px;
  }

Помогите, пожалуйста, найти решение…

Добрый день.

  1. Авто-высоты любых строк в DataGrid (header, body, footer) нет. Это особенность работы данного компонента и багой не является.
    Если вам надо задать высоту строк, то можно воспользоваться следующими атрибутами: headerRowHeight, bodyRowHeight, footerRowHeight.
  2. Проблему с переносом воспроизвести не смог. Приложенные вами стили работают и слова переносятся.

Глеб

Здравствуйте!
Задача в целом решена. Однако остаются 2 мелких недостатка:

  1. межстрочный интервал (line-height) упорно не хочет устанавливаться в 1, - отображается полуторным интервалом.
  2. текст вылезает за границы ячейки строки заголовка, если не умещается в ячейке (при уменьшении ширины колонки)…
    screen%20%D1%82
    Перепробовали массу вариантов, текущие стили такие:
  .text-wrapping-by-words-header{
    word-break: normal;
    white-space: normal;
    font-weight: bold !important;
    text-align: center !important;
    vertical-align: top !important;
    line-height: 20% !important;
  }

Буду благодарен за подсказку…

Добрый день.

Приложите пожалуйста демо проект, в котором проблема воспроизводится.

Глеб

Интересно, но в созданном демо проекте воспроизвелась только проблемка №1 (но решить хотя бы её)… Вылезание текста за границы ячейки в чистом проекте не наблюдается… (а жаль)
Архив прилагаю.
demoProject.zip (79.1 КБ)

Спасибо за проект. Касательно первой проблемы, Вам подойдет следующий селектор:

.text-wrapping-by-words-header .v-grid-column-header-content {
  line-height: inherit;
}

Глеб

1 симпатия

Глеб, спасибо огромное! Решили.

Правда эффект с “выползанием” текста за нижнюю границу ячейки строки заголовка (при уменьшении ширины колонки) остался, но так и не смог его воспроизвести в демо-проекте… Видимо, какой-то наведенный баг…

image
Воспроизвел проблему. Использовал только стили указанные автором + селектор. Автоизменение высоты так и не завезли?

Добрый день.

Автовысота строк в DataGrid не возможна, т.к. существуют методы для программного задания высоты.

Глеб