Создание пользовательского интерфейса сортировки для TreeView в Win32: нарисованные разделители и перетаскивание элементов

Delphi , Компоненты и Классы , TTreeView

В данной статье рассматривается вопрос создания пользовательского интерфейса для Win32 TreeView с функцией пересортировки элементов, подобно тому, как это реализовано в Windows Explorer в разделе "Избранное" или "Быстрый доступ". Основное внимание уделяется возможности нарисовать разделители между узлами и реализации функции перетаскивания элементов.

Проблема

Разработчик столкнулся с необходимостью реализации разделителей между узлами TreeView, аналогично тому, как это реализовано в Windows Explorer. Для этого предполагается использование уведомления NM_CUSTOMDRAW с состоянием CDIS_DROPHILITED, однако в коде не удаётся перехватить это состояние.

Контекст

Для решения задачи разработчик использует компонент TTreeView и пытается перехватить уведомление NM_CUSTOMDRAW в методе WMNotify. В коде есть попытка обработать состояние cdsDropHilited внутри обработчика TreeView1AdvancedCustomDrawItem, но выполнение кода не достигает инструкции Write.

Альтернативный ответ

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

Подтвержденный ответ

Для решения задачи необходимо учитывать, что разделитель в Windows Explorer рисуется только тогда, когда курсор мыши находится над верхним или нижним краем узла, на который производится перетаскивание. Следовательно, в обработчике события OnAdvancedCustomDraw(Item) необходимо проверить, является ли текущий узел целевым для перетаскивания, и если да, то:

1. Получить текущее положение курсора мыши в клиентских координатах.
2. Получить DisplayRect целевого узла.
3. Проверить, находится ли курсор в верхней или нижней части этого прямоугольника.
4. Если да, то нарисовать разделитель в соответствующем месте.

Также стоит отметить, что функция TreeView_SetInsertMark из Windows API позволяет нарисовать разделитель, подобно тому, как это показано в вопросе.

Пример кода

procedure TForm1.TreeView1AdvancedCustomDrawItem(Sender: TCustomTreeView;
  Node: TTreeNode; State: TCustomDrawState; Stage: TCustomDrawStage;
  var PaintImages, DefaultDraw: Boolean);
begin
  if (Stage = cdsPaint) and (Node = TreeView1.DropTarget) then
  begin
    var MousePos := TreeView1.ScreenToClient(Mouse.CursorPos);
    var NodeRect := TreeView1.GetNodeRect(Node, False);
    if (MousePos.Y < NodeRect.Bottom - 5) or (MousePos.Y > NodeRect.Bottom - 5 + NodeRect.Height / 2) then
      // Нарисовать разделитель, если курсор находится над краем узла
      DrawLine(TreeView1.Canvas, NodeRect.Right, NodeRect.Top + 1, NodeRect.Right, NodeRect.Bottom - 1);
  end;
end;

Заключение

Используя приведённые рекомендации, разработчик сможет создать пользовательский интерфейс для TreeView с функцией перетаскивания и нарисованными разделителями, аналогично интерфейсу Windows Explorer. Это позволит улучшить пользовательский опыт и сделать приложение более интуитивно понятным.

Примечание

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

Создано по материалам из источника по ссылке.

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

Комментарии и вопросы

Получайте свежие новости и обновления по Object Pascal, Delphi и Lazarus прямо в свой смартфон. Подпишитесь на наш Telegram-канал delphi_kansoftware и будьте в курсе последних тенденций в разработке под Linux, Windows, Android и iOS

:: Главная :: TTreeView ::