Delphi-Help

Главная Статьи Разделитель панелей (Splitter) Крестообразный сплиттер

Крестообразный сплиттер

Оцените материал
(0 голосов)


Крестообразный сплиттер

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

сплиттер

Однако среди компонентов делфи такого компонента нет. Далее будет показано как делается крестообразный сплиттер на делфи из 3х обычных сплитеров

Для начала кидаем на форму 2е панельки. У первой назначаем свойство align в alTop, затем кидаем на форму первый сплитер (TSplitter) он находиться на вкладке Additional. Назначаем сплитеру свойство align в alTop. Теперь разворачиваем вторую панель на все оставшееся пространство. Свойство align в alClient

В результате должно получиться похоже на это

2

Далее на верхнюю панель помещаю 2 компонента Memo. У первого устанавливаю свойство align в alLeft. Затем на верхнюю панель помещаю второй сплиттер. Ему также нужно установить align в alLeft. Затем второй компонент Memo расширяем на всю оставшуюся часть панели. align в alClient Должно получиться примерно так

3

С нижней панелькой поступаем аналогично. В результате получаем

4

Почти все сделано осталось синхронизировать 2й и 3й сплиттеры. У сплиттера есть свойство OnMoved. Теперь если сделать на него обработчик и синхронизировать размеры, то желаемая цель будет почти достигнута:

procedure TForm1.Splitter2Moved(Sender: TObject);
begin
  Memo3.Width := Memo1.Width;
end;
 
procedure TForm1.Splitter3Moved(Sender: TObject);
begin
  Memo1.Width := Memo3.Width;
end;

Те компоненты Memo которые в правой части сами примут необходимый размер.

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

procedure TForm1.FormCreate(Sender: TObject);
begin
  Memo3.Width := Memo1.Width;
end;

Теперь осталось еще 2 штриха. При перемещении вертикальных сплиттеров видно что они не цельные. Исправим это изменив свойство ResizeStyle на rsUpdate. Для этого выделим все 3 сплиттера удерживая клавишу Shift. См. рисунок.

5

И второй штрих. Можно заметить что панельки выдавлены вверх и между ними возникла полоска. Убираем ее. Выделяем обе панельки (в Object Tree View удерживая клавишу ctrl). находим свойство BevelOuter и убираем его. См. рисунок.

6

Теперь все готово. Если вы все сделали правильно то при запуске приложения у вас должна получиться форма как на рисунке

7

Авторизация



Счетчики