home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Python

วิธีเพิ่ม Scrollbar แนวตั้งใน Tkinter Text Widget

Widget Scrollbar ใน Tkinter เป็นเครื่องมือสำคัญสำหรับการแสดงข้อมูลจำนวนมากในพื้นที่จำกัด โดยเฉพาะ Text Widget ที่ใช้สำหรับข้อความหลายบรรทัด

หลักการเชื่อม Scrollbar กับ Text Widget

การเชื่อมต่อ Scrollbar กับ Text Widget ต้องกำหนด 2 ทาง:

  1. Text → Scrollbar: ใช้ yscrollcommand=scrollbar.set บอก Scrollbar ว่าเนื้อหาเลื่อนไปแล้ว
  2. Scrollbar → Text: ใช้ command=text.yview ให้ Scrollbar ควบคุมการเลื่อนของ Text

ตัวอย่างโค้ด

import tkinter as tk
from tkinter import ttk

root = tk.Tk()
root.title("Text Widget with Vertical Scrollbar")
root.geometry("600x400")

# สร้าง Frame หลัก
main_frame = ttk.Frame(root)
main_frame.pack(fill="both", expand=True, padx=10, pady=10)

# สร้าง Scrollbar แนวตั้ง
scrollbar = ttk.Scrollbar(main_frame, orient="vertical")
scrollbar.pack(side="right", fill="y")

# สร้าง Text Widget และเชื่อมกับ Scrollbar
text_widget = tk.Text(main_frame, 
                      font=("Consolas", 12),
                      wrap="word",           # ตัดคำอัตโนมัติ
                      yscrollcommand=scrollbar.set,  # 1. Text → Scrollbar
                      undo=True)             # รองรับ Undo/Redo
text_widget.pack(side="left", fill="both", expand=True)

# 2. Scrollbar → Text
scrollbar.config(command=text_widget.yview)

# เพิ่มข้อความตัวอย่างจำนวนมาก
sample_text = """นี่คือตัวอย่างข้อความยาวเพื่อทดสอบ Scrollbar แนวตั้ง

ใน Text Widget ของ Tkinter เราสามารถแสดงข้อความได้มากกว่าพื้นที่ที่มองเห็นได้
Scrollbar จะช่วยให้ผู้ใช้เลื่อนอ่านเนื้อหาทั้งหมดได้สะดวก

คุณสมบัติสำคัญของ Text Widget:
- รองรับข้อความหลายบรรทัด (Multi-line)
- รองรับการจัดรูปแบบข้อความ (Tags, Styles)
- รองรับการค้นหาและแทนที่ (Search & Replace)
- รองรับ Undo/Redo
- สามารถฝังรูปภาพและ Widget อื่นๆ ได้

ลองเลื่อน Scrollbar ดูได้เลยครับ!
""" * 5  # คูณ 5 เท่า เพื่อให้ข้อความยาวพอ

text_widget.insert("1.0", sample_text)

# ตั้งค่าให้ Text Widget เป็น Read-only (ถ้าต้องการ)
# text_widget.config(state="disabled")

root.mainloop()

ผลลัพธ์

จะได้ Text Widget พร้อม Scrollbar แนวตั้งด้านขวา สามารถเลื่อนอ่านข้อความยาวได้อย่างสบาย ตัวอย่างมีข้อความซ้ำ 5 บล็อก เพื่อให้เห็นการทำงานของ Scrollbar ชัดเจน

คำแนะนำเพิ่มเติม

  • ใช้ wrap="word" เพื่อตัดคำอัตโนมัติที่ขอบขวา (อ่านง่ายกว่า "char" หรือ "none")
  • เพิ่ม undo=True เพื่อเปิดใช้งาน Ctrl+Z / Ctrl+Y
  • สำหรับ Scrollbar แนวนอน ใช้ xscrollcommand และ command=text.xview พร้อม wrap="none"
  • ใช้ ttk.Scrollbar เพื่อให้เข้ากับธีมสมัยใหม่ (Themed)