'블렌드디자인뷰'에 해당되는 글 1건

  1. 2010.03.29 Tip_블렌드 디자인 뷰 준비

블렌드에서는디자인 뷰’ 모드로 작업환경을 설정 할 수 있습니다. ‘디자인 사이즈’ 란 실제 실행했을 때 프로젝트의 레이아웃 사이즈와 달리 디자이너가 블렌드에서 작업을 수행하는 동안 임시로 보기 편하게 설정한 사이즈로 보여주는 것을 말합니다. ‘디자인 사이즈’의 사이즈는 실행 값으로 설정된 ‘실행 사이즈’ 와 전혀 관계가 없습니다.



01. 블랜드에서 [File] -[New Project] 메뉴를 클릭하여 실버라이트 애플리케이션 프로젝트를 생성합니다.
블렌드 화면의 왼쪽 하단 패널인 [Objects and Timeline] 패널의 [UserControl]을 클릭합니다. [Properties]-[Layout] 패널에 가로와 세로가 각각 640˟480으로 기본값이 설정되어 있는 것을 확인할 수 있습니다.




02. [Properties]-[Layout] 패널에서 정렬 속성인 [HorizontalAlignment]와 [VerticalAlignment]을 [Stretch]로 설정합니다. 이어서 [Width]와 [Height]의 [Set to Auto] 버튼을 클릭하여 캔버스의 가로세로 크기를 자동으로 설정합니다.



03. [Width]와 [Height]가 각각Auto(0)’으로 설정되면 유저컨트롤 위에 커서를 올려 커서가 화살표 모양으로 변경되면 드래그하여 캔버스의 크기를 늘립니다.



04. 디자인 뷰의 공간을 만든다음 [Projects]-[Objects and Timeline] 패널의 [LayoutRoot]를 클릭하여 선택하고 [Properties]-[Brushes] 패널에서 [Background]의 색상을 연두색(#FF7DFF00)으로 설정합니다.
<F5>를 눌러 웹 브라우저를 실행합니다. 브라우저의 전체 화면이 연두색(#FF7DFF00)으로 바뀌었습니다. 캔버스 크기를 특정 사이즈로 설정하지 않고 정렬 속성을 전체로 설정하여 실행 화면이 꽉 차 보입니다.


05. [Split] 버튼을 클릭하여 제물(XAML) 코드를 살펴보면 [DesignWidth]와 [DesignHeight] 코드가 보입니다. 유저컨트롤 가로세로 크기가 오토 설정일 경우, 크기가 없으므로 레이아웃의 모서리를 드래그하여 실제 사이즈가 아닌 작업 시에만 적용하는 ‘디자인 사이즈’로 작업 환경이 설정되었습니다.



 

 

 

 

 


Posted by 도온

티스토리 툴바