자습서: 그림 뷰어 Windows Forms 앱 만들기(.NET Framework)
이 세 자습서 시리즈에서는 그림을 로드하고 표시하는 Windows Forms 애플리케이션을 만듭니다. Visual Studio IDE(통합 디자인 환경)는 앱을 만드는 데 필요한 도구를 제공합니다.
이 첫 번째 자습서에서는 다음 방법을 알아봅니다.
- Windows Forms를 사용하는 Visual Studio 프로젝트 만들기
- 레이아웃 요소 추가
- 애플리케이션 실행
.NET을 사용하여 새 Windows Forms 앱을 만들려면 자습서 .NET사용하여 Windows Forms 앱 만들기를 수행합니다. 자세한 내용은 Windows Forms .NET 데스크톱 가이드를 참조하세요.
필수 구성 요소
- 이 자습서를 완료하려면 Visual Studio가 필요합니다. 무료 버전은 Visual Studio 다운로드 페이지 방문하세요.
- .NET 데스크톱 개발 워크로드입니다. Visual Studio에서 이 워크로드를 확인하거나 설치하려면 Tools>도구 및 기능 가져오기선택합니다. 자세한 내용은 워크로드 또는 개별 구성 요소 변경을 참조하세요.
Windows Forms 프로젝트 만들기
그림 뷰어를 만들 때 첫 번째 단계는 Windows Forms 앱 프로젝트를 만드는 것입니다.
Visual Studio를 엽니다.
시작 창에서 새 프로젝트 만들기선택합니다.
새 프로젝트 만들기 창에서 Windows Forms를 검색하세요. 그런 다음, Project 유형 목록에서 Desktop 선택합니다.
C# 또는 Visual Basic에 대한 Windows Forms 앱(.NET Framework) 템플릿을 선택한 다음, 다음 선택합니다.
새 프로젝트 구성 창에서 프로젝트를 PictureViewer로 이름 지정한 다음, 만들기를 선택합니다.
Visual Studio를 엽니다.
시작 창에서 새 프로젝트 만들기선택합니다.
새 프로젝트 만들기 창에서 Windows Forms를 검색하세요. 그런 다음, Project 유형 목록에서 Desktop 선택합니다.
C# 또는 Visual Basic에 대한 Windows Forms 앱(.NET Framework) 템플릿을 선택한 다음, 다음 선택합니다.
새 프로젝트 구성 창에서 프로젝트를 PictureViewer로 이름 지정한 다음, 만들기를 선택합니다.
Visual Studio는 앱에 대한 솔루션을 만듭니다. 솔루션은 앱에 필요한 모든 프로젝트 및 파일에 대한 컨테이너입니다.
이때 Visual Studio는 Windows Form Designer빈 폼을 표시합니다.
레이아웃 요소 추가
그림 보기 앱에는 이미지 상자, 확인란 및 4개의 버튼이 포함되어 있으며, 다음 자습서 에서 추가합니다. 레이아웃 요소는 폼에서 해당 위치를 제어합니다. 이 섹션에서는 양식의 제목을 변경하고, 폼의 크기를 조정하고, 레이아웃 요소를 추가하는 방법을 보여 줍니다.
프로젝트에서 Windows Forms 디자이너를 선택합니다. 탭은 C#의 경우 Form1.cs [디자인], Visual Basic의 경우 Form1.vb [디자인]로 표시됩니다.
Form1아무 곳이나 선택하세요.
이제 속성 창에 양식의 속성이 표시됩니다. 속성 창은 일반적으로 Visual Studio의 오른쪽 아래에 있습니다. 이 섹션에서는 전경색 및 배경색, 폼의 맨 위에 나타나는 제목 텍스트 및 폼의 크기와 같은 다양한 속성을 제어합니다.
속성표시되지 않으면 보기>속성 창선택합니다.
속성 창에서 Text 속성을 확인하세요. 목록을 정렬하는 방법에 따라 아래로 스크롤해야 할 수 있습니다. 값 그림 뷰어을 입력한 다음 입력을 선택합니다.
이제 양식의 제목 표시줄에 그림 뷰어 텍스트가 있습니다.
메모
범주별로 또는 사전순으로 속성을 표시할 수 있습니다. 속성 창의 단추를 사용하여 앞뒤로 전환합니다.
양식을 다시 선택합니다. 양식의 오른쪽 아래 모서리 끌기 핸들을 선택합니다. 폼의 오른쪽 아래 모서리에 있는 작은 흰색 사각형이 핸들입니다.
폼이 넓고 조금 더 커지도록 핸들을 끌어 폼의 크기를 조정합니다. 속성 창을 보면 Size 속성이 다릅니다. Size 속성을 변경하여 폼의 크기를 변경할 수도 있습니다.
Visual Studio IDE의 왼쪽에서 도구 상자 탭을 선택합니다. 표시되지 않으면 메뉴 모음에서 보기>도구 상자 선택하거나 Ctrl ++선택합니다.
컨테이너 옆에 있는 작은 삼각형 기호를 선택하여 그룹을 엽니다.
도구 상자에서 TableLayoutPanel을 두 번 클릭합니다. 도구 상자에서 폼으로 컨트롤을 끌 수도 있습니다. TableLayoutPanel 컨트롤이 양식에 나타납니다.
메모
TableLayoutPanel을 추가한 후 제목이 TableLayoutPanel 작업있는 양식 내에 창이 나타나면 양식 내의 아무 곳이나 선택하여 닫습니다.
TableLayoutPanel선택합니다. 속성 창을 확인하여 선택한 컨트롤을 확인할 수 있습니다.
TableLayoutPanel을 선택한 상태에서 Dock 속성을 찾아보세요. 이 속성의 값은 None입니다. 드롭다운 화살표를 선택한 다음 채우기선택합니다. 이 단추는 드롭다운 메뉴의 가운데에 있는 큰 단추입니다.
도킹 창이 다른 창이나 영역에 연결되는 방법을 나타냅니다.
이제 TableLayoutPanel이 전체 양식을 채웁니다. 폼의 크기를 다시 조정하면 TableLayoutPanel이 도킹된 상태로 유지되고 크기가 조정됩니다.
양식에서 TableLayoutPanel을 선택합니다. 오른쪽 위 모서리에는 작은 검은색 삼각형 단추가 있습니다.
삼각형을 선택하여 컨트롤의 작업 목록을 표시합니다.
행 및 열 편집 선택하여 열 및 행 스타일 대화 상자를 표시합니다.
column1 선택하고 크기를 15%로 설정합니다. 백분율 옵션이 선택되어 있는지 확인하십시오.
Column2 선택하고 85%로 설정합니다.
열 및 행 스타일 대화 상자 상단의 표시에서 행를 선택합니다. Row1 90%로 설정하고 Row2 10%로 설정합니다. 확인 선택하여 변경 내용을 저장합니다.
이제 TableLayoutPanel에 큰 위쪽 행, 작은 아래쪽 행, 작은 왼쪽 열 및 큰 오른쪽 열이 있습니다.
레이아웃이 완료되었습니다.
메모
애플리케이션을 실행하기 전에 모두 저장 도구 모음 단추를 선택하여 앱을 저장합니다. 또는 앱을 저장하려면 메뉴 모음에서 파일>모든 저장을 선택하거나 Ctrl 키를+Shift+S누릅니다. 초기에 자주 저장하는 것이 가장 좋습니다.
앱 실행
Windows Forms 앱 프로젝트를 만들 때 실행되는 프로그램을 빌드합니다. 이 단계에서는 그림 뷰어 앱이 많은 작업을 수행하지 않습니다. 지금은 제목 표시줄에 그림 뷰어 보여 주는 빈 창이 표시됩니다.
앱을 실행하려면 다음 단계를 수행합니다.
다음 방법 중 하나를 사용합니다.
- F5 키를 선택합니다.
- 메뉴 모음에서 디버그>디버깅 시작를 선택합니다.
- 도구 모음에서 시작 단추를 선택합니다.
Visual Studio에서 앱을 실행합니다. 제목 그림 뷰어 있는 창이 나타납니다.
Visual Studio IDE 도구 모음을 확인합니다. 애플리케이션을 실행할 때 도구 모음에 더 많은 단추가 표시됩니다. 이러한 단추를 사용하면 앱을 중지하고 시작하는 등의 작업을 수행할 수 있으며 오류를 추적하는 데 도움이 됩니다.
다음 방법 중 하나를 사용하여 앱을 중지합니다.
- 도구 모음에서 디버깅 중지 단추를 선택합니다.
- 메뉴 모음에서 디버그>디버깅 중지를 선택합니다.
- 키보드에서 Shift+F5입력합니다.
- 그림 뷰어 창의 위쪽 모서리에서 X 선택합니다.
Visual Studio IDE 내에서 앱을 실행할 때, 그것을 디버깅이라고 합니다. 애플리케이션을 실행하여 버그를 찾고 수정합니다. 동일한 절차에 따라 다른 프로그램을 실행하고 디버그합니다. 디버깅에 대한 자세한 내용은 먼저 디버거살펴보세요.
다음 단계
다음 자습서로 이동하여 그림 뷰어 프로그램에 컨트롤을 추가하는 방법을 알아봅니다.
자습서 2부: 그림 뷰어 컨트롤 추가