TEACHER / UNIT 02
Ⅱ. GUI 프로그래밍 · 수업 요약
교과서 40–59쪽 · 도식 → 시연 → 학생 실험 → 설명 확인
50분 수업 운영 제안
| 단계 | 시간 | 교사 확인 |
|---|---|---|
| 도입·결과 예상 | 5분 | 정답 전에 입력·출력 예상 받기 |
| 구조 설명·시연 | 10분 | 도식과 코드의 각 부분 연결 |
| 학생 코드 변형 | 25분 | 정상·경계·오류 조건 확인 |
| 설명·저널 | 10분 | 결과 이유와 수정 근거 확인 |
평가 연결
| 항목 | 관찰할 증거 | 배점/연결 |
|---|---|---|
| 기능 구현·이벤트 처리 | 정상 입력·빈 값·취소·오류 복구 | 10점 |
| 모듈 구조·코드 품질 | 화면과 기능 분리·가독성 | 5점 |
| 저널 기록·제출 충실도 | 과정과 해결 근거·제출률 | 5점 |
교과서 대조·지도 유의사항
- 58쪽 4번의 사용자 정의 예외 표현은 보기의 GUI 사례와 맞지 않아 인터페이스 분류로 재작성했습니다.
- GUI의 문법 확인은 실제 창·버튼 동작 검증이 아닙니다. PC 시연을 별도로 확인합니다.
- PySide6는 교과서 tkinter 이후 확장 학습입니다. 확장 사용 자체를 별도 평가 요건으로 추가하지 않습니다.
- wxPython 부록은 본편 tkinter/PySide6를 대체하지 않습니다. 브라우저에는 wx가 없어 코드·캡처로 가르치고, 실제 창은 PC에서 확인합니다.
- 통합 프로젝트 · 두 GUI, 하나의 기능 모듈: 운영 계획의 수행①은 기능·이벤트 10점, 모듈 구조·코드 품질 5점, 저널 5점입니다. 이 사이트의 체크·연습 점수는 공식 성적이 아닙니다. PySide6 학습은 확장 경로이며 별도 평가 조건을 추가하지 않습니다.
- 2단원 마무리 · 개념에서 앱까지: 교과서 58쪽 4번의 "사용자 정의 예외" 표현은 보기 내용과 맞지 않습니다. 웹에서는 아이콘 클릭 사례의 인터페이스 유형을 판단하는 문제로 명확히 적었습니다.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 01. GUI 프로그래밍 개요 · 42–48쪽
소단원 01. 사용자 인터페이스 · 43–44쪽
이 웹 주제의 연계 범위: 40–44쪽
웹 학습 주제 01
사용자 인터페이스 · CLI, GUI, NUI
사용자가 어떤 행동으로 프로그램에 의도를 전달하나요?
사용자가 명령을 전달하는 방법
- 1사용자 의도
- 2인터페이스에서 입력
- 3프로그램 처리
- 4결과와 상태 표시
| 종류 | 입력 예 | 특징 |
|---|---|---|
| CLI | 명령어 타이핑 | 정확한 명령 필요 |
| GUI | 버튼 클릭 | 시각적으로 선택 |
| NUI | 음성·몸짓 | 자연스러운 상호작용 |
시연·발문·확인
발문: 사용자가 어떤 행동으로 프로그램에 의도를 전달하나요?
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 좋은 UI와 불편한 UI 사례를 한 가지씩 설명하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 01. GUI 프로그래밍 개요 · 42–48쪽
소단원 02. 파이썬 GUI · 45–46쪽
이 웹 주제의 연계 범위: 45–48쪽 + 보강
웹 학습 주제 02
GUI 라이브러리 비교 갤러리
같은 인사 앱을 여섯 가지 방식으로 비교하세요.
같은 앱, 다른 GUI 도구
- 1공통 기능이름 받아 인사
- 2화면 도구 선택
- 3위젯과 이벤트 연결
- 4실제 PC에서 비교
| 도구 | 화면 구성 | 학습 경로 |
|---|---|---|
| tkinter / ttk | Tk 위젯 / 테마 위젯 | 교과서 기본 |
| PySide6 / PyQt6 | Qt 위젯과 레이아웃 | 동일 개념 확장 |
| wxPython | OS 위젯 활용 | 데스크톱 비교 |
| Kivy | 자체 그리기 | 터치 UI 비교 |
시연·발문·확인
발문: 같은 인사 앱을 여섯 가지 방식으로 비교하세요.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 같은 앱을 학교 실습용과 터치 키오스크용으로 만들 때 선택 근거를 비교하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 02. GUI 프로그래밍 작성 · 49–57쪽
소단원 01. tkinter의 구성 요소 · 50–51쪽
이 웹 주제의 연계 범위: 50쪽
웹 학습 주제 03
창과 위젯 · 화면을 구성하는 부품
보여줄 정보와 받을 입력에 따라 위젯을 선택합니다.
위젯의 역할을 맞춰 보세요
- 1Entry / QLineEdit입력
- 2Button / QPushButton실행 요청
- 3Label / QLabel짧은 출력
- 4Text / QPlainTextEdit여러 줄
| 역할 | tkinter | PySide6 |
|---|---|---|
| 최상위 창 | Tk | QWidget / QMainWindow |
| 그룹 | Frame | QWidget + Layout |
| 입력 읽기 | entry.get() | edit.text() |
| 표시 바꾸기 | label.config(text=...) | label.setText(...) |
| 독립 선택 | Checkbutton + BooleanVar | QCheckBox.isChecked() |
| 그룹 중 하나 | Radiobutton + StringVar | QRadioButton / QButtonGroup |
| 목록·그리기 | Listbox / Canvas | QListWidget / QGraphicsView |
시연·발문·확인
발문: 보여줄 정보와 받을 입력에 따라 위젯을 선택합니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 회원 가입 화면의 이름·소개·약관 동의·학년 선택에 알맞은 위젯을 고르세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 02. GUI 프로그래밍 작성 · 49–57쪽
소단원 01. tkinter의 구성 요소 · 50–51쪽
이 웹 주제의 연계 범위: 51쪽 + 보강
웹 학습 주제 04
배치 관리자와 반응하는 화면
창을 늘렸을 때도 사용하기 좋은 화면을 만드세요.
좌표보다 배치 규칙을 먼저 정해요
- 1세로 묶음pack / QVBoxLayout
- 2가로 묶음pack(side) / QHBoxLayout
- 3행과 열grid / QGridLayout
| 선택 | 적합한 화면 | 확인할 것 |
|---|---|---|
| 세로·가로 배치 | 버튼 모음 | 순서와 늘어남 |
| 격자 배치 | 입력 폼 | 행·열 번호 |
| 고정 좌표 place | 정해진 위치 | 창 크기 변화에 취약 |
시연·발문·확인
발문: 창을 늘렸을 때도 사용하기 좋은 화면을 만드세요.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 창을 좁게·넓게 바꾸어 잘리는 요소를 찾으세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 02. GUI 프로그래밍 작성 · 49–57쪽
소단원 01. tkinter의 구성 요소 · 50–51쪽
중단원 02. GUI 프로그래밍 작성 · 49–57쪽
소단원 02. GUI 앱 개발 · 52–55쪽
이 웹 주제의 연계 범위: 51, 54쪽 + 보강
웹 학습 주제 05
이벤트 · 사용자의 행동에 반응하기
버튼 생성 시점과 클릭 시점은 다릅니다.
클릭은 함수를 예약한 뒤에 발생해요
- 11 연결command=hello
- 22 대기mainloop()
- 33 입력버튼 클릭
- 44 처리hello() 실행
| 코드 | 실행 시점 | 결과 |
|---|---|---|
| command=hello | 클릭할 때 | 함수를 전달 |
| command=hello() | 화면 만들 때 | 반환값을 전달 |
| bind("<Return>") | Enter 키를 눌렀을 때 | 키 이벤트와 함수 연결 |
| after(ms, fn) | 지정한 시간 뒤 | 이벤트 루프를 막지 않음 |
| clicked.connect(hello) | Qt 클릭할 때 | 시그널과 슬롯 연결 |
| textChanged | 입력이 바뀔 때 | 미리보기·검사 |
시연·발문·확인
발문: 버튼 생성 시점과 클릭 시점은 다릅니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 인사 버튼에 빈 이름을 넣어도 동작하도록 만드세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
중단원 02. GUI 프로그래밍 작성 · 49–57쪽
소단원 02. GUI 앱 개발 · 52–55쪽
이 웹 주제의 연계 범위: 52–55쪽
웹 학습 주제 06
교과서 메모장 · 여덟 단계로 완성
열기와 저장을 만드는 동안 1단원의 import와 함수가 다시 등장합니다.
열기·저장·취소의 분기
- 1파일 대화상자
- 2취소?화면 그대로
- 3경로 선택?UTF-8 읽기/쓰기
- 4내용과 상태 갱신
| 작업 | 입력 | 출력 |
|---|---|---|
| 열기 | 파일 경로 | Text 영역 내용 |
| 저장 | Text 영역 내용 | UTF-8 파일 |
| 취소 | 빈 경로 | 아무 파일도 변경 안 함 |
| 읽기 실패 | OSError | 오류 안내 |
시연·발문·확인
발문: 열기와 저장을 만드는 동안 1단원의 import와 함수가 다시 등장합니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 새 파일 저장, 기존 파일 열기, 대화 상자 취소를 각각 시험하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
추가 실습 · 교과서 밖 확장
이 웹 주제의 연계 범위: 확장 학습
웹 학습 주제 07
PySide6 시작과 Qt Designer
기본 위젯으로 익힌 개념을 Qt Widgets로 옮깁니다.
tkinter 개념을 Qt에 대응해요
- 1QApplication 생성
- 2위젯과 Layout 구성
- 3시그널 연결
- 4show → app.exec
| tkinter | PySide6 | 공통 개념 |
|---|---|---|
| Tk() | QApplication + QWidget | 앱과 창 |
| command=handler | clicked.connect(handler) | 이벤트 연결 |
| pack / grid | QVBoxLayout / QGridLayout | 배치 규칙 |
| mainloop() | app.exec() | 이벤트 루프 |
시연·발문·확인
발문: 기본 위젯으로 익힌 개념을 Qt Widgets로 옮깁니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: Designer의 objectName과 화면에 보이는 text가 다른 속성임을 확인하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
추가 실습 · 교과서 밖 확장
이 웹 주제의 연계 범위: 수행평가 연결쪽 + 확장
웹 학습 주제 08
통합 프로젝트 · 두 GUI, 하나의 기능 모듈
1단원의 패키지에 화면을 연결하여 앱을 완성합니다.
기능에서 완성 앱까지
- 1요구 기능 정하기
- 2기능 모듈 구현
- 3입력과 오류 시험
- 4화면 연결·기록
| 산출물 | 확인할 내용 |
|---|---|
| 기능 코드 | GUI 없이도 시험 가능 |
| 실행 결과 | 정상·빈 값·경계값 비교 |
| 학습 기록 | 오류 원인과 수정 근거 |
시연·발문·확인
발문: 1단원의 패키지에 화면을 연결하여 앱을 완성합니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 빈 입력, 0면 주사위, 잘못된 날짜, 중복 이름을 시험하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
마무리·종합 평가 연계
이 웹 주제의 연계 범위: 56–59쪽
웹 학습 주제 09
2단원 마무리 · 개념에서 앱까지
어떤 위젯을 왜 배치했고, 어떤 이벤트에 반응하는지 설명하세요.
한 단원, 세 가지 확인
- 1설명하기개념을 내 말로
- 2예상하기실행 전 결과 추적
- 3바꾸기조건 변경 후 검증
| 점검 | 질문 |
|---|---|
| 개념 | 왜 이 도구를 선택했나요? |
| 코드 | 입력과 출력은 무엇인가요? |
| 검증 | 조건을 바꾸어도 동작하나요? |
시연·발문·확인
발문: 어떤 위젯을 왜 배치했고, 어떤 이벤트에 반응하는지 설명하세요.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 예제 없이 창·버튼·콜백·이벤트 루프를 작성하세요.
대단원 Ⅱ. GUI 프로그래밍 교과서 40–59쪽
추가 실습 · 교과서 밖 확장
이 웹 주제의 연계 범위: 부록 · 확장 학습
웹 학습 주제 10
부록 · wxPython으로 같은 앱 다시 만들기
본편에서 익힌 창·위젯·배치·이벤트·메모장을 운영체제 위젯으로 옮깁니다.
본편 개념을 wxPython으로 옮기세요
- 1wx.App 생성
- 2Frame·Panel·Sizer 구성
- 3Bind로 이벤트 연결
- 4Show → MainLoop
| 역할 | tkinter | wxPython |
|---|---|---|
| 앱·창 | Tk() | wx.App() + wx.Frame |
| 설명 글 | Label | wx.StaticText |
| 한 줄 입력 | Entry | wx.TextCtrl |
| 여러 줄 | Text | wx.TextCtrl(TE_MULTILINE) |
| 버튼 클릭 | command= | Bind(EVT_BUTTON) |
| 배치 | pack / grid | BoxSizer / FlexGridSizer |
| 이벤트 루프 | mainloop() | MainLoop() |
시연·발문·확인
발문: 본편에서 익힌 창·위젯·배치·이벤트·메모장을 운영체제 위젯으로 옮깁니다.
시연: 연결 예제를 실행하기 전에 결과를 예상하게 하고 입력·조건 하나를 바꿔 비교합니다.
확인: 본편 위젯 하나를 골라 wx 이름을 짝 짓고, 값을 읽는 메서드를 적으세요.
인공지능 파이썬 실무