C# Windows Forms 강의 9편: TabControl과 ProgressBar

1. 강의 개요

이번 강의에서는 Windows Forms에서 제공하는 TabControl과 ProgressBar를 학습합니다.

• TabControl: 여러 페이지를 탭(Tab)으로 구분하여 사용자에게 콘텐츠를 구조적으로 표시.
• ProgressBar: 작업 진행 상태를 시각적으로 표시.

---

2. 학습 목표

1. TabControl을 사용해 여러 페이지를 구성하고 동작을 정의.
2. ProgressBar를 사용해 작업 진행 상태를 업데이트하는 방법 학습.
3. TabControl과 ProgressBar를 결합한 간단한 UI 설계.

---

3. TabControl (탭 컨트롤)

TabControl이란?

TabControl은 여러 페이지(TabPage)를 탭으로 나눠 하나의 화면에 구조적으로 표시할 수 있는 컨트롤입니다.

• 각 탭은 TabPage라는 컨테이너로 구성됩니다.
• 탭을 선택하면 해당 페이지가 표시됩니다.

주요 속성

속성 설명 예제

TabPages	TabControl에 포함된 TabPage 컬렉션	tabControl1.TabPages.Add(tabPage1);
SelectedIndex	현재 선택된 탭의 인덱스	int index = tabControl1.SelectedIndex;
Dock	부모 컨트롤에 대한 Dock 스타일 설정	tabControl1.Dock = DockStyle.Fill;

주요 이벤트

이벤트 설명 예제

SelectedIndexChanged

탭이 변경될 때 발생하는 이벤트

tabControl1.SelectedIndexChanged += TabControl1_SelectedIndexChanged;

---

4. ProgressBar (프로그레스바)

ProgressBar란?

ProgressBar는 작업의 진행 상태를 시각적으로 나타내는 컨트롤입니다.

• 파일 다운로드, 작업 처리 등 다양한 상황에서 사용됩니다.

주요 속성

속성 설명 예제

Minimum	ProgressBar의 최소값 설정	progressBar1.Minimum = 0;
Maximum	ProgressBar의 최대값 설정	progressBar1.Maximum = 100;
Value	ProgressBar의 현재 진행 값 설정	progressBar1.Value = 50;
Style	진행 스타일 설정 (Continuous 등)	progressBar1.Style = ProgressBarStyle.Marquee;

---

5. 실습: TabControl과 ProgressBar 사용하기

요구사항

1. TabControl에 "정보 입력" 탭과 "진행 상태" 탭을 추가.
2. "정보 입력" 탭: 사용자의 이름과 나이를 입력받는 UI 구성.
3. "진행 상태" 탭: ProgressBar로 작업 진행률을 표시하고, 버튼 클릭 시 진행률 증가.

---

폼 구성

컨트롤 타입 이름 텍스트 위치 크기

TabControl	tabControl1	(없음)	폼 중앙	부모 컨트롤에 Dock
TabPage	tabPage1	"정보 입력"	TabControl 내부	(자동 크기)
TabPage	tabPage2	"진행 상태"	TabControl 내부	(자동 크기)
Label (탭1)	lblName	"이름:"	(10, 20)	(100 x 20)
TextBox (탭1)	txtName	(비어 있음)	(120, 20)	(200 x 27)
Label (탭1)	lblAge	"나이:"	(10, 60)	(100 x 20)
TextBox (탭1)	txtAge	(비어 있음)	(120, 60)	(200 x 27)
ProgressBar (탭2)	progressBar1	(없음)	(10, 20)	(300 x 30)
Button (탭2)	btnIncrease	"진행률 증가"	(10, 70)	(150 x 30)

---

코드 작성

Form1.cs

using System;
using System.Windows.Forms;

namespace WindowsFormsApp1
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
            InitializeTabControl();
            InitializeProgressBar();
        }

        private void InitializeTabControl()
        {
            // TabPage1: 정보 입력
            tabPage1.Text = "정보 입력";
            tabPage1.Controls.Add(CreateLabel("이름:", 10, 20));
            tabPage1.Controls.Add(CreateTextBox("txtName", 120, 20));
            tabPage1.Controls.Add(CreateLabel("나이:", 10, 60));
            tabPage1.Controls.Add(CreateTextBox("txtAge", 120, 60));

            // TabPage2: 진행 상태
            tabPage2.Text = "진행 상태";
            tabPage2.Controls.Add(progressBar1);
            tabPage2.Controls.Add(btnIncrease);

            // TabControl 구성
            tabControl1.TabPages.Add(tabPage1);
            tabControl1.TabPages.Add(tabPage2);
        }

        private void InitializeProgressBar()
        {
            // ProgressBar 초기 설정
            progressBar1.Minimum = 0;
            progressBar1.Maximum = 100;
            progressBar1.Value = 0;

            // 버튼 클릭 이벤트 연결
            btnIncrease.Text = "진행률 증가";
            btnIncrease.Click += BtnIncrease_Click;
        }

        private void BtnIncrease_Click(object sender, EventArgs e)
        {
            // ProgressBar 진행률 증가
            if (progressBar1.Value < progressBar1.Maximum)
            {
                progressBar1.Value += 10;
                MessageBox.Show($"현재 진행률: {progressBar1.Value}%", "진행 상태");
            }
            else
            {
                MessageBox.Show("작업이 완료되었습니다!", "진행 완료");
            }
        }

        private Label CreateLabel(string text, int x, int y)
        {
            return new Label
            {
                Text = text,
                Location = new System.Drawing.Point(x, y),
                Size = new System.Drawing.Size(100, 20)
            };
        }

        private TextBox CreateTextBox(string name, int x, int y)
        {
            return new TextBox
            {
                Name = name,
                Location = new System.Drawing.Point(x, y),
                Size = new System.Drawing.Size(200, 27)
            };
        }
    }
}

---

6. 실행 결과

1. TabControl
   • "정보 입력" 탭: 이름과 나이를 입력받는 UI가 표시됩니다.
   • "진행 상태" 탭: ProgressBar와 "진행률 증가" 버튼이 표시됩니다.
2. ProgressBar
   • 버튼 클릭 시 진행률이 10%씩 증가합니다.
   • 진행률이 100%에 도달하면 "작업이 완료되었습니다!" 메시지가 출력됩니다.

---

7. 주요 개념 요약

1. TabControl은 여러 페이지를 탭 형태로 구성하여 사용자에게 콘텐츠를 구조적으로 제공.
2. ProgressBar는 작업 진행 상태를 시각적으로 표현하며, Value 속성을 통해 진행률을 제어.
3. TabControl과 ProgressBar를 결합하여 입력 및 작업 진행 상태를 표시하는 UI를 구성할 수 있음.