이 글은 Marco Cantu가 작성한 엠바카데로 블로그 글을 번역(및 일부의역)한 것입니다


 

 

지금까지 VCL에서는 애플리케이션 전체에 하나의 스타일만 적용할 수 있었습니다(또는 아예 적용하지 않거나). 10.4 부터는 VCL 애플리케이션에 동시에 여러 VCL 스타일을 적용할 수 있습니다. 이는 애플리케이션의 컨트롤 마다 또는 다른 폼의 컨트롤 마다 서로 다른 스타일을 적용할 수 있다는 의미입니다.(윈도우 기본 테마와 스타일을 동시에 사용할 수도 있습니다.)

이 기능은 TControl 클래스의 새로운 속성인 StyleName에서 컨트롤할 수 있습니다. 애플리케이션 속성을 보면 활성화된 스타일들이 있는데, 이 중 원하는 스타일의 이름을 선택하면 바로 적용할 수 있습니다. 이 값을 적용하지 않으면, 부모 컨트롤(컨테이너 또는 폼)의 스타일이 자동 적용됩니다.

 

빠른 데모

컨트롤 개별 스타일(Per-Control Style)은 이름에서 알 수 있듯이 하나의 애플리케이션 폼 컨트롤마다 다른 스타일을 적용할 수 있는 기능입니다.
먼저, 애플리케이션에 여러개의 스타일을 추가합니다. 그리고 Default style 항목을 'Windows'외의 다른 스타일로 설정합니다.('Windows' 이외의 스타일을 적용해야만 컨트롤 별 스타일이 적용됩니다.)
참고로, 10.4에서는 새로운 High-DPI 스타일을 사용할 수 있습니다. 자세한 내용은 다른 글에서 소개하겠습니다.

폼안의 컨트롤 StyleName을 각각 다른 스타일 이름으로 지정할 수 있습니다.
다음은 DFM 파일 예시입니다.(연관된 주요 속성들만 표시합니다.)

object Form2: TForm2
  StyleName = 'Sky'
  object Panel1: TPanel
    StyleName = 'Light'
    object Button1: TButton...
    object Button3: TButton
      StyleName = 'Sky'
    end
  end
  object Button2: TButton
    StyleName = 'Windows'
  end
  object Button4: TButton
    StyleName = 'Luna'
  end
  object Button5: TButton
    StyleName = 'Aqua Graphite'
  end
end

Button1은 스타일을 지정하지 않았기 때문에, 부모 패널의 스타일이 그대로 적용됩니다. Button2와 같이 ‘Windows’로 설정 시 폼에서 지정한 스타일을 적용하지 않습니다.(‘Windows’는 특별한 목적을 갖는 값입니다. 자세한 내용은 아래에서 다시 살펴보겠습니다.)
이 코드는 5개의 버튼이 각각 5가지 스타일이 적용되도록 설정한 것으로, 아래 그림과 같이 표현됩니다.

 

다양한 설정 방법들

VCL 애플리케이션의 다양한 폼과 컨트롤 스타일 조정을 위한 다양한 방법들이 있습니다.

1. 프로젝트 옵션에서 스타일 목록을 조정합니다.(또는 런타임에서 스타일을 로드할 수도 있습니다.)

2. TControl.StyleName 속성을 이용 각 컨트롤과 폼에 특정 스타일을 지정합니다. StyleName 값은 프로젝트 옵션에서 선택한 항목 중 하나여야 합니다. 부모 컨트롤에 설정된 StyleName 값을 그대로 사용할 수도 있습니다. 폼의 StyleName 속성을 설정해 폼의 모든 컨트롤에 특정 스타일을 지정할 수 있습니다. 다음과 같이 사용 가능합니다.

  • TControl.StyleName의 값을 공백으로 설정 시: 기본 스타일(애플리케이션의 스타일)이 적용됨
  • StyleName에 ‘Windows’ 설정 시: 컨트롤과 폼에 설정한 StyleName이 비활성화됨(스타일이 적용되지 않음)
  • TControl.StyleName에 유효하지 않은(선택되지 않은) 스타일 설정 시: 기본 스타일이 적용됨

3. 일반 대화상자(Dialog)도 TStyleManager.DialogsStyleName 속성을 이용해 특정 스타일을 설정할 수 있습니다. 해당 속성의 기본 값은 공백이며, 애플리케이션의 기본 스타일이 적용됩니다.

4. 애플리케이션 스타일을 ‘Windows’로 설정할 수 있습니다. 그러면 컨트롤들과 폼의 속성이 ‘Windows’로 설정되며 스타일이 비활성화 됩니다. 만약, ‘Windows’ 스타일을 유지하면서 컨트롤에 스타일을 활성화하려면 TStyleManager.UseSystemStyleAsDefault 속성을 True로 설정하면 됩니다. 이 설정을 지정하면 StyleName 속성을 지정한 항목들만 스타일이 적용됩니다. 다만 애플리케이션의 스타일이 활성화(Default style을 ‘Windows’ 외 다른값으로 지정) 되어있어야 합니다.

위 4번항목을 활용하면, VCL 스타일을 지원하지 않는 써드파티 컴포넌트를 사용할 수도 있습니다. 이전에는 처리하기 상당히 복잡했습니다. 하지만 새로운 아키텍처에서는 스타일 적용이나 또는 적용하지 않는 컨트롤들을 함께 사용할 수 있으므로 VCL 스타일을 포기하지 않으면서도 써드파티 컴포넌트 활용이 가능합니다.

컨트롤 개별 VCL 스타일 설정은 써드파티 컨트롤이 자동으로 적용되지는 않습니다. 이 기능을 지원하려면 컨트롤 측에서 Vcl.Theme.StyleServices 메소드를 TControl 파라미터를 지정해 호출해야 합니다. 예를들어 StyleServices(Self).DrawElement 같은 코드입니다.

결론

컨트롤 개별 VCL 스타일(Per-Control VCL Style)을 도입하면, 스타일을 더욱 유연하게 사용할 수 있습니다. 일부 컨트롤만 스타일을 적용하고, 그 이외의 컨트롤들은 기본 테마를 유지할 수도 있습니다. 스타일을 설정한 애플리케이션 내에서 VCL 스타일을 지원하지 않는 사용자정의 컨트롤 또는 써드파티 컨트롤을 적용하거나
UI 스타일 활용도 가능하고, 동적으로도 스타일을 지정하는 것도 가능합니다.

컨트롤 개별 스타일 적용 외에도 많은 VCL 기능이 추가되었습니다. 10.4 새로운 기능들 중에서도 VCL 스타일은 미리 소개할만한 가치가 있는 새로운 기능입니다.

10.4 무료 평가판으로 지금 경험해보세요!   [전체보기] 10.4 새기능들!

 

번호 제목 글쓴이 날짜 조회 수
공지 [DelphiCon 요약] 코드사이트 로깅 실전 활용 기법 (Real-world CodeSite Logging Techniques) 관리자 2021.01.19 14387
공지 [UX Summit 요약] 오른쪽 클릭은 옳다 (Right Click is Right) 관리자 2020.11.16 13023
공지 [10.4 시드니] What's NEW! 신기능 자세히 보기 관리자 2020.05.27 15532
공지 RAD스튜디오(델파이,C++빌더) - 고객 사례 목록 관리자 2018.10.23 21064
공지 [데브기어 컨설팅] 모바일 앱 & 업그레이드 마이그레이션 [1] 관리자 2017.02.06 22297
공지 [전체 목록] 이 달의 기술자료 & 기술레터 관리자 2017.02.06 17932
공지 RAD스튜디오(델파이, C++빌더) - 시작하기 [1] 관리자 2015.06.30 38228
공지 RAD스튜디오(델파이,C++빌더) - 모바일 앱 개발 사례 (2020년 11월 업데이트 됨) 험프리 2014.01.16 173741
1223 [델파이 문법] 클래스와 객체 #16 file 관리자 2012.06.26 6333
1222 [동영상 강의] 델파이 기본 교육_20.스토어드 프로시저 관리자 2012.08.07 6323
1221 RAD Studio XE3와 SQLite 관리자 2012.10.09 6321
1220 인터베이스 (InterBase) 매뉴얼 및 튜토리얼 관리자 2012.06.15 6321
1219 [REST API] 다음 Kakao > 로컬 > 주소검색 연동하기 [2] 험프리 2017.09.18 6275
1218 [세미나자료] 인터베이스(InterBase) in Action, Live! file 관리자 2012.05.10 6258
1217 [C++빌더 XE3 비디오 31] dbExpress와 ClientDataSet을 사용해 SQL 데이터베이스 C++ 파이어몽키 앱 만들기 관리자 2013.01.09 6244
1216 안드로이드 API를 파이어몽키에서 사용하기(Toast 메세지 구현) file Humphery 2013.12.17 6213
1215 [환경설정] 아마존 EC2 이용해 윈도우 서버 환경 구축하기 [1] file 험프리 2017.04.13 6207
1214 [델파이 문법 시리즈] #7. 제네릭 - 클래스 변수, 표준함수 file 관리자 2012.04.02 6207
1213 델파이 에서 안드로이드로 박병일 2012.01.06 6194
1212 파이어몽키 모바일에서 사용자 파일 배포 및 사용 file 험프리 2013.12.27 6187
1211 [동영상강의] 델파이 기본 교육_11.메뉴 작성 컴포넌트 설명 관리자 2012.06.20 6179
1210 RAD스튜디오나 델파이만으로 (별도 맥 컴퓨터 없이) 아이폰 앱을 만들고 앱스토어에 올릴 수 있습니다. 관리자 2013.05.30 6158
1209 David I의 31 XE3 퀵 비디오 - 윈도우8 스타일 사용하기 관리자 2012.10.08 6155
1208 [동영상강의] 델파이 기본 교육_14.메모장 만들기3 (스프래쉬 화면과 리포지토리) 관리자 2012.07.06 6155
1207 PrintDialog 를 사용하지 않고 프린트 하기 박병일 2011.12.22 6150
1206 [델파이 문법] 프로시저와 함수 #7 file 관리자 2012.08.13 6126
1205 [10.2 도쿄] 델파이/C++빌더 리눅스 개발환경 설정하기 [1] file 험프리 2017.02.21 6107
1204 [델파이 문법] 문법 요소 #13 file 관리자 2012.11.20 6104