FireMonkey(FMX) 프레임워크는 시각적 요소에 대한 스타일을 정의하고 적용하는 강력한 시스템을 제공합니다. 이 글에서는 FMX에서 스타일이 작동하는 방식과 이를 코드로 직접 생성하는 방법을 설명합니다.

스타일 시스템의 작동 원리

FMX 애플리케이션의 기본 스타일은 애플리케이션 객체 내에 저장되며, 프로젝트 리소스 파일에 포함됩니다. RAD Studio는 Win, Next, iOS 등 최소 3가지 주요 스타일 유형을 내장하고 있습니다. 이러한 스타일은 폼이나 프로젝트 내 다른 위치에 직접 표시되지 않으며, StyleBook 컴포넌트를 통해 접근할 수 있습니다.

스타일 파일(*.style)은 폼 리소스 파일(*.fmx)과 구조적으로 유사하며, IDE에서 열거나 컴파일 시점에 해석됩니다. 이 특성을 이용해 *.style 파일을 수동으로 편집할 수도 있습니다. 한편, VCL 프레임워크는 다른 방식으로 리소스를 처리하므로 두 프레임워크 간 호환성은 없습니다.

코드를 통한 커스텀 스타일 생성

스타일 생성은 관련된 모든 요소를 포함할 컨테이너부터 시작합니다. FMX에서 가장 적합한 컨테이너는 TLayout 클래스입니다. 이 클래스는 화면에 직접 표시되지 않고, 다양한 자식 요소를 담을 수 있는 구조적 장점을 제공합니다.

다음은 코드를 사용해 새로운 스타일을 구성하는 예제입니다:

type
  TFormStyler = class(TForm)
    procedure CreateCustomStyle;
  private
    FStyleContainer: TLayout;
    FBackgroundRect: TRectangle;
    FTextLabel: TText;
    FIconImage: TImage;
  end;

procedure TFormStyler.CreateCustomStyle;
const
  BackgroundColor = TAlphaColorRec.Navy;
  TextColor = TAlphaColorRec.White;
begin
  // 루트 레이아웃 생성
  FStyleContainer := TLayout.Create(nil);
  FStyleContainer.StyleName := 'custombuttonstyle';

  // 배경 사각형 추가
  FBackgroundRect := TRectangle.Create(FStyleContainer);
  FBackgroundRect.Parent := FStyleContainer;
  FBackgroundRect.StyleName := 'background';
  FBackgroundRect.Align := TAlignLayout.Client;
  FBackgroundRect.Fill.Color := BackgroundColor;
  FBackgroundRect.XRadius := 10;
  FBackgroundRect.YRadius := 10;

  // 텍스트 요소 추가
  FTextLabel := TText.Create(FStyleContainer);
  FTextLabel.Parent := FBackgroundRect;
  FTextLabel.StyleName := 'label';
  FTextLabel.Align := TAlignLayout.Center;
  FTextLabel.Text := 'Custom';
  FTextLabel.TextSettings.FontColor := TextColor;

  // 아이콘 이미지 추가
  FIconImage := TImage.Create(FStyleContainer);
  FIconImage.Parent := FStyleContainer;
  FIconImage.StyleName := 'icon';
  FIconImage.Align := TAlignLayout.MostRight;
  FIconImage.Width := 24;
  // 실제 이미지 로드는 필요 시 수행
end;

스타일을 적용하려면 대상 컴포넌트의 StyleLookup 속성에 정의한 StyleName 값을 할당하면 됩니다:

procedure TFormStyler.ApplyStyleToComponents;
begin
  Button1.StyleLookup := 'custombuttonstyle';
  SpeedButton1.StyleLookup := 'custombuttonstyle';
end;

스타일 객체는 동적으로 생성되었기 때문에 폼 종료 시 메모리 해제가 필요합니다:

destructor TFormStyler.Destroy;
begin
  FStyleContainer.Free;
  inherited;
end;

스타일 리소스는 바이너리 형식으로도 저장될 수 있으며, 해당 형식도 적절한 함수를 통해 동일하게 읽어들일 수 있습니다.

스타일 시스템을 활용하면 UI 요소의 일관성 유지와 동시에 재사용 가능한 디자인을 구현할 수 있습니다.