Плавающие компоненты

@Fastex007 · Регистрация: 25.05.2013

Студворк — интернет-сервис помощи студентам

Всем привет!

Как можно реализовать перемещение компонентов по форме или другому контейнеру?

Например, как это реализовано в AdvChartView:

1. Есть некий контейнер содержащий в себе другие (панели, например), на которых выведены диаграммы.

2. Мышью (Shift+ЛКМ) можно подцепить, например, второй и перетащить его наверх.

3. И вторая панель становится на место первой, а первая спускается спускается вниз.

Причем перемещение возможно только по вертикале

Как такое сделать? Подозреваю, что нужно копать в сторону Drag&Drop, но так и не вкурил, как именно.

Спасибо!

@Fastex007 · 03.11.2018, 02:55 **[ТС]**

С панелями реализацию можно выполнить, используя TMS компоненты: AdvPanelGroup и AdvPanel. В AdvPanel устанавливаем CanMove=true и Caption->Visible=true и все перемещается и выравнивается. Но мне надо использовать TIamge вместо панели чтобы не нагружать проект лишними контролами.

@D1973 · 03.11.2018, 06:40

Сообщение от Fastex007

С панелями реализацию можно выполнить, используя TMS компоненты

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

Сообщение от Fastex007

мне надо использовать TIamge

А зачем извращаться?

Сообщение от Fastex007

чтобы не нагружать проект лишними контролами

У Вас камень i386 без сопроцессора? Или винчестер размером 50 Mb? Что за фантазии про "нагрузку"?

@Fastex007 · 03.11.2018, 11:16 **[ТС]**

Сообщение от D1973

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

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

Сообщение от D1973

А зачем извращаться?

за тем, что панель не умеет Canvas, а очень надо.
Объясню: мне надо сделать свои графики. С отрисовкой самих линий\точек вопросов нет, а вот со всеми этими перемещениями и прочими пользовательскими UI возникают вопросы. Использовать готовое не получается, т.к. есть множество вопросов, которые нужно допиливать, но нет исходников, да и проще и интересней самому разобраться с нуля.
Можно, конечно, кидать TImage на панель и растягивать, но тогда не понимаю, как обрабатывать перетаскивания (есть еще задача не просто менять местами, а еще и делать Docking).

Сообщение от D1973

У Вас камень i386 без сопроцессора? Или винчестер размером 50 Mb? Что за фантазии про "нагрузку"?

Был опыт, когда на форме оказывалось такое количество контролов (панелей и прочего), что выглядело все красиво, но стоит сделать что-либо по перемещению, сворачванию\разворачиванию, скроллингу, то посходило такое мерцание и торможение, что эпилепсия начиналась. И это несмотря на то, что стояли DoubleBuffered=true, и несмотря на нормальное железо ноута (i7 2.4 ГГц, 10Гб ОЗУ и GeForce GT620M)

@volvo · 03.11.2018, 11:24

Сообщение от Fastex007

Но мне надо использовать TIamge вместо панели чтобы не нагружать проект лишними контролами

Стреляем себе же в правую ногу. Image НЕЛЬЗЯ заставить работать так же красиво и минимальными действиями со стороны программиста, как Panel, потому что это НЕоконный, а графический компонент, и он элементарно не умеет Drag&Dock в необходимом объеме. И еще неизвестно, что будет мерцать (и жрать больше ресурсов, кстати), перемещение TImage, которое придется делать абсолютно полностью вручную, или перемещение TPanel, которое уже реализовано и надо просто правильно его вызвать. Итак, повторяю вопрос: будем извращаться, или возьмем-таки панели?

@Fastex007 · 04.11.2018, 00:39 **[ТС]**

Сообщение от volvo

Стреляем себе же в правую ногу.

В ногу не страшно. Я уже в голову выстрели. Два раза.
Как в данном случае вызывать панель на перемещение через растянутый на ней Image?

Сообщение от volvo

потому что это НЕоконный, а графический компонент

Действительно, не учел. Посмотрел цепочки наследования и понял.
Но не пойму для чего в TImage D&D (например)? Правильно ли я понимаю, что Drag&Drop это механизм "передачи" информации, который не обязательно проявляется как-то визуально, а Docking - это именно перемещение графики + смена родителя и т.д.?

@volvo · 04.11.2018, 17:20

Есть один, достаточно простой, способ получить то, что тебе нужно: кладешь на форму компонент TFlowPanel (раз Билдер XE4+, значит он должен быть). И на него - несколько TImage-й с выставленными DragMode=dmAutomatic. Каждому из Image-ей назначаешь вот такие обработчики OnDragOver и OnDragDrop:

C++
1
2
3
4
5
6
7
8
9
10
11
12
void __fastcall TForm1::Image1DragOver(TObject *Sender, TObject *Source, int X, int Y,
          TDragState State, bool &Accept)
{
    Accept = Source->ClassNameIs("TImage");
}
 
void __fastcall TForm1::Image1DragDrop(TObject *Sender, TObject *Source, int X, int Y)
 
{
    FlowPanel1->SetControlIndex(static_cast<TControl*>(Source),
        FlowPanel1->GetControlIndex(static_cast<TControl*>(Sender)));
}

(то есть, либо пишешь для одного и потом в инспекторе выбираешь все остальные или пишешь класс-перехватчик, с перегруженными методами DragOver и DragDrop).

Тестовый проект нужен?

P.S.

Сообщение от Fastex007

Правильно ли я понимаю, что Drag&Drop это механизм "передачи" информации, который не обязательно проявляется как-то визуально, а Docking - это именно перемещение графики + смена родителя и т.д.?

Нет. Drag&Drop - это механизм "Перетащил и бросил", это может относиться к тексту, который перетаскивают и бросают на свое приложение извне, может относиться к изображению, которое из Windows Explorer-а перетягивают (и бросают) на свое приложение, чтобы его как-то обработать или куда-то добавить. Это может относиться к перемещению узлов TreeView внутри твоего приложения друг относительно друг друга (если это перемещение делается захватом одного узла, перетягиванием и отпусканием в другом месте). То же самое - и у меня в примере: хватаем один Image (Drag), тянем вверх/вниз и отпускаем (Drop).

А Docking - это причаливание компонента к определенной области формы, никакого отношения к D&D не имеет, ибо Dock можно сделать и ручной, а не автоматический, вызовом метода, который просто причалит компонент куда нужно (при этом даже мышь в руки брать не надо). D&D без использования мыши невозможен

@Fastex007 · 07.11.2018, 00:34 **[ТС]**

Спасибо!

Сообщение от volvo

Тестовый проект нужен?

Нет, спасибо, получилось.

Очень хочется понять, как реализовываются в интерфейсе такие перемещения элементов.
Как Вы писали выше, "красоту" непосредственного движения, например, Image за курсором (как у панелек из TMS) надо допиливать самому. Но вот есть ли смысл... Просто интересно узнать, как это делается в теории, в какую сторону копать.
Как мне казалось, эта история довольно распространена в различном ПО, в том же дизайнере билдера всё это есть.

Можно попробовать использовать эти готовые панельки AdvPanel, но там тоже есть особенность, они таскаются только за Caption, который надо включить и который мешает. И как пробросить событие на панель, если на ней растянут Image, т.е. кликая по всей это конструкции я активирую события TImage, а не панели. Перехватчиком ?

@volvo · 07.11.2018, 00:49

Сообщение от Fastex007

например, Image за курсором

Сообщение от Fastex007

в какую сторону копать

В сторону использования TDragDockObjectEx, что позволит использовать любую картинку при перетаскивании объекта вместо стандартного "конвертика". Пример использования (правда, для Docking-а, но это не столь важно, с Drag&Drop это работает по тому же принципу, только OnStartDock меняется на OnStartDrag) я приводил здесь: Drag'n'Dock Мерцание и тормоза при перерисовки рамки окна

@Fastex007 · 07.11.2018, 18:02 **[ТС]**

Сообщение от volvo

Пример использования (правда, для Docking-а, но это не столь важно, с Drag&Drop это работает по тому же принципу, только OnStartDock меняется на OnStartDrag) я приводил здесь: Drag'n'Dock Мерцание и тормоза при перерисовки рамки окна

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

Спасибо!

Новые блоги и статьи Все статьи Все блоги /
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Символьное дифференцирование igorrr37 13.02.2026 / * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .

@Fastex007 7 / 5 / 2 Регистрация: 25.05.2013 Сообщений: 112

	RAD XE4+ Плавающие компоненты 03.11.2018, 02:44. Показов 1828. Ответов 9 Метки перемещение, перетаскивание, drag-n-drop (Все метки) Всем привет! Как можно реализовать перемещение компонентов по форме или другому контейнеру? Например, как это реализовано в AdvChartView: 1. Есть некий контейнер содержащий в себе другие (панели, например), на которых выведены диаграммы. 2. Мышью (Shift+ЛКМ) можно подцепить, например, второй и перетащить его наверх. 3. И вторая панель становится на место первой, а первая спускается спускается вниз. Причем перемещение возможно только по вертикале Как такое сделать? Подозреваю, что нужно копать в сторону Drag&Drop, но так и не вкурил, как именно. Спасибо! 0

@Fastex007 7 / 5 / 2 Регистрация: 25.05.2013 Сообщений: 112
	03.11.2018, 02:55 [ТС]
	С панелями реализацию можно выполнить, используя TMS компоненты: AdvPanelGroup и AdvPanel. В AdvPanel устанавливаем CanMove=true и Caption->Visible=true и все перемещается и выравнивается. Но мне надо использовать TIamge вместо панели чтобы не нагружать проект лишними контролами. 0