JavaFX изменить иконки для TreeView

JavaFX изменить иконки для TreeView. Простой пример как это сделать быстро. Приведено 2-а примера. 

Всем добрый день.

И так начнем. Суть проблемы в следующем. В JavaFX есть компонент TreeView и по умолчанию там иконки для элементов списка. Эти иконки 2-е стрелки: одна для закрытого елемента и одна для открытого елемента. Пример приведен на картинке:

Но очень часто хотчется изменить эти стандартные иконки на свои как на картнке(мне нужно было заменить на + и -):

При этом имея возможность втасвить какие угодно. Вроде ничего сложного. После пару минут поиска в нете Вам предложат следующее решение. Нужно просто изменть css фаил Вашего проэкта на следущее:

.tree-cell .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-background-image: url("plus-arrow.png");
}
.tree-cell:expanded .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-background-image: url("minus-arrow.png");
}

Все вроде хорошо, но первое нужно подключить этот файл к проэкту. Это сделать можно легко в главной файле Вашей программе с помощью слдеующих строк кода

Parent root = FXMLLoader.load(getClass().getResource("Forms/MainForm.fxml"));
primaryStage.setScene(new Scene(root, 700, 600));
primaryStage.getScene().getStylesheets().add(getClass().getResource("css/style.css").toExternalForm());

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

После всего прочитаного я сделал все как написано. И что же, в результате у меня старые пропаои иконки а новые не появились. Первая мысля что не стили не подтянулись. Добавил правило на изменение цвета текста для некоторых компонентов и чудо - стиль поменялся, тоесть проблема не в файле со стилями. Реши что проблема в том что не могут подтянуться сами картинки. У меня в проэкте была папка с ресурсами "resources" решил тянуть картинки оттуда. Получаем такой файл:

.tree-cell .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-background-image: url("file:resources/plus-arrow.png");
}
.tree-cell:expanded .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-background-image: url("file:resources/minus-arrow.png");
}

И наконец то получил новые иконки. Но возникла проблема с их располождением. Икона + как то искажалась и налазила на текст елемента. После пару минут эксперементов помогло следующее изменение css

.tree-cell .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-background-size:cover; 
    -fx-padding: 5px;

    -fx-background-image: url("file:resources/plus-arrow.png");
}
.tree-cell:expanded .tree-disclosure-node .arrow {
    -fx-shape: null;
    -fx-background-color: null;
    -fx-padding: 5px;

    -fx-background-image: url("file:resources/minus-arrow.png");
}

И это пример финального файла со стилямы который мне был и нужнен. 

Ну вот и все. Была проблема и она решена. Надеюсь кому то это пригодится и спасет Ваше время от ненужного поиска.

comments powered by Disqus

Интересное

Стив Джобс о Mac OS X:
«Я убежден в том, что половина того что отделяет успешных предпринимателей от неудачников — это настойчивость.».
Марк Эллиот Цукерберг:
«Люди всегда немного скептически относятся к чему-то быстрорастущему, но им нужно просто взглянуть на то, что делается.».
Марк Эллиот Цукерберг:
"Множество конфиденциальных вещей намного проще держать в централизованной системе."
Стив Джобс о операционной системе Google Android:
Мы не лезем в поиск, но они решили заняться телефонами. Не надо заблуждаться, они хотят уничтожить iPhone. Мы им не позволим.
Стив Джобс о Mac OS X:
«Мы сделали значки на экране такими красивыми, что вам захочется их лизнуть».


Курсы валют

bank-ua.com bank-ua.com bank-ua.com

Стоит взглянуть