Форматирование виджета "Таблица"

Форматирование может применяться в следующих элементах виджета:

• Заголовки столбцов

  

• Ячейки данных

  

При форматировании шапки можно использовать следующие зарезервированные команды:

• @value - значение ячейки шапки;

При форматировании ячеек данных можно использовать следующие зарезервированные команды:

• @value - значение в ячейке таблицы;

• @row -массив значений строчки;

  • @row[0] - обращение к элементу массива через индекс столбца;

• @column - название столбца в таблице;

• @columnIndex - позиция столбца. Отсчет начинается с 0;

• @rowIndex - позиция строки. Отсчет начинается с 0.

Примеры форматирования

Добавление подписи к значению

Вы можете добавить любую надпись к значениям таблицы. Например, можно округлить большое числовое значение и добавить к нему фразу млн. руб. Для этого необходимо выполнить следующую команду:

Math.round(@value/100000) + ' млн. руб'

Где

Math.round(@value/100000) - округление числового значения и деление его на 100000;

+ ' млн. руб' - добавленный текст.

Изменение названия столбцов

Вы можете как полностью изменить название столбца, так и добавить текст к существующему значению. В нашем примере мы добавим слово руб. к фразам Стоимость реализации товара и Закупочная стоимость, а также заменим слово Город на Города России. Для этой цели мы введем следующую команду в поле Форматирование текста раздела Заголовки столбцов:

@value == 'Стоимость реализации товара' ? @value + " руб." : @value == 'Закупочная стоимость' ? @value + " руб." : @value == 'Город' ? @value = "Города России" : " "

Где
@value == 'Стоимость реализации товара', @value == 'Закупочная стоимость' – условие, при котором названием колонки является фраза Стоимость реализации товара / Закупочная стоимость;
@value + " руб." – текст (руб.), который должен добавиться к названию колонки при удовлетворении условия;
@value == 'Город' – условие, при котором названием колонки является фраза Город;
@value = "Города России" – замена текста, удовлетворяющего условию (Город) на фразу Города России.

Изменение значений в ячейках

При необходимости возможно заменить значения в ячейках таблицы. В нашем примере мы заменим буквы Ж и М на слова Женщины и Мужчины. Для этого мы введем следующую команду в поле Текст раздела Ячейки данных при включённом форматировании:

@value == "Ж" ? @value = "Женщины": @value == "М" ? @value = "Мужчины": @value

Где
@value == "Ж" – условие (для удовлетворения условия значение должно быть Ж);
@value = "Женщины" - замена текста, если условие удовлетворено.

Изменение цвета фона ячейки

Цвет фона ячеек можно изменить в зависимости от значения ячейки. Например, можно задать определенный цвет фона для различных категорий значений. В нашем примере мы зададим красный цвет для городов Самара и Барнаул, зеленый - для городов Нижнеудинск и Севастополь, и синий - для Москвы. Для этого мы введем следующую команду в поле Фон раздела Ячейки данных при включенном форматировании:

@value =='Самара' || @value == 'Барнаул' ? 'red': @value =='Москва' ? 'blue' : @value == 'Нижнеудинск' || @value == 'Севастополь' ? 'green':''

Где
@value =='Самара' || @value == 'Барнаул' – условие (значение должно быть либо Самара, либо Барнаул);
|| – логический оператор ИЛИ;
'red' - назначение цвета при удовлетворении условия;
@value =='Москва' – условие (значение должно быть Москва);
'blue' – назначение цвета при удовлетворении условия;
@value == 'Нижнеудинск' || @value == 'Севастополь' – условие (значение должно быть либо Нижнеудинск, либо Севастополь)
'green' – назначение цвета при удовлетворении условия.

Изменение цвета значений

Вы можете изменять цвет значений в ячейках таблицы в зависимости от различных условий. Например, можно одну категорию значений обозначить одним цветом, а другую - другим. В нашем примере мы сравним значения ячеек в двух столбцах, и если разница будет больше 100, выделим эти значения синим цветом, в противном случае - красным. Для этого мы введем следующую команду в поле Цвет текста раздела Ячейки данных:

@row[0] - @row[1] > 100 ? 'blue':'red'

Где
@row[0], @row[1] - обращение к элементу массива через индекс столбца;
@row[0] - @row[1] - получение разницы между значениями из столбцов с индексами 0 и 1;
> 100 ? 'blue' - выделение значений, между которыми разница больше 100, синим цветом;
:'red' – выделение всех остальных значений красным цветом.

Форматирование значений ячеек

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

@value=='Москва'?'<b>' + @value +'</b>':@value

Где
@value=='Москва' – искомое значение, которое нужно выделить жирным шрифтом;
<b>' + @value +'</b>' – выделение значения жирным шрифтом с помощью тэгов;
:@value – указывает на то, что все остальные значения остаются без изменения.

Изменение цвета значений столбцов и строк

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

Изменение цвета значений столбца

В поле Форматирование секции Ячейки данных введите следующую команду:

@columnIndex == 0? "rgba(250,0,0,1.0)":"rgba(0,0,0,1.0)"

Где

@columnIndex == 0 – индекс столбца, в котором необходимо произвести изменения. Так как отсчет ведется с нуля, первый столбец имеет индекс 0.

"rgba(250,0,0,1.0)":"rgba(0,0,0,1.0)" – цвет значений столбца (красный).

Изменение цвета значений строки

Аналогичным образом можно изменить цвет всех значений строки, используя соответствующую переменную. Для этого в поле Форматирование секции Ячейки данных необходимо ввести следующую команду:

@rowIndex == 2? "rgba(0, 0, 255,1.0)":"rgba(0,0,0,1.0)"

Где

@rowIndex == 2 – индекс строки, в которой необходимо произвести изменения (отсчет с 0).

"rgba(0, 0, 255,1.0)":"rgba(0,0,0,1.0)" – цвет значений столбца (синий).

Отображение номеров столбцов и строк

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

Отображение номеров столбцов

Для отображения номеров столбцов необходимо ввести следующую команду в поле Форматирование текста секции Заголовки столбцов:

@value + "\n" + @columnIndex

Где

@value – заголовок столбца.

"\n" – перенос строки.

@columnIndex – индекс столбца.

Отображение номеров строк

Для отображения номеров строк введите следующую команду в поле Форматирование секции Ячейки данных:

@columnIndex==0 ? @rowIndex+1: @value

Данная команда возвращает номера строк в колонке с указанным индексом (@columnIndex==0), начиная с 1:

Смотрите также

📄 Визуальные настройки виджетов