WPF 윈도우 타입을 None으로 하면 테두리와 타이틀바도 사라져서 깔끔해지지만, 최소화 및 닫기 등 시스템 버튼도 사라져서 불편해진다. 그래서, None 스타일을 유지하면서도 이런 시스템 버튼을 다시 추가하고 싶은 경우가 있다.

 

닫기 버튼은 x 글자를 넣고, 최소화 버튼은 언더바( _ ) 글자로 대신 넣어도 되지만, 최대화 및 복구버튼은 딱히 방법이 없다. 그래서 찾아보니, 예전부터 윈도우에는 이런 특수한 기호를 표현하기 위한 폰트가 이미 존재하고 있었다.

 

해당 폰트의 이름은 "Webdings"이다. 이미 윈도우 98부터 사용되고 있었다고 하니 호환성 걱정은 필요 없다.

자세한 내용은 위키 참고 => en.wikipedia.org/wiki/Webdings

 

Webdings - Wikipedia

Webdings is a TrueType dingbat typeface developed in 1997. It was initially distributed with Internet Explorer 4.0, then as part of Core fonts for the Web, and is included in all versions of Microsoft Windows since Windows 98. All of the Webding glyphs tha

en.wikipedia.org

 

위와 같이 기호만 들어 있는 폰트인데, 시스템 버튼에 필요한 내용은 빨간 박스 안에 있는 4개이다.

각각, 다음과 같다.

 

0 : 최소화

1 : 최대화

2 : 복귀

r : 닫기

 

xaml 코드는 대략 다음과 같다.

            <Button FontFamily="Webdings"
                    x:Name="ChangeViewButton"
                    Content="2"/>
            <Button FontFamily="Webdings"
                    x:Name="MinimizeButton"
                    Content="0"/>
            <Button FontFamily="Webdings"
                    x:Name="MaximizeButton"
                    Content="1"/>
            <Button FontFamily="Webdings"
                    x:Name="CloseButton"
                    Content="r"/>

하지만 이렇게만 만들어서 넣으면 이쁘지 않다.

Webdings 폰트를 이용해서 시스템 버튼을 다시 추가한 이미지

 

테두리와 배경색을 없애는 스타일을 만들어서 사용하면 더 이쁘게 나온다.

    <Style x:Key="SystemButton" TargetType="{x:Type Button}">
        <Setter Property="FontFamily" Value="Webdings"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="Foreground" Value="Gray"/>
        <Setter Property="MinWidth" Value="40"/>
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Background" Value="{x:Null}"/>
        <Setter Property="BorderBrush" Value="{x:Null}"/>
    </Style>

위와 같은 스타일을 만들고,

            <Button Style="{DynamicResource SystemButton}" 
                    x:Name="ChangeViewButton"
                    Content="2"/>
            <Button Style="{DynamicResource SystemButton}" 
                    x:Name="MinimizeButton"
                    Content="0"/>
            <Button Style="{DynamicResource SystemButton}" 
                    x:Name="MaximizeButton"
                    Content="1"/>
            <Button Style="{DynamicResource SystemButton}" 
                    x:Name="CloseButton"
                    Content="r"/>

버튼에서 해당 스타일을 가져다 쓰자.

 

그러면 이렇게 이쁘게 나온다.

'개발 > WPF' 카테고리의 다른 글

[WPF] BackgroundWork 사용 예제  (0) 2021.03.27
[WPF] 기본 버튼의 스타일을 바꾸는 방법  (0) 2020.12.26
[WPF] 테마와 스킨  (0) 2020.12.24

링크 : stackoverflow.com/questions/29917705/how-can-i-change-the-default-style-of-wpf-controls-for-a-single-assembly

스킨은 UI 컨트롤의 색상과 이미지 정도만 바꾸는 것이고, 테마(Theme)은 스킨에 더해 컨트롤의 크기나 연출 방식 까지도 바뀌는 걸 의미한다. (더 큰 개념)

 

WPF 어플에서 테마나 스킨을 사용하려면 다음과 같은 것을 고려해야 한다.

 

1. 윈도우의 기본 테마 중 하나를 가져다 쓰기.

2. 프로그램 내부에 테마나 스킨을 미리 세팅하기 vs 외부 파일(*.xaml)로 저장해서 그 중 하나를 읽어 오기 (내장 혹은 외부 파일)

3. 프로그램 구동시 정해진 테마나 스킨 중 하나를 선택하기(static) vs 프로그램 구동 중에 바꿀 수 있게 하기(dynamic)

 

등 여러가기 경우가 있기 때문에 이 중 어떤 방식을 사용할 것인가에 따라 구현 방식도 달라진다.

자세한 내용은 아래의 링크를 참고하자.

 

michaelscodingspot.com/wpf-complete-guide-themes-skins/

 

WPF complete guide to Themes and Skins - Michael's Coding Spot

In WPF we define a UI resource system (mostly in XAML resource dictionaries) which includes colors, templates, icons, styles and so on. Sometimes, we need the ability to change our application’s look and feel dynamically, allowing different Themes or Sk

michaelscodingspot.com

위의 블로그를 가보면 내부분의 내용은 이미지나 글로 설명이 되어 있고, 실제 구동하는 소스는 아래쪽에 링크가 첨부 되어 있다.

 

윈도우 7 내장 테마를 적용하는 방법

stackoverflow.com/questions/2075720/windows-7-theme-for-wpf

 

Windows 7 theme for WPF?

Is there any way to make a WPF app look like it's running on Windows 7 even if it's running on XP? I'm looking for some kind of theme I can just paste in. I'm aware of the themes project on Codeplex (

stackoverflow.com

 

코드 내부에 정의된 스킨 사용 예제

www.codeproject.com/Articles/19782/Creating-a-Skinned-User-Interface-in-WPF

 

Creating a Skinned User Interface in WPF

Reviews the basics of creating a WPF user interface with various visual styles.

www.codeproject.com

 

윈도우 테마와 내부 테마 파일로 정의된 테마까지 다 사용하는 테마 스킨 엔진 예제

www.codeproject.com/Articles/22575/WPF-Themes-and-Skins-Engine

 

WPF Themes and Skins Engine

In this article, I will talk about different techniques to load WPF themes and skins. I will also provide a helper class for loading and unloading themes.

www.codeproject.com

 

위와 같이 솔루션 이름 뒤에 브랜치 이름을 붙일 수 있는 플러그인 발견했다.

 

플러그인 다운로드 경로 : marketplace.visualstudio.com/items?itemName=mayerwin.RenameVisualStudioWindowTitle

 

Customize Visual Studio Window Title - Visual Studio Marketplace

Extension for Visual Studio - This lightweight extension allows changing the window title of Visual Studio to include a folder tree with a configurable min depth and max depth distance from the solution/project file, and the use of special tags to help wit

marketplace.visualstudio.com

 

git을 사용하면 경우엔 위와 같은 식으로 설정하면 된다.

 

팀시티 2018.2.3 버전 기준으로 설명하겠습니다.


팀시티 설치파일은 아래의 링크에서 받을 수 있습니다.


https://www.jetbrains.com/teamcity/download/


Download 버튼을 누르면 바로 받을 수 있습니다.


설치파일을 실행합니다.


팀시티가 설치될 PC에 특별한 게 없다면, 모두 기본 옵션으로 설치해도 됩니다.


첫 화면


라이센스 동의 화면


설치 폴더는 기본으로 c:\TeamCity 폴더로 되어 있습니다.


서버와 에이전트를 같이 깝시다.


설치 중...


웹서버 포트가 기본으로 80으로 되어 있는데, 혹시 다른 웹서비스가 이미 구동 중이라면 다른 포트(예: 8080)로 바꿔 주세요.


그냥 Save 누르면 됩니다.


workDir에 대해 잠시 설명 드리자면, 프로젝트 생성시 작업경로를 따로 지정하지 않으면 workDir 쪽에서 임의의 폴더를 만들어서 소스를 다운로드 받고 컴파일 하는 작업을 하게 됩니다. 일부 CI 툴에서는 저 작업 경로를 바꿀 수 없습니다. 하지만, 팀시티에서는 프로젝트 마다 작업폴더를 임의로 지정할 수 있으므로 workDir 경로값은 무시해도 됩니다.



팀시티 구동에 필요한 계정 종류를 선택합니다.

위쪽은 시스템 계정이고, 아래쪽은 유저 계정입니다.


경험상 유저 계정을 사용하는 게 좋습니다.

Git 이나 Subversion 로그인에 필요한 자격증명이나 기타 여러가지 설정을 저장해서 사용해야 된다면, 유저 계정을 사용하는 게 낫습니다.


서비스를 구동할 윈도우 유저 계정의 아이디와 비번을 입력합니다.


서비스를 지금 시작합니다.


설치 작업이 완료되었습니다.


Finish를 누르면 팀시티 웹페이지(예: http://localhost:80)가 뜹니다.


혹시 원격으로 팀시티 홈페이지에 접속하려고 하는데 잘 안된다면, 윈도우즈 방화벽 메뉴에서 인바운드에 새 항목으로 TCP, 80(혹은 8080) 포트를 추가하면 됩니다.



팀시티 웹페이지를 처음 띄운 경우, 몇가지 초기 설정을 해야 합니다.

먼저 데이터 경로를 지정합니다. 기본값 그대로 진행합니다.


DB 선택화면이 나옵니다. MySQL을 선택합시다.




Download JDBC driver 버튼을 누르면 자바 컨넥터를 자동으로 다운로드 받아서 설치합니다.



다운로드가 정상적으로 되었다면 Loaded JDBC driver version: 5.1 이라는 메시지가 뜹니다.

MySQL에서 사용중인 컨넥터는 8.1이지만... 이걸로도 통신은 되므로 그냥 넘어갑시다.



다른 항목의 값은 다음과 같습니다.


Database Host[:port]는 비워놔도 됩니다. (원래는 localhost:3306 입니다.)

Database name은 teamcity 라고 입력합니다. (MySQL에서 생성한 DB 이름)

User name은 root 라고 입력하고요.

Password : MySQL 설치시 사용했던 비번을 입력하면 됩니다.


그 다음에 진행(Proceed)을 누르면 됩니다.



혹시 이 단계에서 다음과 같은 에러가 뜬다면

이전에 사용중이던 DB가 이미 있어서 발생한 문제입니다.

백업이 필요한 DB가 아니라면, MySQL에서 teamcity DB를 지우고(drop) 다시 생성(create)한 후 재시도하면 됩니다. 



만약, 이 단계에서 자바 컨넥터 연결이 잘 안된다는 에러가 뜨면 자바 컨넥터를 수동으로 설치해야 합니다.

일단, 서비스에서 TeamCity를 내리고요.


MySQL에 들어 있는 자바 컨넥터 파일을 Teamcity 폴더로 복사해 줘야 됩니다.

c:\Program Files (x86)\MySQL\Connector J 8.0\mysql-connector-java-8.0.15.jar

=> ​c:\ProgramData\JetBrains\TeamCity\lib\jdbc\


이때, Teamcity폴더에 예전 커넥터 파일이 있다면 삭제해 주세요.


이후 Teamcity 서비스를 다시 구동하고요.

웹페이지를 띄워서 다시 진행하되 Download JDBC driver 버튼은 누르지 마세요.


DB와 정상적으로 연결되었다면 이렇게 나옵니다. 시작 중...



라이센스 동의 화면이 한번 뜹니다.


관리자 계정 생성 화면이 뜹니다.

보통 설치하는 사람이 관리자이므로 본인이 사용할 아이디와 비번을 입력하면 됩니다.

Create Account를 눌러서 생성하면 다음 화면으로 넘어갑니다.


혹시 이 화면이 안 뜬다던가, 이전에 생성한 아이디나 비번을 잊어 버린 경우엔 슈퍼유저로 로그인 하는 방법이 있습니다.

위의 스샷 하단에 나와 있는 거 같은 Login as Super user 이라는 글자를 누르면...

인증 토큰을 입력하라는 화면이 뜹니다.


토큰은 c:\TeamCity\logs\teamcity-server.log 파일에 있습니다.

해당 파일에서 Super user authentication token 라는 걸 찾습니다.

맨 마지막에 나오는 걸 찾은 다음에 옆에 있는 숫자를 복사해서 토큰 입력창에 넣어주면 로그인이 됩니다.


참고 링크 : https://confluence.jetbrains.com/display/TCD18/Super+User



다시 관리자 계정을 성공적으로 생성했을 때의 화면으로 되돌아가면, 아래와 같이 뜹니다.

Email 정도만 입력하고 Save changes를 눌러 저장하면 됩니다.


좌측 상단 TC 아이콘을 눌러서 메인화면으로 갑시다.


드디어 메인화면에 도달했습니다.


아직 프로젝트 생성이 안되어 있기 때문에, Create project 버튼만 보이고 있습니다.


다음에는 다른 유저 계정 만들기, 프로젝트 설정 백업과 복원, 프로젝트 생성과 관리 방법 등을 다루도록 하겠습니다.




팀시티는 기본 내장 DB의 성능이 안 좋습니다.

그냥 설치해서 사용하면 다른 DB를 사용하라는 경고 메시지가 계속 뜹니다.

그래서 MySQL을 깔아서 같이 사용해 주는 것이 좋습니다.


이번 글에서는 팀시티를 위해 MySQL을 설치하는 법을 설명하겠습니다.

8.0.15 버전 기준으로 설명하겠습니다.


MySQL은 팀시티를 설치할 PC에 같이 설치해 주면 됩니다.


우선 아래의 다운로드 페이지로 갑니다.

https://dev.mysql.com/downloads/installer/


mysql-installer-community-8.0.15.0.msi 를 다운로드 받습니다.


Download 버튼을 누르면 로그인하라는 버튼이 크게 나오는데, 무시하고 아래의 No thanks, just start my download 글자를 눌러서 바로 받습니다.


다운로드 받은 설치파일을 실행합니다.

라이센스 동의 화면이 뜨면 동의하고 넘어갑시다.


설치 타입은 Custom을 고릅니다.



MySQL Servers, MySQL Workbench, Connector/J(자바)를 선택합니다.


서버는 기본으로 필요한 요소이고요.

워크벤치는 DB를 생성하거나 관리/삭제할 때 사용하는 UI 툴입니다.

컨넥터는 팀시티와의 통신을 위해서 필요한 드라이버입니다.



Execute를 누르면 설치를 시작합니다.


설치중...


설치완료


제품 설정을 해야 합니다. Next를 누르고요.


기본 옵션 그대로 Next


기본 옵션 그대로 Next


여기서 포트 번호 3306 이라는 게 중요합니다. 특별한 경우가 아니라면 바꾸지 맙시다.



인증 방법도 기본으로 두고 Next


루트 계정용 비번을 만들어야 합니다. 두번 입력하면 되고요.

아래쪽 유저 계정 추가로 만드는 건 필요없습니다.


그냥 이대로 두면 됩니다 Next


Execute를 눌러서 설정을 적용합니다.


적용이 다 되었습니다. Finish 누르세요.


이 화면 다시 한번 나오는데 그냥 Next 누르세요.


모든 설치가 완료되었습니다.


Finish 누르면 설치 프로그램은 종료되고, 아래처럼 워크벤치가 뜹니다.

MySQL80을 클릭합니다.



아까 입력한 비번을 넣어주고요.

Save password in vault(비번저장) 옵션을 체크하고 OK


DB에 연결된 화면입니다.

이제 팀시티용 데이타베이스를 만들어야 합니다.


create database Teamcity; 까지 입력하고 Ctrl+Shift+Enter를 치면 이 SQL 문장을 실행합니다.

아래쪽에 1 row(s) affected 글자가 뜨면 성공입니다. (순식간에 뜹니다.)


참고로 데이터 베이스를 삭제하는 명령은 drop database {DB 이름}; 입니다.

팀시티 설치과정에서 뭔가 잘못되어 재설치를 해야 될 경우 등에 사용하세요.


왼쪽 패널의 Schemas 탭을 눌러서 teamcity 스키마가 생성된 것을 확인합니다. (대소문자 다른 건 중요하지 않으니 그냥 넘어갑시다)


워크벤치는 이제 종료합니다.



이 상태로 팀시티를 설치하면 팀시티에서 아래와 같은 경고가 뜨기 때문에, 한가지 할 일이 더 남아 있습니다.


c:\ProgramData\MySQL\MySQL Server 8.0\my.ini 파일을 열어서 편집해야 합니다.


innodb_flush_log_at_trx_commit 항목을 찾습니다. 기본값인 1이 지정되어 있을 건데요. 

아래처럼 2로 바꾸고 저장합니다.


innodb_flush_log_at_trx_commit=2


MySQL 서비스를 재시작합니다.

윈도우 10이라면 작업 관리자의 서비스 탭에서 가능합니다.

MySQL 설치는 이걸로 완료되었습니다.

다음 글에선 TeamCity 설치 방법을 설명하겠습니다.


'개발 > 팀시티' 카테고리의 다른 글

[팀시티 2024] 체크아웃 폴더 자동 삭제 기능 끄기  (0) 2024.07.29
팀시티 2018 설치하기  (0) 2019.03.12

+ Recent posts