티스토리 뷰

C#(.NET)/WPF

WPF MVVM 7일만에 배우기 - 실습#1 (page)

열혈허슬러 상추님 2018.04.29 23:27

WPF MVVM 7일만에 배우기 - 실습#1 (page)

MainWindow

 WPF 일주일만에 끝내버리기 프로젝트.. 실습 넘버원 시작합니다.

 위 연습문제는 BikeShop(자전거가게(?))라는 WPF어플리케이션 생성후 Contact.xaml 페이지를 추가하여 나타내준 모습입니다.

 Contact.xaml 파일에는 TextBox 2개와 TextBlock 2개가 존재합니다. WPF에서는 Winform과는 다르게 텍스트 박스 옆 설명 Text 등을 입력할 때 Label을 사용하지 않고 TextBlock을 사용하는 것을 염두에 두시기 바랍니다.

 MainWindow에 Contact파일을 띄우면 됩니다.

Contact 재믈클릭시 원본크기로 볼 수 있음.

 우선 솔루션에 Contact 페이지를 추가해주고 해당 재믈파일에 드래그엔 드랍으로 위와같이 디자인 해줍니다. (전 괜히 막 만지다가 디자인 타임크기가 조절되는 바람에.. 모양이 좀 여백있습니다. 실행시엔 아무문제없으니 패스)

Auto Sizing

 그리고 텍스트박스를 눌러서 화살표 부분을 눌러서 자동 크기조절 설정을 해주시기바랍니다.

Wpf Pasing

 MainWindow.xaml 소스로가서 위와같이 Frame 설정을 해줍시다. 그럼 메인윈도실행시 우리가 아까 만들었떤 콘텍트페이지가 뜨는 것을 확인할 수 있습니다.

Complete

 그리고 실행해주게되면, 위와같이 이쁘게 완성된 것을 확인할 수 있습니다. 그리고 아까 자동설정을 해주었기에 창 조절이 되면 알아서 텍스트 박스 크기가 조절되는 것을 확인 할 수 있습니다. (C#코드는 전혀 안건드렸습니다.)

 여기까진 참 쉬운데 앞으로 계속 업그레이드를 하면서 실습이 진행되니 참고해 주세요.

BikeShop.zip

 소스파일을 첨부했으니 참고하시기 바랍니다.

사용된 주요문법
-Frame으로 페이지 추가
-자동크기조절

공유하기 링크
TAG
, ,
댓글
댓글쓰기 폼
네이버 이웃추가
«   2019/10   »
    1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31    
글 보관함