티스토리 뷰

Expression

[Expression Blend] Working_with_Apperance_in_Blend

생각많은 소심남 2012. 6. 2. 23:44

 

지난 포스트에 이어서 또 블랜드로 작업을 합니다. 계속 그 프로젝트로 진행하면 될것 같고 이번에 할 내용은 Blend상에서 배경의 색상에 그레디언트를 주는 방법을 해보고자 합니다. 전에는 Expression Design에서 했었지요? 그걸 블랜드상에서도 할수 있다는 겁니다. 자 일단은 프로젝트로 들어가보겠습니다.

 

그러고나서 LayoutRoot바로 아래에 있는 Rectangle을 잡게 되면 전체 플레이어의 배경이 잡히게 됩니다.

 

 

이 배경색을 수정하려면 다들 아시겠지면 Properties의 Brush를 수정해야 합니다.

 

 

여러가지 항목이 있습니다만 가장 외관상으로 잘 드러나는 것이 바로 Fill과 Stroke입니다. 디자인에서도 이야기했었지만 Fill은 그 개체의 안을 채우는 색, 그리고 Stroke는 테두리의 색을 결정하는 것입니다. 그러고 나서 결정해야 될것이 바로 다음 줄에 있는 네모들입니다. 가장 왼쪽부터 색없음, 단색, 그레디언트, 타일, 외부 색 사용등을 표시한겁니다. 지금의 배경은 검정에서 약간의 쥐색으로 그레디언트가 걸려있기 때문에 세번째 옵션이 설정되어 있네요. 가령 이걸 첫번째 옵션으로 바꿔보면 다음의 효과가 나타납니다.

 

 

흰색으로 보이지만 말그대로 색이 없는 겁니다. 그렇다고 투명이 있는 것도 아닙니다. 그냥 표현하는 색이 없다는 것입니다. 여기서 두번째 옵션으로 색을 줄수 있습니다. 자기가 원하는 색을 그대로 입히면 됩니다.

 

 

유심히 보시면 아시겠지만 위의 fill의 색상도 지금의 색상으로 입혀져 있는 것을 볼 수 있습니다. 세번째 옵션은 기존 옵션이니까 네번째인 타일 옵션을 해보겠습니다. 디자인에서도 언급되었다시피 이건 같은 이미지를 배경으로  보여주는 기능입니다. 가령 아무 이미지나 넣어서 적용시켜보면

 

 

 

지금은 잘 안보이는데 배경에 이미지가 적용되어 있는 것을 확인할 수 있습니다.

 자 다시 그레디언트 효과로 돌아옵니다. 이제 배경의 Rectangle말고 grid안의 Rectangle을 선택해봅니다.

 지난 시간에 모서리에 곡률을 삽입하는 과정도 했었습니다. 부연설명하자면 이런 기능은 Appearance의 Radius에서도 수정하면 조절가능합니다.

 위에서 소개한 방법을 가지고 이 플레이어상의 배경에도 그레디언트를 삽입하고 색상을 마음대로 바꿔봅니다.

 

 

그런데 방향이 너무 위에서 아래로 내려오는 것 같나요? 이 방향또한 수정할 수 있습니다. 좌측의 툴바에 보면 다음 메뉴가 있습니다.

 

 

우리가 방향을 수정하려면 여기서 Gradient Tool을 선택합니다. 이걸 선택하면 스크린 상에 긴 선이 하나 생깁니다.

 

 

이걸 위가 머리고 아래가 꼬리입니다. 이 선을 자신이 원하는 방향으로 쭉 늘여주면 그레디언트의 방향을 변경시킬 수 있습니다.

 

 

물론 길이를 수정함으로써 그레디언트의 강약을 수정할 수 있습니다. 참고로 Radial Gradient 옵션을 선택하면

 

 

원으로써 그레디언트 효과를 수정할 수 있게 됩니다.

 다음으로 볼 내용은 Stroke입니다. 앞에서도 간단하게 언급했었지만 외부 테두리 색을 결정합니다. 가령 비디오 플레이어의 테두리 색을 바꾸고 싶다 하시면 Properties의 Brushes-Stroke를 수정하면 됩니다.

 

 

단순히 색만 결정할 수 있는 것이 아니라 바로 밑에 있는 Appearance의 StrokeThickness를 조절하면 두께도 수정이 가능합니다.

 

 

다들 느끼시겠지만 당연히 이 Stroke에도 그레디언트를 삽입하고 앞에서 한것처럼 Gradient Tool을 사용해서 방향과 강약을 수정할 수 있습니다.

 

 

짠! 됬습니다. 여기까지가 블랜드를 사용해서 배경색을 수정하는 방법이었습니다.

댓글