본문 바로가기

Epxression Blend/WPF / Silverlight

[Expression Blend WPF강좌] 하나의 버튼 모양으로 여러색의 버튼 만들기 (버튼 바인딩)


이번에는 하나의 버튼을 가지고 여러색으로 활용할 수 있는 바인딩을 강좌하겠습니다 - :)
저번 강좌에서 보여줬던 버튼을 다시 활용해 보도록 하겠습니다-

블랜드에서 플래쉬의보다 더 좋은 기능을 소개할 텐데요.
장점중의 하나가 바로 바인딩 기능입니다. (두둥)

위의 그림처럼 플래쉬에서 버튼을 만들었을 경우, 똑같은 모양을 하고 있지만,
다른 속성이 하나라도 있을 경우 각각 버튼을 만들었었는데요. (총4개)
블랜드에서는 모양이 같은 버튼을 하나만 만들면, 그것만 가지고 다르게 속성을 줘서 응용할 수 있다는 점입니다. (총1개)

그럼 한번 직접 만들어 보도록 하겠습니다.


1) 버튼을 우클릭하고, 컨트롤 구성요소> 템플릿 편집을 클릭하여 버튼 속성 안으로 들어갑니다 -



2) 파란색 사각형의 레이어를 클릭하면 오른쪽 속성창에서 속성이 보이는데요. Fill의 오른쪽에 조그마한 하얀 박스가 보입니다.
이게 바로 고급속성옵션인데요,


3) 하얀상자를 클릭 > 템플릿 바인딩 > Background 를 선택하여, Background에 바인딩을 시킵니다.



4) 그럼 밑의 그림과 같이 하얀상자가 노란색 상자로 바뀌면서 밑의 색 설정이 묶이는 것을 볼 수 있습니다.
이게 바로 바인딩이 되었다는 상태인데요-
이렇게 하면 버튼안에서만 색 설정을 바꾼 것을 버튼 밖에서도 색 설정을 할 수 있게 되었습니다. :)
버튼 밖으로 한번 나가서 해볼까요?


5) Background의 기본으로 설정된 색을 한번 바꾸어 봅니다. 밑의 그라데이션 단추를 움직이거나 빼면서 색을 넣어보시길,
이제 굳이 템플릿 편집으로 안 들어가도 색을 변경 할 수 있습니다.




6) 다른 색의 버튼을 만들어봅시다. 버튼 복사해서 하나 더 만들어서 색상을 바꾸어보세요~



완료! :)