Меню

Treeview как изменить цвет узла



Treeview как изменить цвет узла

Привожу кусок текста, заранее знаю, что он неправилен, т.к. работаю в нем с выдел. итемом. Как обратиться к итему по его номеру?

procedure TForm3.TreeView1CustomDrawItem(Sender: TCustomTreeView;
Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean);
begin
with TreeView1.Canvas do
if cdsSelected in State then Brush.Color:= clRed;
end

;D
Интересный вопрос. Вы пишите что изменяет цвет только если selected и сами же это пишите:

IF cdsSelected in State then. — это условие и говорит, что окрасить ветку, только если она выделена.

Напишите в обработчике: Sender.Canvas.Font.Color:=clRed;

Вообще, Вы сказали цвет, цвет символов или цвет фона. В Вашем коде — цвет фона, в моём — цвет символов. Я так и не понял какой цвет Вы хотите.

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

IF Node.Text[1]=’1′ then Sender.Canvas.Font.Color:=ClBlue;

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

Источник

Как установить цвет фона узла TreeView?

Мы добавляем корневые узлы в элемент управления TreeView как TreeView ниже. Но как установить цвет фона этого корневого узла. Также установите bg-color для любого выбранного в данный момент элемента? (Я думаю, каждый узел является TreeViewItem , но я не могу получить его из узлов)

В TreeView каждый TreeViewNode является TreeViewItem и они используют один и тот же TreeViewItemStyle . Он не предоставляет метод получения TreeViewItem из узла. Но вы можете изменить его стиль, чтобы он выглядел иначе.

Вы можете получить стиль TreeView по умолчанию, выполнив следующие шаги:

На странице TreeView перейдите на вкладку » Структура документа «, в окне » Структура документа» вы можете найти TreeView, затем вы можете создать стиль по умолчанию для treeView как следующее изображение,

Затем нажмите «ОК», чтобы создать стиль копирования, после чего вы увидите стиль на Page.Resources . Вы можете изменить стиль в resouce, чтобы изменить стиль Nodes и выбрать фон Node.

Вот стиль по умолчанию TreeView,

В этом стиле вы можете видеть, что TreeViewList ItemContainerStyle использует TreeViewItemStyle а его ItemTemplate использует TreeViewItemDataTemplate , вы также можете найти их на этом ресурсе страницы, который генерируется на наших предыдущих шагах.

Чтобы изменить backgroud узлов, вы можете изменить TreeViewItemDataTemplate как следующий код, установив Grid Background на красный,

Чтобы установить bg-color для любого выбранного в данный момент элемента, вы можете изменить выбранный TreeViewItemStyle VisualState,

Кроме того, вы можете также изменить фон узла в строке, изменив фон ContentPresenterGrid .

Источник

Treeview как изменить цвет узла

Надо поменять стандартный (синий) цвет вибраного узла дерева на красный. Как этого добиться?
Чтобы узел который находиться в фокусе виделялся не синим а красным цветом.

От: Аноним
Дата: 12.06.05 21:15
Оценка:
От: Аноним
Дата: 13.06.05 06:08
Оценка:

А попроще нельзя?

От: mihailik
Дата: 13.06.05 15:31
Оценка:

> А попроще нельзя?

Можно, но в Visual Studio 2005. Заказывай, получай по почте и используй
— пока денег не берут.

Источник

изменить цвет узла treeview

Есть ли какой-либо способ изменить цвет узлов в TTreeView. Я хочу покрасить свой treeview в темный цвет, а затем я не могу видеть узлы.

2 ответа

Я хочу изменить выбранный по умолчанию и цвет наведения для узла treeview в пользовательском интерфейсе kendo на основе данных json. поэтому я добавил шаблон, как показано ниже, он не работает, любая помощь? template:

Не так легко понять, что вы просто хотели изменить цвет линии. Во всяком случае, для этого есть сообщение в API;

возможно, вы можете использовать событие OnCustomDrawItem из TTreeView:

Похожие вопросы:

При использовании форм Windows , когда я щелкаю на узле TreeView, цвет подсветки-синий. Есть ли способ изменить это?

Для отображения подсказок в treeview я установил ToolTipText для каждого узла и ShowNodeToolTip=True . Хорошо, это просто. Мой вопрос теперь, как я могу настроить внешний вид всплывающих подсказок.

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

Я хочу изменить выбранный по умолчанию и цвет наведения для узла treeview в пользовательском интерфейсе kendo на основе данных json. поэтому я добавил шаблон, как показано ниже, он не работает.

Я использую ниже, чтобы найти узел с именем Archive, а затем изменить его цвет на красный и индекс изображения. Dim d As String = Archive For i = 0 To tvProgress.Nodes.Count — 1 If.

Это кажется чем-то безумно простым, я новичок с JavaFX, и я не могу изменить цвет фона и текста JavaFX TreeView (добавлено внутри GridPane). Я инициализирован конструктором treeview с корневого узла.

Читайте также:  Как самостоятельно выбрать цвет волос

Я ищу способ отключения правильных узлов . Допустим, я создал простую структуру treeview , как показано ниже: Родитель 1 (отключить ) Родитель 2 Ребенок 1 Ребенок 2 (отключить ) До сих пор я нашел.

Я хочу изменить цвет фона узлов в элементе управления TreeView, чтобы, когда пользователь выбирает узел, цвета фона изменяются от выбранного выбранного узла до самого верхнего родителя в пределах.

Есть ли способ изменить текст узла в bootstrap treeview без перерисовки всего дерева или удаления / добавления узла? Я проверил здесь: https://github.com/jonmiles/bootstrap-treeview и здесь.

Мы добавляем корневые узлы к элементу управления TreeView , как показано ниже. Но как установить цвет фона этого корневого узла. Также установите bg-color для любого выбранного в данный момент.

Источник

Элемент управления TreeView

Элемент управления TreeView является наиболее впечатляющим элементом управления навигацией. Он не только позволяет генерировать многофункциональные представления деревьев, но и поддерживает заполнение частей дерева по запросу (и без обновления всей страницы). Однако более важным фактом является то, что этот элемент управления поддерживает широкий диапазон стилей, с помощью которых можно преобразовать его внешний вид. Устанавливая всего лишь несколько основных свойств, можно добиться того, что элемент управления TreeView будет выглядеть не как справочный указатель, а как список файлов и папок каталога.

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

Мы уже рассмотрели пример применения элемента управления TreeView для отображения данных карты сайта. В этом примере использовалась возможность привязки элемента управления TreeView к иерархическим источникам данных. Однако элемент управления TreeView можно также заполнить с помощью привязки к обычному источнику данных (в этом случае получается только один уровень узлов) или за счет самостоятельного создания узлов — либо программно, либо через объявление .aspx.

Последний вариант является самым простым. Например, добавляя дескрипторы в раздел элемента управления TreeView, можно создать несколько узлов:

А вот как добавить TreeNode программно при загрузке страницы:

При первом отображении элемента управления TreeView будут показаны все узлы. Этим поведением можно управлять, устанавливая свойство TreeView. ExpandDepth. Например, если ExpandDepth равно 2, то будут показаны только первые три уровня (уровень 0, уровень 1 и уровень 2). Для определения количества уровней, включенных в TreeView (в свернутом или развернутом состоянии) служит свойство MaxDataBindDepth. По умолчанию это свойство имеет значение -1, при котором видимо все дерево. Однако если, например, установить его в 2, то под начальным узлом будут отображаться только два узла. Узлы можно также программно разворачивать и сворачивать, присваивая свойству TreeNode. Expanded значение true или false.

Это только небольшая часть из того, что может делать TreeView. Чтобы использовать его максимально эффективно, нужно понять, как производится настройка ряда деталей объекта TreeNode.

Объект TreeNode

Каждый узел в дереве представлен объектом TreeNode. Как вы уже знаете, каждый объект TreeNode имеет связанный с ним фрагмент текста, отображаемый в дереве. Объект TreeNode предлагает также свойства навигации, такие как ChildNodes (коллекция узлов, которые он содержит) и Parent (контейнерный узел, расположенный в дереве на уровень выше). Наряду с этим объект TreeNode предоставляет набор свойств, перечисленных в таблице ниже:

Свойства TreeNode

Текст, отображаемый в дереве для данного узла

Текст контекстной подсказки, который появляется при наведении указателя мыши на текст узла

Хранит неотображаемое значение с дополнительными данными об узле (например, уникальный идентификатор, который будет использоваться при обработке событий щелчков для идентификации узла или поиска дополнительной информации)

Если установить это свойство, оно автоматически переадресует пользователя по соответствующему URL-адресу после выбора узла, в противном случае придется повторно отреагировать на событие TreeView.SelectedNodeChanged, чтобы решить, какое действие нужно выполнить

Если свойство NavigateUrl установлено, то это свойство задает искомое окно или фрейм для ссылки. Если свойство Tagret не установлено, то в текущем окне браузера открывается новая страница. TreeView также имеет свойство Target, с помощью которого можно применить цель по умолчанию для всех экземпляров TreeNode

Изображение, которое отображается рядом с этим узлом

Текст контекстной подсказки для изображения, отображаемого рядом с узлом

Необычной особенностью объекта TreeNode является то, что он может использоваться в одном из двух режимов. В режиме выбора щелчок на узле приводит к обратной отправке страницы и генерации события TreeView.SelectedNodeChanged. Это режим по умолчанию для всех узлов. В режиме навигации щелчок на узле приводит к переходу на новую страницу без генерации события SelectedNodeChanged. Объект TreeNode перейдет в режим навигации, если свойству NavigateUrl присвоить значение, отличное от пустой строки. Объект TreeNode, привязанный к данным карты сайта, работает в режиме навигации, поскольку каждый узел карты сайта предоставляет информацию об URL-адресе.

В следующем примере элемент управления TreeView заполняется результатами запроса к базе данных. Способность TreeView к отображению иерархических данных желательно использовать для создания списка типа «главный-детальный». Поскольку ASP.NET не включает никакого элемента управления источником данных, который мог бы осуществлять запрос к базе данных и предлагать результаты в виде иерархического источника данных, применять связывание данных нельзя. Вместо этого нужно программно запросить таблицу и вручную создать структуру TreeNode.

Вот как выглядит код, в котором реализуется этот подход:

При щелчке на узле можно обработать событие SelectedNodeChanged, чтобы показать информацию об узле:

Результат выполнения этого кода показан на рисунке ниже:

Упростить код страницы в этом примере можно несколькими способами. Один из них заключается в привязке к XML-данным, а не к реляционным данным. Поскольку SQL Server 2000 и последующие его версии могут выполнять XML-запросы с помощью конструкции FOR XML, можно извлечь данные, оформленные в специфической XML-разметке, а затем привязать их посредством элемента управления XmlDataSource. Единственным ухищрением будет то, что поскольку XmlDataSource предполагает, что вы будете привязываться к файлу, свойство Data понадобится установить вручную с применением XML-данных, полученных из базы данных.

Заполнение узлов по запросу

При наличии очень большого объема данных, которые нужно отобразить в элементе управления TreeView, не исключено, что вы не захотите заполнять его всеми этими данными за один раз. Это приведет не только к увеличению времени обработки первоначального запроса страницы, но и к существенному увеличению размера страницы и состояния представления.

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

Чтобы использовать заполнение по запросу, нужно присвоить значение true свойству PopulateOnDemand любого элемента управления TreeView, который в текущий момент имеет необходимое для заполнения содержимое. Когда пользователь развернет эту ветвь, элемент управления TreeView инициирует событие TreeNodePopulate, которое можно будет применять для добавления следующего уровня узлов. При желании этот уровень узлов может содержать другой уровень узлов, заполняемых по запросу.

Хотя программная модель остается неизменной, TreeView поддерживает два способа заполнения узлов по запросу. Если свойство TreeView. PopulateNodesFromClient имеет значение true (по умолчанию), то TreeView выполняет обратный вызов на стороне клиента, чтобы извлечь необходимые узлы из события, не отправляя обратно всю страницу целиком. Если PopulateNodesFromClient установлено в false или если оно равно true, но TreeView обнаруживает, что текущий браузер не поддерживает обратные вызовы на стороне клиента, то TreeView выполняет обычную обратную отправку для получения того же результата. Единственное отличие заключается в том, что вся страница будет обновлена в браузере, генерируя не такой гладкий интерфейс. (Он позволяет также генерировать другие страничные события, например, события изменения элемента управления.)

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

Теперь необходимо отреагировать на событие TreeNodePopulate, чтобы заполнить категорию при ее разворачивании. В рассматриваемом примере единственными узлами, которые сами заполняются по запросу, являются категории. Если же будет несколько уровней узлов, в которых используется заполнение по запросу, можно проверить TreeNode.Depth, чтобы определить, какой тип узла развернут:

Данный узел заполняется по запросу только один раз. После этого значения остаются доступными на стороне клиента, и обратный вызов не будет выполняться при сворачивании и разворачивании этого узла.

Стили элемента управления TreeView

Элемент управления TreeView имеет подробную модель стилей, которая позволяет полностью управлять его внешним видом. Каждый стиль применяется к типу узла. Стили представляются классом TreeNodeStyle, который унаследован от обычного класса Style. Подобно другим многофункциональным элементам управления, с помощью стилей можно настраивать цвета фона и изображения, шрифты и границы. Кроме того, класс TreeNodeStyle добавляет свойства стилей, специфичные для узлов (таблица ниже). Эти свойства связаны с изображением узла и пространством вокруг него:

Свойство Описание
Text
Свойства стилей TreeNodeStyle

URL-адрес изображения, отображаемого рядом с узлом

Интервал (в пикселях) между текущим узлом и узлами, расположенными над ним и под ним

Интервал (в пикселях) между верхней и нижней частями текста узла и границей вокруг текста

Интервал (в пикселях) между левой и правой частью текста узла и границей вокруг текста

Поскольку элемент управления TreeView генерируется в виде HTML-таблицы, можно установить заполнение различных элементов, чтобы управлять интервалами вокруг текста, между узлами и т.д. Еще одним свойством, вступающим в игру, является TreeView. NodeIndent, которое определяет количество пикселей отступа (слева) в каждом последующем уровне иерархии дерева. На рисунке ниже показано, как эти настройки применяются к одному узлу:

Элемент управления TreeView позволяет также сконфигурировать свою внутреннюю визуализацию с помощью высокоуровневых свойств. Линии узлов в дереве можно убрать с помощью свойства TreeView. ShowExpandCollapse. Можно также использовать свойства CollapseImageUrl и ExpandImageUrl, чтобы установить индикаторы свернутого и развернутого состояний элемента управления TreeView (обычно они отображаются в виде знака «минус» и «плюс» соответственно), и свойство NoExpandImageUrl, чтобы указать, что будет отображаться рядом с узлами, не имеющими дочерних узлов.

Наконец, можно отобразить флажки рядом с каждым из узлов (установив свойство TreeView.ShowCheckBoxes в true) или рядом с отдельными узлами (установив свойство TreeNode.ShowCheckBox в true). Чтобы узнать, выбран ли данный узел, нужно проверить свойство TreeNode.Checked.

Применение стилей к типам узлов

Элемент управления TreeView позволяет индивидуально управлять стилями различных типов узлов — например, корневых узлов, узлов, содержащих другие узлы, выбранных узлов и т.д.

Чтобы применить настройки стиля узла ко всем узлам дерева, можно использовать свойство TreeView.NodeStyle. Отдельные области элемента управления TreeView изолируются с использованием более специфического стиля:

Свойство Описание
ImageUrl
Свойства стилей TreeView

Применяется ко всем узлам

Применяется только к узлам первого уровня (корневой узел)

Применяется к любому узлу, содержащему другие узлы, кроме корневых узлов

Применяется к любому узлу, не содержащему дочерних узлов и не являющемуся корневым узлом

Применяется к выбранному на данный момент узлу

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

Стили в этой таблице перечислены в порядке от наиболее общего до специфичного. Это означает, например, что настройки стиля SelectedNodeStyle замещают любые конфликтующие настройки в RootNodeStyle. (Если не хотите, чтобы узел можно было выбирать, установите свойство TreeNode.SelectActionNone.) Однако настройки RootNodeStyle, ParentNodeStyle и LeafNodeStyle никогда не конфликтуют, т.к. определения для корневых, родительских и дочерних узлов, взаимно исключают друг друга. Не может существовать узел, который, например, будет одновременно родительским и корневым узлом — TreeView просто обозначит его как корневой узел.

Применение стилей к уровням узлов

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

Единственная проблема состоит в том, что элемент управления TreeView теоретически может иметь неограниченное количество уровней узлов. В связи с этим нет смысла предлагать такие свойства, как FirstLevelStyle, SecondLevelStyle и т.д. Наоборот, TreeView имеет коллекцию LevelStyles, которая может иметь столько элементов, сколько необходимо. Уровень выводится из позиции стиля в коллекции, поэтому первый элемент считается корневым уровнем, второй элемент — вторым уровнем узла и т.д. Чтобы такая система могла работать, понадобится повторить этот порядок и включить пустой заполнитель стиля, если необходимо пропустить уровень, не изменяя форматирование.

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

Если применить этот код к списку категорий и товаров, показанному в предыдущих примерах, отобразится страница вроде показанной на рисунке ниже:

Изображения элемента управления TreeView

Как уже известно, изображение для одиночного узла можно задать с помощью свойства TreeViewNode.ImageUrl. К счастью, когда требуется назначить последовательный набор изображений для всего дерева, применять такой детальный подход не придется. Вместо этого можно использовать свойства TreeView для установки изображений для всех узлов. Можно выбрать картинку, которая будет отображаться рядом со всеми свернутыми узлами (CollapsedUrl), всеми развернутыми узлами (ExpandImageUrl) и всеми узлами, которые не имеют дочерних узлов и поэтому не могут быть развернуты (NoExpandImageUrl). Если задать эти свойства и определить изображение для определенного узла с помощью свойства TreeViewNode.ImageUrl, то преимущество будет отдано изображению, определенному для узла.

Элемент управления TreeView имеет коллекцию изображений, которыми можно пользоваться, чтобы не тратить время на создание специальных изображений для узлов. Для доступа к этим изображениям предназначено свойство TreeView. ImageSet, которое принимает одно из 16 значений из перечисления TreeViewImageSet. Каждый набор включает изображение для свернутого и развернутого узла, а также для узла, не имеющего дочерних узлов. Применяя свойство ImageSet, можно отказаться от использования любых других свойств, связанных с изображениями.

Некоторые доступные варианты свойства ImageSet показаны на рисунке ниже. Например, значение TreeViewImageSet.Faq создает дерево со значками в стиле справки, отображающими вопросительный знак (для узлов, которые не имеют дочерних узлов), или вопросительный знак, расположенный поверх папки (для узлов с дочерними узлами):

Чтобы вручную не создавать эти стили можете выбрать в смарт-теге TreeView раздел AutoFormat и выбрать нужный стиль:

Источник

Слово "Цвет" и его описание © 2022
Внимание! Информация, опубликованная на сайте, носит исключительно ознакомительный характер и не является рекомендацией к применению. Обязательно проконсультируйтесь с вашим лечащим врачом!

Adblock
detector
Свойство Описание
NodeStyle