Jump to content
과거의 기술자료(읽기 전용): https://tech.devgear.co.kr ×
과거의 기술자료(읽기 전용): https://tech.devgear.co.kr

[아티클] [Bootcamp 2023 요약] 앱을 백만불짜리처럼 보이게 만드는 방법 - Ray Konopka


Recommended Posts

>>Bootcamp로 이동
>>2023 시리즈 목록으로 이동

bootcamp2023VCL Style Designer.png

 

 

이 세션은 회사의 애플리케이션의 색상이나 모습을 회사의 CI를 지킬 수 있도록 하고 싶은 델파이 또는 C++빌더 개발자이 꼭 알고 있어야 하는 것들을 데모와 함께 설명합니다.

원본 비디오(YouTube) 보기 (Q&A 제외 55 min)

Bootcamp 2023 시리즈 중, "How to make your apps look like a million dollars - Ray Konopka" (Q&A 제외 55 min)의 한글 요약본입니다.  

나에 (또는 회사의 CI에) 맞는 맞춤 VCL 스타일을 만들고 적용하고자 한다면, 이 세션이 큰 도움이 될 것입니다. CI (Corporate Identity)는 그 회사의 또는 그 제품의 브랜드를 명확히 하는 효과가 있으며, 좋은 CI를 갖추고 유지하지 위해 많은 비용과 노력이 들어갑니다. 그 회사의 애플리케이션의 색상이나 모습 역시 회사의 CI에 발맞추어 같게 유지되는 것이 좋습니다. 회사의 애플리케이션의 색상이나 모습을 회사의 CI를 지킬 수 있도록 하고 싶은 델파이 또는 C++빌더 개발자이 꼭 알고 있어야 하는 것들을 이 세션에서 데모와 함께 설명합니다.

예를 들어,

  • VCL 스타일을 애플리케이션에 적용하는 방법
  • (엠바카데로 또는 써드-파티에서) 제공하는 스타일을 복사하여 자신만의 스타일을 만드는 방법
  • 내 스타일을 IDE의 Project Settings에서 활용할 수 있도록 하는 방법
  • 모든 팝업 창에 적용할 스타일을 지정하는 방법
    • TStyleManager.DialogsStyleName := '원하는 스타일 이름';
  • 커스텀 스타일을 사용하면서도 윈도우 표준 팝업 창을 사용하는 방법
    • TStyleManager.SystemHooks := TStyleManager.SystemHooks - [ shDialogs ];
    • (단, 이 경우에 TMainMenu를 사용했다면, 어두운 스타일에서는 잘 맞지 않을 수도 있음)
  • 스타일이 적용된 창에서도 윈도우 11 창의 그림자 효과를 반영하는 방법 
    • TStyleManager.FormBorderStyle := TStyleManager.TFormBorderStyle.fbsSystemStyle;
  • VCL Style Designer 도구를 실무에서 사용하는 방법 (이 세션의 대부분을 차지하며, 상세한 데모를 볼 수 있음) 
    • 비트맵 이미지 색상 및 색상 톤 일괄 변경하고 내보내기 (가져오기), 각 UI 요소별 맞춤 변경 (위치, 높이...), 다른 스타일 파일을 참고하여, 내 스타일을 변경하는 방법,...

중간 중간 관련 팁들도 소개됩니다. 예를 들어,

  • SetStyle 보다 TrySetStyle 메서드가 더 현실적으로 안전함
  • 내 맞춤 스타일을 만들기 전에 기반 스타일로 사용할 것을 선택할 때는 HighDPI를 인식하고 최신 윈도우에 맞춘 스타일을 선택하는 것이 좋음 
  • 색상에 신경쓰면 좋은 프로퍼티들(들)
    • Colors
    • ButtonFocused, ButtonHot, ButtonPressed
    • SysColors
    • clBtnFace, clHightlight
  • 개별 UI 요소의 오브젝트 계층과 중요한 프로퍼티(들)
    • ActiveBitmap
    • Bitmap, Bitmapdisabled, BitmapFocused, BitmapPressed
    • MarginBottom, MarginLeft, MarginRight, MarginTop
    • TileStyle,
    • Left, Top, Width, Height
  • 스타일 비트맵 파일에서 각 요소 별 영역을 마우스로 지정하는 방법과 관련 팁
  • 스타일 비트맵 파일은 PNG 파일 형식을 권장함
  • HighDPI에서 신경써야 할 부분
    • 테두리 선 굵기
    • 모퉁이 크기
    • Image Slicing Margin
  • Raize Software사 등 전문 제공사에서 판매하는 스타일(들)을 사용하는 것도 좋음 (옮긴이: 절감되는 시간에 비해 가격은 상당히 저렴하고 품질이 좋은 것들이 많음)

개별 UI 요소를 커스터마이징하고 싶을 때, VCL Style Designer 도구에서 무엇을 손대야 할 지 쉽게 파악하는데 도움이 되는 스타일 파일을
https://delphibydesign.com/downloads 페이지에서 "Creating Custom VCL Styles"에서 받을 수 있음
 


View full 엠바카데로 기술자료

이 댓글 링크
다른 사이트에 공유하기

이 토의에 참여하세요

지금 바로 의견을 남길 수 있습니다. 그리고 나서 가입해도 됩니다. 이미 회원이라면, 지금 로그인하고 본인 계정으로 의견을 남기세요.

Guest
이 토픽(기고/질문)에 답하기

×   서식있는 텍스트로 붙여넣기.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   이전에 작성한 콘텐츠가 복원되었습니다..   편집창 비우기

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

중요한 정보

이용약관 개인정보보호정책 이용규칙 이 사이트가 더 잘 작동하기 위해 방문자의 컴퓨터에 쿠키가 배치됩니다. 쿠키 설정 변경에서 원하는 설정을 할 수 있습니다. 변경하지 않으면 쿠키를 허용하는 것으로 이해합니다.