[예제로 배우는 Expression Blend] Chapter 5. 바람이 불지 않는 선풍기 - 1
Expression Blend 2008/12/10 02:04 |
Chapter 5. 바람이 불지 않는 선풍기 - 1
Width : 400 / Height : 550을 줍니다.
3. 툴바에서 원
을 선택하고 화면에 그려준 후 아래와 같이 설정합니다.
아래와 같은 원이 되었습니다.
4. 사각형
을 선택하고 아래와같이 선풍기 기둥을 그려줍니다.
5. 기둥 선택이 유지된 상태에서 스포이드
를 선택하고 아래와 같이 방금 그렸던 원을 클릭합니다.
그러면 아래와 같이 선풍기 기둥에도 그 그라데이션이 그대로 적용이 됩니다.
6. 아래와 같이 선풍기 기둥에서 마우스 우클릭 > Order > Send to Back을 선택하여 맨뒤로 보내줍니다.
아니면 아래처럼 마우스를 잡고 위로 끌어당겨도 됩니다.
->
(끌어 당기기 전) (끌어 당긴 후)
7. 아래와 같이 선풍기의 기둥아래 굵은 기둥의 사각형을 만들어 줍니다.
아래와 같이 세 개체를 모두 선택하고
Object > Align > Horizontal Centers 를 선택하여 한줄로 딱 맞게 합니다.
8. 아래와 같이 세 개체를 선택한 후 마우스 우클릭 > Group Into > Canvas 를 선택합니다.
캔바스로 감싸지면
이름을 body라고 줍니다.
아래와 같이 선풍기 몸통 부분이 만들어졌습니다.(선풍기 몸통부분을 따로 나눠 놓은 것입니다.)
아래와 같이 잠궈두겠습니다. 몸통은 이제 안 건드릴거니까요~ (눈도 안보이게 꺼놓으면 작업하기 더 편하고 좋아요 )
자~ 이제 선풍기의 날개를 만들어 보겠습니다.
9. 사각형
을 선택하고 화면에 사각형을 그린 후 아래와 같이 설정합니다.
아래와 같은 사각형이 그려집니다.
10. 아래와 같이 사각형에서 마우스 우클릭 > Path > Convert to Path 를 선택합니다.
(이것은~ 사각형, 즉 Rectangle을.. Path로 바꾸는 것입니다. )
11. Direct Selection
을 선택하면 사각형의 패스를 볼수가 있어요..
바로 아래와 같이 생겼다는 것을 알수가 있지요..
12. 자~ 화면을 좀 확대해 주세요 하얀코코는 300%로 확대하여 보고 있어요~
(컨트롤을 누른 상태에서 플러스를 눌르면 확대되고, 컨트롤을 누른상태에서 마이나스를 눌르면 축소되요~ ㅋ)
펜
을 선택하고 아래와 같이 저 아래 중간 지점을 클릭합니다. (점을 추가해 주는 것이에요~)
13.Direct Selection
을 선택하고 아래 그림과 같은 위치를 선택합니다.
(Ctrl을 누른 상태에서 클릭하면 두 지점을 동시에 선택 할 수가 있지요~)
그리고 Delete 키를 눌러요~
14. Direct Selection
을 선택하고 아래 그림과 같은 위치를 선택합니다.
그리고 키보드에 방향키중에 위로 올라가게 하는것을 조금씩 눌러서 위로 올려요 (선택한 점을요.. ㅋ)
15. 화면을 100%로 만들고
을 선택하고 아래와 같이 저 맨아래 점을 선택합니다.
Shift를 누른상태에서 아래 방향 방향키를 세번 눌러줍니다.
이제 날개 하나가 완성이 되었습니다.
16. 아래와 같이 날개를 4장으로 만들어주세요~
(선택하고 컨트롤 누르면서 끌면 복사되고 시프트 누르면 수평이동 되고 다 아시죠?? )
17. 아래 그림 처럼 하나를 선택 하고
각도를 -45로 줍니다.
그럼 아래처럼 바뀌어요~ ㅋ
18. 아래 그림처럼 각각의 날개에도 각도를 넣어주면 선풍기 4장의 날개가 되요.
너무 떨어져 있으면 아래와 같이 약간 간격을 두면서 모아 주세요~~ㅋ
19. 아래 그림처럼 날개 하나를 선택하고 그라데이션을 변경합니다. 한쪽은 흐린색 한쪽은 진한색으로요~
20. 그라데이션을 변경하지 않은 나머지 세장을 선택하고
아래처럼 처음에 그라데이션을 변경한 날개를 스포이드로 찍습니다.
(그러면 세장에 똑같이 변경한 그라데이션이 적용이 되요~ ㅋ)
21. 날개 네장을 이제 다 만들었으니깐.. 캔버스로 묶고 Fan이라고 이름을 줍니다~ (잠궈놓으면 더 좋아요~ㅋ)
자~ 다음회에 이어서 하겠습니다.
웨이브 모션 강좌를 올린지 벌써 일주일도 넘게 지났습니다.
이번꺼가 좀 오래걸렸습니다. 흑 ㅎㅎ
오늘은 위와 같은 선풍기를 만들어 볼게요~
이 선풍기의 특징은 켤때는 속도를 내면서 날개가 돌고 끄면 점차 도는 속도를 늦추면서 멈추는 것입니다.
시작합니다.
1.coolFan 이라는 이름으로 프로젝트를 생성합니다.
2. UserControl을 선택하고
 |
Width : 400 / Height : 550을 줍니다.
 |
3. 툴바에서 원
 |
 |
아래와 같은 원이 되었습니다.
 |
4. 사각형
 |
 |
5. 기둥 선택이 유지된 상태에서 스포이드
 |
 |
그러면 아래와 같이 선풍기 기둥에도 그 그라데이션이 그대로 적용이 됩니다.
 |
6. 아래와 같이 선풍기 기둥에서 마우스 우클릭 > Order > Send to Back을 선택하여 맨뒤로 보내줍니다.
 |
아니면 아래처럼 마우스를 잡고 위로 끌어당겨도 됩니다.
 |
 |
(끌어 당기기 전) (끌어 당긴 후)
7. 아래와 같이 선풍기의 기둥아래 굵은 기둥의 사각형을 만들어 줍니다.
 |
아래와 같이 세 개체를 모두 선택하고
 |
Object > Align > Horizontal Centers 를 선택하여 한줄로 딱 맞게 합니다.
 |
8. 아래와 같이 세 개체를 선택한 후 마우스 우클릭 > Group Into > Canvas 를 선택합니다.
 |
캔바스로 감싸지면
 |
이름을 body라고 줍니다.
 |
아래와 같이 선풍기 몸통 부분이 만들어졌습니다.(선풍기 몸통부분을 따로 나눠 놓은 것입니다.)
 |
아래와 같이 잠궈두겠습니다. 몸통은 이제 안 건드릴거니까요~ (눈도 안보이게 꺼놓으면 작업하기 더 편하고 좋아요 )
 |
자~ 이제 선풍기의 날개를 만들어 보겠습니다.
9. 사각형
|
 |
아래와 같은 사각형이 그려집니다.
 |
10. 아래와 같이 사각형에서 마우스 우클릭 > Path > Convert to Path 를 선택합니다.
(이것은~ 사각형, 즉 Rectangle을.. Path로 바꾸는 것입니다. )
 |
11. Direct Selection
 |
바로 아래와 같이 생겼다는 것을 알수가 있지요..
 |
12. 자~ 화면을 좀 확대해 주세요 하얀코코는 300%로 확대하여 보고 있어요~
(컨트롤을 누른 상태에서 플러스를 눌르면 확대되고, 컨트롤을 누른상태에서 마이나스를 눌르면 축소되요~ ㅋ)
 |
펜
 |
 |
13.Direct Selection
 |
(Ctrl을 누른 상태에서 클릭하면 두 지점을 동시에 선택 할 수가 있지요~)
 |
그리고 Delete 키를 눌러요~
 |
14. Direct Selection
|
 |
그리고 키보드에 방향키중에 위로 올라가게 하는것을 조금씩 눌러서 위로 올려요 (선택한 점을요.. ㅋ)
| * 여기서 주의 : 막 빨리 올리다가... 선택해서 올리고 있는 점이 선택되지 않은 위의 점과 겹치게 되면 블랜드가 에러가 나면서 퍽! 하고 꺼지는 경우가 발생합니다... 주의하세요 |
 |
15. 화면을 100%로 만들고
|
 |
Shift를 누른상태에서 아래 방향 방향키를 세번 눌러줍니다.
 |
이제 날개 하나가 완성이 되었습니다.
16. 아래와 같이 날개를 4장으로 만들어주세요~
(선택하고 컨트롤 누르면서 끌면 복사되고 시프트 누르면 수평이동 되고 다 아시죠?? )
 |
17. 아래 그림 처럼 하나를 선택 하고
 |
각도를 -45로 줍니다.
 |
그럼 아래처럼 바뀌어요~ ㅋ
 |
18. 아래 그림처럼 각각의 날개에도 각도를 넣어주면 선풍기 4장의 날개가 되요.
 |
너무 떨어져 있으면 아래와 같이 약간 간격을 두면서 모아 주세요~~ㅋ
 |
19. 아래 그림처럼 날개 하나를 선택하고 그라데이션을 변경합니다. 한쪽은 흐린색 한쪽은 진한색으로요~
 |
20. 그라데이션을 변경하지 않은 나머지 세장을 선택하고
 |
아래처럼 처음에 그라데이션을 변경한 날개를 스포이드로 찍습니다.
(그러면 세장에 똑같이 변경한 그라데이션이 적용이 되요~ ㅋ)
 |
21. 날개 네장을 이제 다 만들었으니깐.. 캔버스로 묶고 Fan이라고 이름을 줍니다~ (잠궈놓으면 더 좋아요~ㅋ)
 |
자~ 다음회에 이어서 하겠습니다.
댓글을 달아 주세요