Thursday, June 27, 2019

การใช้ Kivy สร้างโปรแกรมบวกเลข

วันนี้เราก็จะมาทำโปรแกรมบวกเลขผ่าน Kivy กันนะครับ

.
.
.
สำหรับใครที่ไม่เข้าใจเรื่องคลาสแนะนำให้ดูนี้ก่อน
ความหมายของ class
.
โดยเริ่มแรกเราจะมาทำการออกแบบกันก่อนครับ
ให้มี Label ไว้สำหรับแสดงผลข้อมูลและระบุตำแหน่งให้ใส่เลขรวม 3 อัน
ให้มี Text input ไว้สำหรับการรับค่าตัวเลขที่จะนำมารวมกัน 2 อัน
ให้มี Button ที่เวลาเรากดปุ่มจะนำค่าของ Text input มารวมกัน 1 อัน

เมื่อเราทำการออกแบบเสร็จแล้วก็มาเริ่มเขียนกันเลย
.
.

from kivy.app import App           #class App ทำหน้าที่ render Object ที่เราได้สร้างเอาไว้ผ่าน Build()
from kivy.uix.widget import Widget               #class Widget ทำหน้าที่จัดวาง Object ตามแกน x , y
from kivy.uix.label import Label                    #class Label ไว้ใช้สร้าง Object ที่แสดงข้อความ
from kivy.uix.textinput import TextInput       #class TextInput ไว้ใช้สร้าง Object ที่เก็บข้อมูล
from kivy.uix.button import Button                #class Button ไว้ใช้สร้าง Object ที่เป็นปุ่มกด
from kivy.core.window import Window         #class Window ไว้ใช้ในการปรับขนาด โปรแกรม
Window.size = (550,150)                                #กำหนดให้โปรแกรมมีขนาดเริ่มต้นที่ สูง 150 , กว้าง 550

class Summation(Widget):                            #ให้คลาส Summation เป็น subclass ของ Widget
    def __init__(self,**kwargs):                                  
        super(Summation,self).__init__(**kwargs)                #**kwargs จะรับค่าเป็นตัวแปรได้
        self.textin = TextInput(pos=(50,25),font_size=30)       #สร้างกล่องรับข้อความชื่อ textin
        self.textin2 = TextInput(pos=(250,25),font_size=30)   #สร้างกล่องรับข้อความชื่อ textin2
        self.btn = Button(text='.                        #สร้างปุ่มกดที่ชื่อ btn เมื่อกดปุ่มจะใช้ function cal
                                  , font_size=25
                                  , pos=(350,25),on_press=self.cal)
        self.add_widget(self.textin)                                          #เพิ่ม textin ลงใน widget
        self.add_widget(self.textin2)                                        #เพิ่ม textin2 ลงใน widget
        self.add_widget(self.btn)                                            #เพิ่ม btn3 ลงใน widget
        self.label=Label(text='0',pos=(450,25),font_size=30)   #สร้างแถบข้อความ 0 ที่ชื่อ label
        self.label2=Label(text='+',pos=(150,25),font_size=30) #สร้างแถบข้อความ + ที่ชื่อ label2
        self.add_widget(self.label)                                            #เพิ่ม label ลงใน widget
        self.add_widget(self.label2)                                          #เพิ่ม label2 ลงใน widget

    def cal(self,btn):                         #function ที่นำค่าของเลขที่ใส่มาบวกกันและส่งค่าให้ label
        self.sum=str(int(self.textin.text)+int(self.textin2.text))  #รับค่าจากกล่องรับข้อความ textin และ                                                                                                  textin2 โดยปกติแล้วข้อมูลที่เราได้รับจะ                                                                                                   อยู่ในรูปของ String เราจึงต้องเปลี่ยนเป็น                                                                                     integer แล้วนำไปบวกกันก่อนจะคืนกลับไปเป็น String 
        self.label.text=self.sum                                                 #นำค่าที่ได้ไปโชว์ใน Label
class Myapp(App):                                                                #สร้าง Myapp ให้เป็น subclass of App
    def build(self):                                                                   #Override Build() Method in Myapp class
        return Summation()
Myapp().run()                                                                       #รัน Myapp ผ่าน run() Method



เมื่อเราทำการ Run โค้ดออกมาจะได้โปรแกรมหน้าตาแบบนี้



ทำการใส่เลข 5 ในช่องที่ 1 และ 2


กดปุ่ม = แล้วรอรับคำตอบ


จาก ' 5 + 5 = 10 ' นั้นถูกต้อง
แสดงว่าโปรแกรมของเรานั้นทำงานได้เพื่อนๆก็อย่าลืมไปลองเล่นกันนะครับ

//////////////////////////////////////////////////////////////////////////////////////////////////////




No comments:

Post a Comment