Крестообразный сплиттер
Вы некоторых программах вы могли встретить окно с 4мя полями ввода, расположенными так что как ни меняй размер одного поля остальные меняются с ним, при этом в середине образуется перекрестие.
Однако среди компонентов делфи такого компонента нет. Далее будет показано как делается крестообразный сплиттер на делфи из 3х обычных сплитеров
Для начала кидаем на форму 2е панельки. У первой назначаем свойство align в alTop, затем кидаем на форму первый сплитер (TSplitter) он находиться на вкладке Additional. Назначаем сплитеру свойство align в alTop. Теперь разворачиваем вторую панель на все оставшееся пространство. Свойство align в alClient
В результате должно получиться похоже на это
Далее на верхнюю панель помещаю 2 компонента Memo. У первого устанавливаю свойство align в alLeft. Затем на верхнюю панель помещаю второй сплиттер. Ему также нужно установить align в alLeft. Затем второй компонент Memo расширяем на всю оставшуюся часть панели. align в alClient Должно получиться примерно так
С нижней панелькой поступаем аналогично. В результате получаем
Почти все сделано осталось синхронизировать 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. См. рисунок.
И второй штрих. Можно заметить что панельки выдавлены вверх и между ними возникла полоска. Убираем ее. Выделяем обе панельки (в Object Tree View удерживая клавишу ctrl). находим свойство BevelOuter и убираем его. См. рисунок.
Теперь все готово. Если вы все сделали правильно то при запуске приложения у вас должна получиться форма как на рисунке
