뜨하~~ 참으로 오랜만인것 같은 기분이!! ㅋㅋ
1차 프로젝트가 어느정도 마무리 되면서..긴장이 풀어져서..며칠동안 늘어졌네요..-ㅅ-;;
그래도..좀 쉬는 동안..간만에 친구도 만나고..훈쓰 식구들도 만나공~ 태오닷넷 쑈미나도 다녀오고..
ㅡㅡㅋ 여기저기 잘돌아다녔네요..히히
오늘 쓰기로 한 강좌 예제도..ㅡ.ㅡ 만들어둔지는 좀 됐는데..이제서야 쓰는군여..
오늘은 컨트롤 템플릿 안에 들어있는 이미지 소스를 변경해보도록 하겠습니다.
단, 이미지 소스의 경로를 직접 넣는 것이 아니라 C#코드에서도 변경이 가능하도록 만들꺼에요.
먼저 위와 같이 캔버스를 하나 만들어주고 그 안에 버튼 컨트롤을 넣었습니다.
이미지 변경을 보여주기 위해서 토글버튼을 썼어요.
그런 다음에는 버튼의 스타일을 만들어 주어야합니다. 오늘은 이미지를 넣은 버튼을 써야겠죠?
저는 ㅡㅡ; 작업하면서 눈이 즐겁도록 제가 좋아하는 공유 사진을 넣었습니다 하하핫!!
버튼 컨트롤 템플릿을 생성한 후(이전 강좌 참고) Images 폴더 안의 이미지를 불러 넣고,
하트모양 패스를 그려준 후 Cliping 하였습니다. Cliping에 대해서는 다음에 다루도록 하고 일단 진행합니다.
그리하여 아래와 같이 하트모양의 이미지가 버튼이 되었습니다.
그리고 버튼의 상태에 따라 효과를 주었습니다. 역시나..귀차니즘의 압박으로..오버효과만 -_-;;
이러한 작업들을 마친 XAML 코드는 다음과 같습니다.
여기서 중요한 것은 빨간 네모를 친 부분입니다. 버튼 컨트롤 템플릿의 디자인을 이루고 있는 이미지 소스를
직접 경로를 입력해 주지 않고 TemplateBinding을 사용했습니다.
Tag 속성을 이용하여 이미지개체를 가져옵니다. <ToggleButton.Tag></ToggleButton.Tag> 사이에 들어간
이미지 경로가 버튼 컨트롤 템플릿 안의 이미지 소스로 들어가게 되는것이죠..
그리고 템플릿 안이 아닌 화면 XAML에서 제어가 가능하다는 것은 C# 코드로도 제어할 수 있다는 소리입니다.
토글버튼을 이용하여 이미지변경을 해보도록 하겠습니다. 이부분은 C#으로 만들어야 합니다.
버튼을 클릭할때마다 이미지가 번갈아가면서 나오게 됩니다. 물론 오버 상태가 적용되어있구요. ^^
소스를 첨부할테니 받아서 실행해보시기 바랍니다.
ButtonImageBinding.zip
PREV
