Как в Delphi использовать компонент TStackPanel?

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

Основная информация по компоненту
Вкладка палитры компонентов		Windows 10
Исходник официального примера и документация		DocWiki

Этот пример Delphi демонстрирует использование различных свойств компонента TStackPanel. На главной форме приложения расположена сама панель TStackPanel на которой расположены несколько элементов управления, а также компоненты, необходимые для управления свойствами TStackPanel.

Внешний вид демонстрационного приложения представлен на рисунке ниже:

Использование компонента

TStackPanel позволяет вам настроить следующие основные свойства:

• Свойство HorizontalPosition позволяет вам устанавливать горизонтальное положение элементов управления при выборе вертикальной ориентации ( по центру, заполнение всего доступного места, слева или справа).
• Свойство Margins позволяет вам устанавливать значения полей Bottom, Left, Top и Right.
• Свойство «Orientation» позволяет выбрать горизонтальную или вертикальную ориентацию элементов управления.
• Свойство Padding позволяет устанавливать значения для нижнего, левого, правого и верхнего отступов.
• Свойство VerticalPosition позволяет вам устанавливать вертикальное положение элементов управления при выборе горизонтальной ориентации (по нижнему краю, по центру, заполнение всего доступного пространства или по верхнему краю).

Каждый элемент управления, размещенный в TStackPanel, имеет дополнительные свойства:

• Свойство ControlIndex позволяет изменить последовательность элементов управления в контейнере.
• Свойство HorizontalPosition позволяет вам изменять горизонтальное положение отдельного элемента управления при выборе вертикальной ориентации.
  • Значение sphpDefault присваивает элементу управления горизонтальное положение панели хоста.
• Свойство VerticalPosition позволяет изменять вертикальное положение отдельного элемента управления при выборе горизонтальной ориентации.
  • Значение sphpDefault задает значение VerticalPosition панели хоста элементу управления.

Демонстрационный пример

Изменение свойств TStackPanel и свойств элементов управления внутри TStackPanel осуществляется следующим образом:

procedure TStackPanelForm.grpPositioningClick(Sender: TObject);
begin
  StackPanel1.DisableAlign; // Stop align.
  try
    ResetControl; // Revert width / height of all controls.
    // no sphpDefault/spvpDefault in this case. To skip sphpDefault/spvpDefault, 1 is added.
    if StackPanel1.Orientation = spoVertical then
      StackPanel1.HorizontalPositioning := TStackPanelHorizontalPositioning(grpPositioning.ItemIndex + 1)
    else
      StackPanel1.VerticalPositioning := TStackPanelVerticalPositioning(grpPositioning.ItemIndex + 1);
  finally
    StackPanel1.EnableAlign; // restart align with new parameter.
  end;
end;
 
procedure TStackPanelForm.trkSpacingChange(Sender: TObject);
begin
  StackPanel1.Spacing := trkSpacing.Position;
end;
 
procedure TStackPanelForm.trkPaddingChange(Sender: TObject);
var
  P: Integer;
begin
  P := trkPadding.Position;
  StackPanel1.Padding.SetBounds( P, P, P, P );
end;
 
procedure TStackPanelForm.ResetControl;
begin
  // Get the default height/width of the controls.
  Label1.Width  := DefaultLabel1Width;
  Label1.Height := DefaultLabel1Height;
  Edit1.Width   := DefaultEdit1Width;
  Edit1.Height  := DefaultEdit1Height;
  Button1.Width := DefaultButton1Width;
  Button1.Height:= DefaultButton1Height;
  Memo1.Width   := DefaultMemo1Width;
  Memo1.Height  := DefaultMemo1Height;
end;
 
procedure TStackPanelForm.lstControlsClick(Sender: TObject);
begin
  if StackPanel1.Orientation = spoVertical then
    grpControlPositioning.ItemIndex := Ord(StackPanel1.ControlCollection[lstControls.ItemIndex].HorizontalPositioning)
  else
    grpControlPositioning.ItemIndex := Ord(StackPanel1.ControlCollection[lstControls.ItemIndex].VerticalPositioning);
end;
 
procedure TStackPanelForm.grpControlPositioningClick(Sender: TObject);
begin
  StackPanel1.DisableAlign; // Stop align.
  try
    ResetControl; // Revert width / height of all controls.
    if StackPanel1.Orientation = spoVertical then
      StackPanel1.ControlCollection[lstControls.ItemIndex].HorizontalPositioning := TStackPanelControlHorizontalPositioning(grpControlPositioning.ItemIndex)
    else
      StackPanel1.ControlCollection[lstControls.ItemIndex].VerticalPositioning := TStackPanelControlVerticalPositioning(grpControlPositioning.ItemIndex);
  finally
    StackPanel1.EnableAlign; // restart align with new parameter.
  end;
end;

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

При подготовке статьи использовалась информация со следующих ресурсов:

1. Официальный репозиторий демонстрационных примеров Delphi на SourceForge
2. Документация по компоненту на сайте Embarcadero
3. Информация по работе с компонентом TStackPanel на сайте Embarcadero