JavaFX ListView - удалить интервал/заполнение/поле между ячейками

Поскольку у меня есть пользовательские ячейки для конкретного ListView, мне очень сложно понять, как удалить "естественный" вид полей/отступов между ячейками и, что еще хуже, справа и левые стороны указанных ячеек.

Вот пример:

изображение для демонстрации расстояния между ячейками]1

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

Каждая ячейка состоит из одной AnchorPane с изображением и одной меткой. AnchorPane окрашен в желтый цвет (-fx-background-color: yellow;).

И, как вы можете ясно видеть, вокруг ячеек есть эти белые пятна.

К вашему сведению, здесь я использую JavaFX 8/2.2 SDK, но я намерен использовать JFoenix а> JFXListView и JFXListCell. Тем не менее, интервал еще хуже, используя их.

Странный момент: я тоже покрасил ListView в зеленый цвет, но такого цвета нигде нет. чтобы увидеть. Я предполагаю, что все ячейки (и пустая) перезаписывают содержимое ListView, поэтому имеет смысл не видеть его фон. Однако это означает, что ячейки каким-то образом «испорчены», поскольку вокруг моих ячеек «добавлены» пробелы.

Я пытался установить отступы на 0 для всего, но тщетно.

Наконец, в методе onUpdateItem я вызываю суперметод, и когда ячейка не помечена как пустая, я устанавливаю графику в вышеупомянутую AnchorPane, в противном случае я устанавливаю ее в null, что явно соответствует моему скриншоту.

Спасибо за помощь !


java listview css javafx javafx-2
person Mackovich    schedule 25.08.2018    source источник

Ответы (2)


arrow_upward
8
arrow_downward

Если вы посмотрите на таблицу стилей CSS по умолчанию для JavaFX, modena.css, вы увидите:

.list-cell {
    -fx-padding: 0.25em 0.583em 0.25em 0.583em; /* 3 7 3 7 */
}

Вот откуда берется заполнение для ListCells. Чтобы удалить это дополнение, просто добавьте свою собственную таблицу стилей, которая содержит:

.list-cell {
    -fx-padding: 0px;
}

Или позвоните setStyle для каждого из ваших ListCell:

setStyle("-fx-padding: 0px;");

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

listView.setCellFactory(v -> new ListCell<>() {

    {
        setStyle("-fx-padding: 0px");
    }

    @Override
    protected void updateItem(Object item, boolean empty) {
        super.updateItem(item, empty);
        if (empty || item == null) {
            setText(null);
            setGraphic(null);
        } else {
            // your custom display logic
        }
    }

});

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

person Slaw    schedule 25.08.2018
comment
Я хочу знать, что такое история скинов JavaFx. Я знаю, что это не связано с вопросом. - person Ahmed Emad; 26.08.2018
comment
Вы, сэр, примите мою благодарность. Я добавил setStyle("-fx-padding: 0px;"); в конструктор моего пользовательского ListCell и, используя обычный ListView, добился цели. Далее: JFXListView и JFXListCell. Это не работает. Потому что, как вы сказали, onUpdateitem делает довольно много. Среди них явная ошибка, когда setText(item.toString()) вызывается, если элемент не является Node. Который отображает имя экземпляра и класса сразу после моего graphic. Кроме того, это также переопределяет стиль. Поэтому я должен вызывать setStyle("-fx-padding: 0px;"); после суперметода, а также setText(null). Я отмечу ваш ответ ;-) - person Mackovich; 26.08.2018
comment
@AhmedEmad прочитайте базовое руководство - см. f.i. информационная вкладка тега javafx :) - person kleopatra; 26.08.2018
comment
Я некоторое время работаю с javafx, просто я не большой поклонник CSS, хотя я могу создавать свои собственные файлы CSS и назначать их любому компоненту, который захочу, но затем я хочу выбрать определенный класс, например (прокрутка полоса со стрелкой и большим пальцем) я продолжал искать везде, пока не нашел что-то, а не в документации - person Ahmed Emad; 26.08.2018
comment
@AhmedEmad Вы видели JavaFX CSS? Справочное руководство? Он дает достойную документацию о том, как стилизовать стандартные макеты/элементы управления/диаграммы. Сюда входит стилизация компонентов полосы прокрутки. - person Slaw; 26.08.2018
comment
Я видел его до того, как он немного уродлив, и я не понимаю, как использовать некоторые селекторы, например, если мы говорим о компоненте полосы прокрутки, я не могу сказать, как выбрать большой палец или какие варианты существуют для меня - person Ahmed Emad; 27.08.2018

arrow_upward
-1
arrow_downward

Я установил красный фон ячейки по умолчанию, чтобы убедиться, что артефакты, которые я вижу между ячейками, на самом деле созданы .list-cell.

Как я ни старался, я не мог избавиться от него, даже с отступом 0px. В моем случае красный фон все еще был виден в каждой второй ячейке.

Я полагаю, это ошибка округления...

Итак, единственное, что сработало, это использование отрицательного заполнения для удаления любого интервала | обивка | отступ между ячейками.

.list-cell{
    -fx-font-weight: normal;
    -fx-text-fill: white;
    -fx-padding: -1px;
    -fx-background-color: red;
}
person Eugene Kartoyev    schedule 28.10.2020