파이썬 GUI의 고뇌

파이썬의 쉬운 난이도에 비해 GUI를 만들 때는 막막함을 느낀다.

가장 많이 사용되는 GUI 라이브러리 중 하나인 tkinter와 pyqt는 쉽고 빠르게 데스크톱 애플리케이션의 사용자 인터페이스를 구현할 수 있도록 다양한 위젯과 플랫폼 간 호환성을 제공한다.

tkinter	tkinter	pyqt

그러나 이들로 쌈뽕한 UI를 만들기엔 역부족이다. 그래서 매번 GUI 프로젝트를 맡을 때마다 새로운 GUI 라이브러리를 찾아 헤매는 여정을 떠나다가, 그냥 포기해버린 적도 빈번하다.

긴 여정 끝에, 기존의 tkinter와 거의 유사한 방식으로 GUI를 쌈뽕하게 만들 수 있는 CustomTkinter 프로젝트를 찾게 되었다. 비교적 새로운 라이브러리이지만, tkinter에 익숙하다면 공식 튜토리얼을 통해 손쉽게 익힐 수 있을 것이다.

아직 공식 튜토리얼을 한국어로 번역한 글이 없기에, 공부하면서 이를 직접 번역해보았다.

출처:공식 홈페이지

설치 방법과 다양한 예제는 공식 홈페이지에서 확인할 수 있다.

---

개요

CustomTkinter는 Tkinter를 기반으로 한 파이썬 데스크탑 UI 라이브러리로, 현대적이고 완전한 커스터마이징이 가능한 위젯을 제공합니다. CustomTkinter를 사용하면 모든 데스크탑 플랫폼(Windows, macOS, Linux)에서 일관된 UI를 구현할 수 있습니다.

---

import customtkinter

def button_callback():
    print("button clicked")

app = customtkinter.CTk()
app.geometry("400x150")

button = customtkinter.CTkButton(app, text="my button", command=button_callback)
button.pack(padx=20, pady=20)

app.mainloop()

몇 줄의 코드만으로도 완전히 작동하는 프로그램을 만들 수 있습니다:

---

튜토리얼

CustomTkinter의 공식 튜토리얼 섹션으로, 라이브러리의 주요 기능을 강조하는 초급 및 고급 튜토리얼을 확인할 수 있습니다. 이 튜토리얼 섹션은 라이브러리의 전체 개요를 제공하는 것이 목적은 아니며, 앞으로 더 많은 튜토리얼이 추가될 예정입니다.

초심자 튜토리얼

그리드(Grid) 지오메트리 시스템에 익숙해지고, 프레임과 스크롤 가능한 프레임을 만들고, 프레임을 기반으로 재사용 가능한 컴포넌트를 만들어보세요.

1. Grid System

기본 앱

우선, 최신 버전의 CustomTkinter가 설치되어 있는지 확인하세요. 그런 다음, 다음과 같은 가장 기본적인 프로그램으로 설치가 제대로 되었는지 테스트할 수 있습니다. 이 프로그램은 단순히 창을 만듭니다:

import customtkinter

app = customtkinter.CTk()
app.mainloop()

이 프로그램이 정상적으로 작동한다면, 창의 제목과 크기(geometry) 등의 속성을 설정하고 버튼을 추가하기 시작할 수 있습니다. 모든 위젯의 첫 번째 매개변수는 master 매개변수이며, 이 경우에는 app이 됩니다. 또한 키워드 인수로도 전달할 수 있습니다(master=app).

import customtkinter

def button_callback():
    print("button pressed")

app = customtkinter.CTk()
app.title("my app")
app.geometry("400x150")

button = customtkinter.CTkButton(app, text="my button", command=button_callback)
button.grid(row=0, column=0, padx=20, pady=20)

app.mainloop()

---

버튼 중앙 배치

Grid 지오메트리 관리자

이 예제에서는 위젯의 위치와 패딩을 설정하기 위해 그리드 지오메트리 관리자를 사용합니다. place나 pack 대신 grid 지오메트리 관리자를 사용하는 것이 좋습니다. 이는 반응형이고 확장 가능한 사용자 인터페이스를 쉽게 만들 수 있기 때문입니다.

그리드는 창 또는 프레임을 열과 행으로 나누며, 빈 열이나 행은 자동으로 축소되지만, 그 안에 배치된 위젯의 크기에 맞춰 조정됩니다. 이전 예제에서 버튼을 가운데로 배치하려면 첫 번째 열에 0이 아닌 weight 값을 부여해야 합니다. 그렇지 않으면 열이 버튼의 크기로 축소됩니다(grid_rowconfigure()를 사용하여 행도 설정할 수 있습니다):

app.grid_columnconfigure(0, weight=1)

이제 열 0이 weight=1로 설정되었기 때문에 창 전체에 걸쳐 확장됩니다. 또한, 그리드 셀과 버튼이 함께 확장되도록 하려면 sticky 인수를 grid 호출에 추가해야 합니다:

button.grid(row=0, column=0, padx=20, pady=20, sticky="ew")

이제 버튼이 동쪽과 서쪽에 있는 그리드 셀에 고정됩니다. 창 크기를 조정하면 그리드 셀과 버튼 크기가 자동으로 조정되는 것을 볼 수 있습니다.

---

체크박스 추가

레이아웃을 조금 더 복잡하게 만들기 위해 두 번째 행에 두 개의 체크박스를 추가해보겠습니다:

checkbox_1 = customtkinter.CTkCheckBox(app, text="checkbox 1")
checkbox_1.grid(row=1, column=0, padx=20, pady=(0, 20), sticky="w")
checkbox_2 = customtkinter.CTkCheckBox(app, text="checkbox 2")
checkbox_2.grid(row=1, column=1, padx=20, pady=(0, 20), sticky="w")

여기서 pady 인수는 튜플을 받습니다. 이 튜플은 위쪽에는 0, 아래쪽에는 20의 패딩을 설정한다는 뜻입니다. 또한 체크박스는 그리드 셀의 서쪽에만 고정됩니다. 버튼이 다시 창 전체에 걸쳐 확장되도록 하려면 columnspan=2를 설정해야 합니다(rowspan은 행에 적용됩니다).

button.grid(row=0, column=0, padx=20, pady=20, sticky="ew", columnspan=2)

그리고 체크박스를 동일한 간격으로 배치하려면 두 열 모두 동일한 weight 값을 줘야 합니다:

app.grid_columnconfigure((0, 1), weight=1)

이제 전체 프로그램은 다음과 같이 보입니다:

def button_callback():
    print("button pressed")

app = customtkinter.CTk()
app.title("my app")
app.geometry("400x150")
app.grid_columnconfigure((0), weight=1)

button = customtkinter.CTkButton(app, text="my button", command=button_callback)
button.grid(row=0, column=0, padx=20, pady=20, sticky="ew", columnspan=2)
checkbox_1 = customtkinter.CTkCheckBox(app, text="checkbox 1")
checkbox_1.grid(row=1, column=0, padx=20, pady=(0, 20), sticky="w")
checkbox_2 = customtkinter.CTkCheckBox(app, text="checkbox 2")
checkbox_2.grid(row=1, column=1, padx=20, pady=(0, 20), sticky="w")

app.mainloop()

---

클래스 사용

마지막으로, 이 프로그램을 클래스 구조로 재구성해보겠습니다. CTk에서 상속받은 클래스나 CTkFrame을 사용하는 것이 코드의 가독성을 높이고 확장성을 쉽게 만드는 데 도움이 되기 때문에 권장됩니다. 클래스를 사용하면 코드를 여러 파일로 나누기도 쉬워집니다.

주의: 소규모 프로그램이나 테스트가 아니라면, 항상 CTk, CTkToplevel, CTkFrame에 대해 별도의 클래스를 생성하세요. 클래스를 사용하지 않고 많은 UI 코드를 한 파일에 작성하는 것은 읽기 힘들고 좋지 않은 코딩 스타일입니다.

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x150")
        self.grid_columnconfigure((0, 1), weight=1)

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=0, column=0, padx=20, pady=20, sticky="ew", columnspan=2)
        self.checkbox_1 = customtkinter.CTkCheckBox(self, text="checkbox 1")
        self.checkbox_1.grid(row=1, column=0, padx=20, pady=(0, 20), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=1, padx=20, pady=(0, 20), sticky="w")
        
    def button_callback(self):
        print("button pressed")

app = App()
app.mainloop()

이제 프로그램은 클래스로 구조화되어 더욱 확장 가능하고, 유지보수하기도 쉬워졌습니다.

---

2. Using Frames

프레임 생성하기

인트로와 유사한 예제로 시작하여, 버튼과 몇 개의 체크박스가 포함된 창을 만들어 봅시다:

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x180")
        self.grid_columnconfigure(0, weight=1)
        self.grid_rowconfigure((0, 1), weight=1)

        self.checkbox_1 = customtkinter.CTkCheckBox(self, text="checkbox 1")
        self.checkbox_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=0, padx=10, pady=(10, 0), sticky="w")
        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew")

    def button_callback(self):
        print("button pressed")

app = App()
app.mainloop()

만약 2행에 체크박스를 하나 더 추가하려고 한다면, 버튼의 행 번호도 변경해야 합니다. 이처럼 레이아웃 변경이 필요한 경우, 영향을 줄이기 위해 프레임을 사용하여 구조를 정리합니다.

프레임을 0행에, 버튼을 1행에 배치하고, 0행과 0열이 확장되도록 설정합니다. 프레임에는 sticky 매개변수를 'nsw'로 설정하여 셀에서 북쪽, 남쪽, 서쪽으로 확장되게 합니다. 이제 체크박스의 master 인수는 self 대신 프레임이 됩니다.

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x180")
        self.grid_columnconfigure(0, weight=1)
        self.grid_rowconfigure(0, weight=1)

        self.checkbox_frame = customtkinter.CTkFrame(self)
        self.checkbox_frame.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsw")
        self.checkbox_1 = customtkinter.CTkCheckBox(self.checkbox_frame, text="checkbox 1")
        self.checkbox_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self.checkbox_frame, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=0, padx=10, pady=(10, 0), sticky="w")

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew")

    def button_callback(self):
        print("button pressed")

---

클래스 사용하기

그리고 코드의 레이아웃을 반영하고, 서두에서 언급된 항상 클래스를 사용하는 원칙을 따르기 위해, 프레임과 체크박스 코드를 별도의 클래스로 이동할 것입니다. 이 클래스는 CTkFrame을 상속하며, 메인 App 클래스에서 이 클래스의 인스턴스가 생성됩니다. __init__ 메서드에는 master 인자만 전달되어, 상위 클래스인 CTkFrame의 __init__에 전달될 수 있도록 할 것입니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master):
        super().__init__(master)

        self.checkbox_1 = customtkinter.CTkCheckBox(self, text="checkbox 1")
        self.checkbox_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=0, padx=10, pady=(10, 0), sticky="w")

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x180")
        self.grid_columnconfigure(0, weight=1)
        self.grid_rowconfigure(0, weight=1)

        self.checkbox_frame = MyCheckboxFrame(self)
        self.checkbox_frame.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsw")

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew")

    def button_callback(self):
        print("button pressed")

app = App()
app.mainloop()

이제 MyCheckboxFrame 클래스에 체크박스를 추가해도 버튼의 레이아웃에는 영향을 주지 않습니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master):
        super().__init__(master)

        self.checkbox_1 = customtkinter.CTkCheckBox(self, text="checkbox 1")
        self.checkbox_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_3 = customtkinter.CTkCheckBox(self, text="checkbox 3")
        self.checkbox_3.grid(row=2, column=0, padx=10, pady=(10, 0), sticky="w")

---

프레임 클래스 확장하기

물론 메인 App 클래스에서 체크박스의 값을 읽을 수 있는 방법이 필요합니다. 따라서 MyCheckboxFrame 클래스에 get 메서드를 구현하여, 체크된 체크박스의 text 속성을 문자열 리스트로 반환하도록 할 것입니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master):
        super().__init__(master)

        self.checkbox_1 = customtkinter.CTkCheckBox(self, text="checkbox 1")
        self.checkbox_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_2 = customtkinter.CTkCheckBox(self, text="checkbox 2")
        self.checkbox_2.grid(row=1, column=0, padx=10, pady=(10, 0), sticky="w")
        self.checkbox_3 = customtkinter.CTkCheckBox(self, text="checkbox 3")
        self.checkbox_3.grid(row=2, column=0, padx=10, pady=(10, 0), sticky="w")
        
    def get(self):
        checked_checkboxes = []
        if self.checkbox_1.get() == 1:
            checked_checkboxes.append(self.checkbox_1.cget("text"))
        if self.checkbox_2.get() == 1:
            checked_checkboxes.append(self.checkbox_2.cget("text"))
        if self.checkbox_3.get() == 1:
            checked_checkboxes.append(self.checkbox_3.cget("text"))
        return checked_checkboxes

App 클래스의 button_callback 메서드에서 이 메서드를 사용하여 체크된 체크박스 목록을 출력할 수 있습니다.

    def button_callback(self):
        print("checked checkboxes:", self.checkbox_frame.get())

이제 버튼을 누르면, 다음과 같은 선택된 체크박스의 목록이 출력되는 것을 확인할 수 있습니다.

checked checkboxes: ['checkbox 1', 'checkbox 3']

---

동적 프레임 클래스

하지만 현재 MyCheckboxFrame의 체크박스 값들은 코드에 하드코딩되어 있습니다. MyCheckboxFrame 클래스를 보다 동적으로 사용할 수 있도록, 체크박스의 text 값이 될 문자열 리스트를 MyCheckboxFrame에 전달할 것입니다. 이제 체크박스의 개수도 임의로 설정할 수 있습니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master, values):
        super().__init__(master)
        self.values = values
        self.checkboxes = []

        for i, value in enumerate(self.values):
            checkbox = customtkinter.CTkCheckBox(self, text=value)
            checkbox.grid(row=i, column=0, padx=10, pady=(10, 0), sticky="w")
            self.checkboxes.append(checkbox)

    def get(self):
        checked_checkboxes = []
        for checkbox in self.checkboxes:
            if checkbox.get() == 1:
                checked_checkboxes.append(checkbox.cget("text"))
        return checked_checkboxes

체크박스들은 for 루프에서 생성되어 checkboxes라는 리스트에 저장됩니다. get 메서드에서는 이 리스트를 반복하여 어떤 체크박스가 선택되었는지 확인하고, 해당 text 값을 반환할 수 있습니다. 이제 MyCheckboxFrame의 인스턴스를 생성하는 App 클래스에서는 값 리스트를 전달해야 합니다.

self.checkbox_frame = MyCheckboxFrame(self, values=["value 1", "value 2", "value 3"])
self.checkbox_frame.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsw")

---

다중 인스턴스 생성하기

이제 체크박스의 값을 동적으로 제어할 수 있게 되었으므로, MyCheckboxFrame 클래스의 인스턴스를 두 개 이상 매우 쉽게 생성할 수 있습니다. 버튼에는 columnspan을 2로 지정하고, 1번 열에 가중치 1을 추가해야 합니다.

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x180")
        self.grid_columnconfigure((0, 1), weight=1)
        self.grid_rowconfigure(0, weight=1)

        self.checkbox_frame_1 = MyCheckboxFrame(self, values=["value 1", "value 2", "value 3"])
        self.checkbox_frame_1.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsew")
        self.checkbox_frame_2 = MyCheckboxFrame(self, values=["option 1", "option 2"])
        self.checkbox_frame_2.grid(row=0, column=1, padx=(0, 10), pady=(10, 0), sticky="nsew")

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew", columnspan=2)

    def button_callback(self):
        print("checkbox_frame_1:", self.checkbox_frame_1.get())
        print("checkbox_frame_2:", self.checkbox_frame_2.get())

버튼을 눌렀을 때의 출력:

checkbox_frame_1: ['value 1', 'value 3']
checkbox_frame_2: ['option 2']

---

프레임에 제목 추가하기

MyCheckboxFrame 클래스에 프레임의 제목 역할을 하는 레이블을 추가하여 더욱 향상시킬 수 있습니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master, title, values):
        super().__init__(master)
        self.grid_columnconfigure(0, weight=1)
        self.values = values
        self.title = title
        self.checkboxes = []

        self.title = customtkinter.CTkLabel(self, text=self.title, fg_color="gray30", corner_radius=6)
        self.title.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="ew")

        for i, value in enumerate(self.values):
            checkbox = customtkinter.CTkCheckBox(self, text=value)
            checkbox.grid(row=i+1, column=0, padx=10, pady=(10, 0), sticky="w")
            self.checkboxes.append(checkbox)

    def get(self):
        checked_checkboxes = []
        for checkbox in self.checkboxes:
            if checkbox.get() == 1:
                checked_checkboxes.append(checkbox.cget("text"))
        return checked_checkboxes

이제 프레임 내부의 0번 열에 가중치 1이 설정되어 있으므로, 레이블의 sticky 값을 'ew'로 지정하여 레이블이 프레임 전체에 걸쳐 확장됩니다. CTkLabel에는 fg_color와 corner_radius 인자를 전달했는데, 기본적으로 레이블이 '투명'이며 corner_radius 값이 0이기 때문입니다. 또한, 첫 번째 행에 제목 레이블이 추가되었기 때문에 그리드 행 위치는 이제 i+1이 됩니다.

이제 App 클래스에서 MyCheckboxFrame 인스턴스를 생성할 때 제목에 해당하는 title 매개변수의 값을 전달해야 합니다.

self.checkbox_frame_1 = MyCheckboxFrame(self, "Values", values=["value 1", "value 2", "value 3"])

self.checkbox_frame_2 = MyCheckboxFrame(self, "Options", values=["option 1", "option 2"])

창의 높이를 220px로 증가시키면 다음과 같은 결과를 얻습니다:

이제 체크박스 프레임에 제목이 생겼습니다. 그리고 MyCheckboxFrame은 CTkFrame을 상속하므로, 예를 들어 투명한 fg_color와 같이 CTkFrame처럼 구성할 수 있습니다.

self.checkbox_frame_2.configure(fg_color="transparent")

---

라디오버튼 프레임

MyCheckboxFrame과 유사하게, 체크박스 대신 라디오 버튼으로 구성된 MyRadiobuttonFrame을 만들 수 있습니다.

class MyRadiobuttonFrame(customtkinter.CTkFrame):
    def __init__(self, master, title, values):
        super().__init__(master)
        self.grid_columnconfigure(0, weight=1)
        self.values = values
        self.title = title
        self.radiobuttons = []
        self.variable = customtkinter.StringVar(value="")

        self.title = customtkinter.CTkLabel(self, text=self.title, fg_color="gray30", corner_radius=6)
        self.title.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="ew")

        for i, value in enumerate(self.values):
            radiobutton = customtkinter.CTkRadioButton(self, text=value, value=value, variable=self.variable)
            radiobutton.grid(row=i + 1, column=0, padx=10, pady=(10, 0), sticky="w")
            self.radiobuttons.append(radiobutton)

    def get(self):
        return self.variable.get()

    def set(self, value):
        self.variable.set(value)

그리고 App에서 MyCheckboxFrame과 유사하게 MyRadiobuttonFrame의 인스턴스를 생성합니다.

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x220")
        self.grid_columnconfigure((0, 1), weight=1)
        self.grid_rowconfigure(0, weight=1)

        self.checkbox_frame = MyCheckboxFrame(self, "Values", values=["value 1", "value 2", "value 3"])
        self.checkbox_frame.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsew")
        self.radiobutton_frame = MyRadiobuttonFrame(self, "Options", values=["option 1", "option 2"])
        self.radiobutton_frame.grid(row=0, column=1, padx=(0, 10), pady=(10, 0), sticky="nsew")

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew", columnspan=2)

    def button_callback(self):
        print("checkbox_frame:", self.checkbox_frame.get())
        print("radiobutton_frame:", self.radiobutton_frame.get())

이제 사용자로부터 입력을 받을 수 있는 두 개의 동적으로 생성된 서로 다른 프레임이 생겼습니다.

---

3. Scrollable frames

프레임 내 체크박스

이전 챕터에서 우리는 주어진 값 목록에 대해 체크박스를 생성하는 다음 프레임을 만들었습니다.

class MyCheckboxFrame(customtkinter.CTkFrame):
    def __init__(self, master, values):
        super().__init__(master)
        self.values = values
        self.checkboxes = []

        for i, value in enumerate(self.values):
            checkbox = customtkinter.CTkCheckBox(self, text=value)
            checkbox.grid(row=i, column=0, padx=10, pady=(10, 0), sticky="w")
            self.checkboxes.append(checkbox)

    def get(self):
        checked_checkboxes = []
        for checkbox in self.checkboxes:
            if checkbox.get() == 1:
                checked_checkboxes.append(checkbox.cget("text"))
        return checked_checkboxes

---

스크롤 가능한 프레임

레이아웃이나 화면에 공간이 부족하여 더 많은 체크박스를 표시하려면, 스크롤 가능한 프레임을 사용할 수 있습니다. CTkScrollableFrame은 스크롤바를 자동으로 추가하여 프레임 내부에 실제로 들어가는 것보다 더 많은 위젯을 추가할 수 있게 해줍니다. 프레임은 내부 위젯이 늘어나더라도 확장되지 않습니다. CTkScrollableFrame에는 제목 옵션도 있어서, label_text 인자를 통해 위의 예제에서 수동으로 만든 것처럼 제목 레이블에 대한 텍스트를 전달할 수 있습니다.

class MyScrollableCheckboxFrame(customtkinter.CTkScrollableFrame):
    def __init__(self, master, title, values):
        super().__init__(master, label_text=title)
        self.grid_columnconfigure(0, weight=1)
        self.values = values
        self.checkboxes = []

        for i, value in enumerate(self.values):
            checkbox = customtkinter.CTkCheckBox(self, text=value)
            checkbox.grid(row=i, column=0, padx=10, pady=(10, 0), sticky="w")
            self.checkboxes.append(checkbox)

    def get(self):
        checked_checkboxes = []
        for checkbox in self.checkboxes:
            if checkbox.get() == 1:
                checked_checkboxes.append(checkbox.cget("text"))
        return checked_checkboxes

이제 App 클래스에서 MyScrollableCheckboxFrame의 인스턴스를 생성하고 더 많은 값을 추가하여 스크롤바 기능을 테스트할 수 있습니다.

class App(customtkinter.CTk):
    def __init__(self):
        super().__init__()

        self.title("my app")
        self.geometry("400x220")
        self.grid_columnconfigure(0, weight=1)
        self.grid_rowconfigure(0, weight=1)

        values = ["value 1", "value 2", "value 3", "value 4", "value 5", "value 6"]
        self.scrollable_checkbox_frame = MyScrollableCheckboxFrame(self, title="Values", values=values)
        self.scrollable_checkbox_frame.grid(row=0, column=0, padx=10, pady=(10, 0), sticky="nsew")

        self.button = customtkinter.CTkButton(self, text="my button", command=self.button_callback)
        self.button.grid(row=3, column=0, padx=10, pady=10, sticky="ew", columnspan=2)

    def button_callback(self):
        print("checkbox_frame:", self.checkbox_frame.get())
        print("radiobutton_frame:", self.radiobutton_frame.get())

app = App()
app.mainloop()

스크롤 가능한 프레임에 대한 더 많은 예제는 GitHub의 다음 예제 프로그램에서 찾을 수 있습니다: https://github.com/TomSchimansky/CustomTkinter/blob/master/examples/scrollable_frame_example.py

---

고급 튜토리얼

새 위젯을 만들고 더 복잡한 UI를 구성하는 방법에 대한 고급 튜토리얼입니다.

스핀박스 생성하기

프레임에서 위젯 생성하기

CustomTkinter에 구현되지 않은 기능이 필요해서 직접 새로운 위젯을 만들고자 한다면, 쉽게 할 수 있습니다. 아래에서는 float 값을 기반으로 한 Spinbox를 생성하는 예제를 보여드리겠습니다.

먼저 customtkinter.CTkFrame을 상속하는 새로운 클래스를 생성합니다.

import customtkinter

class WidgetName(customtkinter.CTkFrame):
    def __init__(self, *args,
                 width: int = 100,
                 height: int = 32,
                 **kwargs):
        super().__init__(*args, width=width, height=height, **kwargs)

이렇게 하면 기본적으로 width와 height 속성의 기본값에 의해 지정된 크기를 가진 위젯이 생성됩니다. 또한 fg_color나 corner_radius와 같은 CTkFrame의 모든 속성도 지원합니다.

---

프레임에서 스핀박스 생성하기

float 기반의 스핀박스를 간단하게 구현한 예시는 다음과 같을 수 있습니다.

class FloatSpinbox(customtkinter.CTkFrame):
    def __init__(self, *args,
                 width: int = 100,
                 height: int = 32,
                 step_size: Union[int, float] = 1,
                 command: Callable = None,
                 **kwargs):
        super().__init__(*args, width=width, height=height, **kwargs)

        self.step_size = step_size
        self.command = command

        self.configure(fg_color=("gray78", "gray28"))  # set frame color

        self.grid_columnconfigure((0, 2), weight=0)  # buttons don't expand
        self.grid_columnconfigure(1, weight=1)  # entry expands

        self.subtract_button = customtkinter.CTkButton(self, text="-", width=height-6, height=height-6,
                                                       command=self.subtract_button_callback)
        self.subtract_button.grid(row=0, column=0, padx=(3, 0), pady=3)

        self.entry = customtkinter.CTkEntry(self, width=width-(2*height), height=height-6, border_width=0)
        self.entry.grid(row=0, column=1, columnspan=1, padx=3, pady=3, sticky="ew")

        self.add_button = customtkinter.CTkButton(self, text="+", width=height-6, height=height-6,
                                                  command=self.add_button_callback)
        self.add_button.grid(row=0, column=2, padx=(0, 3), pady=3)

        # default value
        self.entry.insert(0, "0.0")

    def add_button_callback(self):
        if self.command is not None:
            self.command()
        try:
            value = float(self.entry.get()) + self.step_size
            self.entry.delete(0, "end")
            self.entry.insert(0, value)
        except ValueError:
            return

    def subtract_button_callback(self):
        if self.command is not None:
            self.command()
        try:
            value = float(self.entry.get()) - self.step_size
            self.entry.delete(0, "end")
            self.entry.insert(0, value)
        except ValueError:
            return

    def get(self) -> Union[float, None]:
        try:
            return float(self.entry.get())
        except ValueError:
            return None

    def set(self, value: float):
        self.entry.delete(0, "end")
        self.entry.insert(0, str(float(value)))

물론 configure 메서드나 __init__ 메서드에서 색상을 설정할 수 있는 더 많은 속성을 추가할 수도 있습니다.

하지만 위 구현을 통해 스핀박스를 다음과 같이 사용할 수 있습니다.

app = customtkinter.CTk()

spinbox_1 = FloatSpinbox(app, width=150, step_size=3)
spinbox_1.pack(padx=20, pady=20)

spinbox_1.set(35)
print(spinbox_1.get())

app.mainloop()

---