컨트롤에 스타일 및 테마 리소스 적용 : Windows Phone 응용 프로그램 개발 자습서 - 파트 20

지난 튜토리얼에서는 스타일 및 테마 리소스를 컨트롤에 적용하는 방법을 배웠습니다. 이제 우리의 튜토리얼 시리즈 에서 우리는 스타일과 리소스로 계속 작업하고 우리가 선택한 색상 리소스를 적용하는 방법을 배웁니다.

마지막 튜토리얼에서 작성한 것과 같은 프로젝트로 작업을 시작합시다 하나의 버튼으로. 해당 버튼을 선택하고 속성 창으로 이동하십시오. Foreground 속성 옆에있는 작은 화살표 키를 클릭하면 또 다른 작은 창이 다른 색상의 타일과 탭으로 열리는 것을 볼 수 있습니다. 그 작은 창에는 Null Brush, Solid Color Brush, Gradient Brush 및 Image Brush라는 네 개의 작은 탭이 있습니다. 기본적으로 색상 흰색 (RGB: 0,0,0 및 알파 투명도 채널을 255로 설정)이있는 단색 브러시로 설정됩니다. 세로 막대를 따라 슬라이더를 이동 한 후 원형 커서를 사용하여 원하는 그늘을 선택하여 원하는 색상을 선택할 수 있습니다. 사용 가능한 도구 중 하나의 색상을 사용할 수있는 iDropper를 선택할 수도 있습니다. 이 단색 브러시에서 색상을 수정하는 방법은 많이 있습니다.

Gradient Brush도 마찬가지입니다. 솔리드 컬러 브러시와 비슷한 작업을 수행하지만 몇 가지 추가 옵션을 제공합니다. 그것은 일련의 중지를 제공합니다. 이 멈춤을 창의적으로 사용하여 선택한 색상 사이에 다른 색조를 얻을 수 있습니다. 가로 그라디언트 및 세로 그라디언트와 같은 옵션을 사용하여 색상 텍스처를 변경할 수도 있습니다. 이미지 브러시로 이미지를 리소스로 선택할 수 있습니다. 이미지 컨트롤에 이미지를 추가 한 것과 같이 이미지를 추가 할 수 있습니다.

지금 당장은 그래버를 사용하여 그라디언트 색상 브러시를 사용하십시오 (이미지 참조). 이제 XAML 윈도우가 보이면 버튼에 대한 XAML 윈도우에 코드가 추가 된 것을 볼 수 있습니다.

이제 버튼에 추가 한 그라디언트 색상을 페이지의 다른 모든 컨트롤에 추가하려는 경우, 어떻게해야합니까? 이를 위해 펑키 그라디언트 색상 브러시를 설정하고 마우스 오른쪽 버튼으로 클릭하고 "값을 리소스에 추출"을 선택하는 전경 속성으로 이동하십시오. 작은 팝업 창 "Create Resource"가 열립니다. 원하는대로 리소스의 이름을 지정하거나 그대로 둘 수 있습니다. 그런 다음이 리소스를 사용하려는 위치에 따라 저장할 위치를 선택할 수 있습니다. 단일 페이지에서 사용하려면 MainPage.xaml을 선택하고 그렇지 않으면 App.xaml을 선택하고 확인을 클릭하십시오.

디자이너 화면에서 다른 버튼을 드래그하여 포 그라운드 속성으로 이동하십시오. 이제 로컬 리소스라는 이름으로 맞춤 리소스를 찾을 수 있습니다. 클릭하면 두 번째 단추가 첫 번째 단추와 동일한 색으로 표시됩니다. 컨트롤에 적용 할 속성이 여러 개인 경우 어떻게해야합니까? 우리는 스타일을 사용하여 그렇게 할 수 있습니다. 스타일은 속성 설정자의 모음입니다. 이제 새로운 스타일을 만들어 보겠습니다. 먼저 마지막 예제에서 수행 한 모든 수정 사항을 삭제하고 새로운 시작을위한 새로운 버튼을 얻습니다. 다음 코드를 xmlsns 선언 아래에 붙여 넣습니다.

이 코드에서는 테두리 및 전경색을 변경하는 두 가지 setter 속성을 만들었습니다. 그런 다음 버튼의 코드로 이동하여 다음 코드를 추가하십시오.

Style = "{StaticResource myStyle}".

버튼 테두리 색상과 전경색이 빨간색으로 바뀌는 것을 볼 수 있습니다.

이제 원한다면 이 스타일을 전체 응용 프로그램에 적용하려면 사이에 코드를 자릅니다. App.xaml 파일을 열고 응용 프로그램 자원 태그 사이에 붙여 넣습니다. 이제 다시 돌아가서 버튼을 확인하면 버튼에 여전히 붉은 색이 표시됩니다.

Windows Phone 7.5의 스타일과 리소스에 관한 내용입니다. 다음 장에서 xaml 페이지 간 이동에 대해 배웁니다.