สร้างแอปพลิเคชัน 'เว็บเบราว์เซอร์' และ 'เครื่องบันทึกเดสก์ท็อป' ของคุณเองโดยใช้ PyGobject - ตอนที่ 3
นี่เป็นส่วนที่ ที่ 3 ของซีรีส์เกี่ยวกับการสร้างแอปพลิเคชัน GUI ภายใต้เดสก์ท็อป Linux โดยใช้ PyGObject วันนี้เราจะพูดถึงการใช้โมดูลและไลบรารี Python ขั้นสูงในโปรแกรมของเรา เช่น 'os', 'WebKit', 'requests' และ อื่นๆ นอกเหนือจากข้อมูลที่เป็นประโยชน์อื่นๆ สำหรับการเขียนโปรแกรม
ความต้องการ
คุณต้องอ่านส่วนก่อนหน้าทั้งหมดของซีรีส์จากที่นี่ เพื่อทำตามคำแนะนำเพิ่มเติมเกี่ยวกับการสร้างแอปพลิเคชันขั้นสูงเพิ่มเติม:
- สร้างแอปพลิเคชัน GUI ภายใต้ Linux Desktop โดยใช้ PyGObject - ตอนที่ 1
- การสร้างแอปพลิเคชัน PyGobject ขั้นสูงบน Linux - ตอนที่ 2
โมดูลและไลบรารี่ใน Python มีประโยชน์มาก แทนที่จะต้องเขียนโปรแกรมย่อยหลายๆ โปรแกรมเพื่อทำงานที่ซับซ้อนซึ่งจะต้องใช้เวลาและงานมาก คุณสามารถนำเข้ามันได้เลย ! ใช่ เพียงนำเข้าโมดูลและไลบรารีที่คุณต้องการไปยังโปรแกรมของคุณ และคุณจะสามารถประหยัดเวลาและความพยายามได้มากในการทำให้โปรแกรมของคุณเสร็จสมบูรณ์
มีโมดูลที่มีชื่อเสียงมากมายสำหรับ Python ซึ่งคุณสามารถพบได้ที่ Python Module Index
คุณสามารถนำเข้าไลบรารีสำหรับโปรแกรม Python ของคุณได้เช่นกัน จาก “gi.repository import Gtk ” บรรทัดนี้จะนำเข้าไลบรารี GTK ลงในโปรแกรม Python และมีไลบรารีอื่นๆ อีกมากมายเช่น Gdk, WebKit.. เป็นต้น
การสร้างแอปพลิเคชัน GUI ขั้นสูง
วันนี้เราจะสร้าง 2 โปรแกรม:
- เว็บเบราว์เซอร์ที่เรียบง่าย ซึ่งจะใช้ไลบรารี WebKit
- เครื่องบันทึกเดสก์ท็อปโดยใช้คำสั่ง 'avconv' ซึ่งจะใช้โมดูล 'os' จาก Python
ฉันจะไม่อธิบายวิธีการลากและวางวิดเจ็ตในตัวออกแบบ Glade นับจากนี้ไป ฉันจะบอกชื่อวิดเจ็ตที่คุณต้องการสร้าง นอกจากนี้ ฉันจะให้ .glade สำหรับแต่ละโปรแกรม และไฟล์ Python อย่างแน่นอน
การสร้างเว็บเบราว์เซอร์อย่างง่าย
ในการสร้างเว็บเบราว์เซอร์ เราจะต้องใช้เครื่องมือ “WebKit ” ซึ่งเป็นเครื่องมือแสดงผลแบบโอเพ่นซอร์สสำหรับเว็บ ซึ่งเป็นเครื่องมือเดียวกับที่ใช้ใน Chrome/Chromium สำหรับข้อมูลเพิ่มเติม โปรดดูที่เว็บไซต์อย่างเป็นทางการของ Webkit.org
ขั้นแรก เราจะต้องสร้าง GUI เปิดตัวออกแบบ Glade และเพิ่มวิดเจ็ตต่อไปนี้ สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีสร้างวิดเจ็ต โปรดติดตาม ส่วนที่ 1 และ ส่วนที่ 2 ของซีรี่ส์นี้ (ลิงก์ที่ให้ไว้ด้านบน)
- สร้างวิดเจ็ต 'window1'
- สร้างวิดเจ็ต 'box1' และ 'box2'
- สร้างวิดเจ็ต 'button1' และ 'button2'
- สร้างวิดเจ็ต 'entry1'
- สร้างวิดเจ็ต 'scrolledwindow1'
หลังจากสร้างวิดเจ็ตแล้ว คุณจะได้รับอินเทอร์เฟซดังต่อไปนี้
ไม่มีอะไรใหม่ ยกเว้นวิดเจ็ต “หน้าต่างแบบเลื่อน ” วิดเจ็ตนี้มีความสำคัญเพื่อให้สามารถฝังเอ็นจิ้น WebKit ไว้ข้างในได้ การใช้วิดเจ็ต “หน้าต่างแบบเลื่อน จะทำให้คุณสามารถเลื่อนในแนวนอนและแนวตั้งได้ในขณะที่คุณ เรียกดูเว็บไซต์
ตอนนี้คุณจะต้องเพิ่มตัวจัดการ “backbutton_clicked ” ให้กับปุ่ม ย้อนกลับ “คลิกแล้ว ” สัญญาณ “refreshbutton_clicked ” ตัวจัดการของปุ่มรีเฟรช “สัญญาณคลิก” และตัวจัดการ “enterkey_clicked ” ตัวจัดการของสัญญาณ “เปิดใช้งานแล้ว ” สำหรับรายการ
ไฟล์ .glade ที่สมบูรณ์สำหรับอินเทอร์เฟซอยู่ที่นี่
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.16.1 -->
<interface>
<requires lib="gtk+" version="3.10"/>
<object class="GtkWindow" id="window1">
<property name="can_focus">False</property>
<property name="title" translatable="yes">Our Simple Browser</property>
<property name="window_position">center</property>
<property name="default_width">1000</property>
<property name="default_height">600</property>
<property name="icon_name">applications-internet</property>
<child>
<object class="GtkBox" id="box1">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="orientation">vertical</property>
<child>
<object class="GtkBox" id="box2">
<property name="visible">True</property>
<property name="can_focus">False</property>
<child>
<object class="GtkButton" id="button1">
<property name="label">gtk-go-back</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="receives_default">True</property>
<property name="relief">half</property>
<property name="use_stock">True</property>
<property name="always_show_image">True</property>
<signal name="clicked" handler="backbutton_clicked" swapped="no"/>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<child>
<object class="GtkButton" id="button2">
<property name="label">gtk-refresh</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="receives_default">True</property>
<property name="relief">half</property>
<property name="use_stock">True</property>
<property name="always_show_image">True</property>
<signal name="clicked" handler="refreshbutton_clicked" swapped="no"/>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
<child>
<object class="GtkEntry" id="entry1">
<property name="visible">True</property>
<property name="can_focus">True</property>
<signal name="activate" handler="enterkey_clicked" swapped="no"/>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">2</property>
</packing>
</child>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<child>
<object class="GtkScrolledWindow" id="scrolledwindow1">
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="hscrollbar_policy">always</property>
<property name="shadow_type">in</property>
<child>
<placeholder/>
</child>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
</object>
</child>
</object>
</interface>
ตอนนี้คัดลอกโค้ดด้านบนและวางลงในไฟล์ “ui.glade ” ในโฟลเดอร์หลักของคุณ ตอนนี้สร้างไฟล์ใหม่ชื่อ “mywebbrowser.py ” และป้อนโค้ดต่อไปนี้ข้างใน คำอธิบายทั้งหมดอยู่ในความคิดเห็น
#!/usr/bin/python
-*- coding: utf-8 -*-
## Here we imported both Gtk library and the WebKit engine.
from gi.repository import Gtk, WebKit
class Handler:
def backbutton_clicked(self, button):
## When the user clicks on the Back button, the '.go_back()' method is activated, which will send the user to the previous page automatically, this method is part from the WebKit engine.
browserholder.go_back()
def refreshbutton_clicked(self, button):
## Same thing here, the '.reload()' method is activated when the 'Refresh' button is clicked.
browserholder.reload()
def enterkey_clicked(self, button):
## To load the URL automatically when the "Enter" key is hit from the keyboard while focusing on the entry box, we have to use the '.load_uri()' method and grab the URL from the entry box.
browserholder.load_uri(urlentry.get_text())
## Nothing new here.. We just imported the 'ui.glade' file.
builder = Gtk.Builder()
builder.add_from_file("ui.glade")
builder.connect_signals(Handler())
window = builder.get_object("window1")
## Here's the new part.. We created a global object called 'browserholder' which will contain the WebKit rendering engine, and we set it to 'WebKit.WebView()' which is the default thing to do if you want to add a WebKit engine to your program.
browserholder = WebKit.WebView()
## To disallow editing the webpage.
browserholder.set_editable(False)
## The default URL to be loaded, we used the 'load_uri()' method.
browserholder.load_uri("https://linux-console.net")
urlentry = builder.get_object("entry1")
urlentry.set_text("https://linux-console.net")
## Here we imported the scrolledwindow1 object from the ui.glade file.
scrolled_window = builder.get_object("scrolledwindow1")
## We used the '.add()' method to add the 'browserholder' object to the scrolled window, which contains our WebKit browser.
scrolled_window.add(browserholder)
## And finally, we showed the 'browserholder' object using the '.show()' method.
browserholder.show()
## Give that developer a cookie !
window.connect("delete-event", Gtk.main_quit)
window.show_all()
Gtk.main()
บันทึกไฟล์และเรียกใช้
chmod 755 mywebbrowser.py
./mywebbrowser.py
และนี่คือสิ่งที่คุณจะได้รับ
คุณอาจอ้างอิงเอกสารอย่างเป็นทางการของ WebKitGtk เพื่อค้นหาตัวเลือกเพิ่มเติม
การสร้างเครื่องบันทึกเดสก์ท็อปอย่างง่าย
ในส่วนนี้ เราจะเรียนรู้วิธีเรียกใช้คำสั่งระบบภายในเครื่องหรือเชลล์สคริปต์จากไฟล์ Python โดยใช้โมดูล 'os' ซึ่งจะช่วยให้เราสร้างเครื่องบันทึกหน้าจออย่างง่ายสำหรับเดสก์ท็อปโดยใช้ คำสั่ง 'avconv'
เปิดตัวออกแบบ Glade และสร้างวิดเจ็ตต่อไปนี้:
- สร้างวิดเจ็ต 'window1'
- สร้างวิดเจ็ต 'box1'
- สร้างวิดเจ็ต 'button1', 'button2' และ 'button3'
- สร้างวิดเจ็ต 'entry1'
หลังจากสร้างวิดเจ็ตดังกล่าวแล้ว คุณจะพบกับอินเทอร์เฟซด้านล่าง
นี่คือไฟล์ ui.glade ที่สมบูรณ์
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.16.1 -->
<interface>
<requires lib="gtk+" version="3.10"/>
<object class="GtkWindow" id="window1">
<property name="can_focus">False</property>
<property name="title" translatable="yes">Our Simple Recorder</property>
<property name="window_position">center</property>
<property name="default_width">300</property>
<property name="default_height">30</property>
<property name="icon_name">applications-multimedia</property>
<child>
<object class="GtkBox" id="box1">
<property name="visible">True</property>
<property name="can_focus">False</property>
<child>
<object class="GtkEntry" id="entry1">
<property name="visible">True</property>
<property name="can_focus">True</property>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<child>
<object class="GtkButton" id="button1">
<property name="label">gtk-media-record</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="receives_default">True</property>
<property name="use_stock">True</property>
<property name="always_show_image">True</property>
<signal name="clicked" handler="recordbutton" swapped="no"/>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
<child>
<object class="GtkButton" id="button2">
<property name="label">gtk-media-stop</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="receives_default">True</property>
<property name="use_stock">True</property>
<property name="always_show_image">True</property>
<signal name="clicked" handler="stopbutton" swapped="no"/>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">2</property>
</packing>
</child>
<child>
<object class="GtkButton" id="button3">
<property name="label">gtk-media-play</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="receives_default">True</property>
<property name="use_stock">True</property>
<property name="always_show_image">True</property>
<signal name="clicked" handler="playbutton" swapped="no"/>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">3</property>
</packing>
</child>
</object>
</child>
</object>
</interface>
ตามปกติ ให้คัดลอกโค้ดด้านบนและวางลงในไฟล์ “ui.glade ” ในโฮมไดเร็กตอรี่ของคุณ สร้างไฟล์ “myrecorder.py ” ใหม่ แล้วป้อนข้อมูลต่อไปนี้ รหัสข้างใน (อธิบายทุกบรรทัดใหม่ในความคิดเห็น)
#!/usr/bin/python
-*- coding: utf-8 -*-
## Here we imported both Gtk library and the os module.
from gi.repository import Gtk
import os
class Handler:
def recordbutton(self, button):
## We defined a variable: 'filepathandname', we assigned the bash local variable '$HOME' to it + "/" + the file name from the text entry box.
filepathandname = os.environ["HOME"] + "/" + entry.get_text()
## Here exported the 'filepathandname' variable from Python to the 'filename' variable in the shell.
os.environ["filename"] = filepathandname
## Using 'os.system(COMMAND)' we can execute any shell command or shell script, here we executed the 'avconv' command to record the desktop video & audio.
os.system("avconv -f x11grab -r 25 -s `xdpyinfo | grep 'dimensions:'|awk '{print $2}'` -i :0.0 -vcodec libx264 -threads 4 $filename -y & ")
def stopbutton(self, button):
## Run the 'killall avconv' command when the stop button is clicked.
os.system("killall avconv")
def playbutton(self, button):
## Run the 'avplay' command in the shell to play the recorded file when the play button is clicked.
os.system("avplay $filename &")
## Nothing new here.. We just imported the 'ui.glade' file.
builder = Gtk.Builder()
builder.add_from_file("ui.glade")
builder.connect_signals(Handler())
window = builder.get_object("window1")
entry = builder.get_object("entry1")
entry.set_text("myrecording-file.avi")
## Give that developer a cookie !
window.connect("delete-event", Gtk.main_quit)
window.show_all()
Gtk.main()
ตอนนี้รันไฟล์โดยใช้คำสั่งต่อไปนี้ในเทอร์มินัล
chmod 755 myrecorder.py
./myrecorder.py
และคุณมีเครื่องบันทึกเดสก์ท็อปเครื่องแรก
คุณสามารถค้นหาข้อมูลเพิ่มเติมเกี่ยวกับโมดูล 'os' ได้ที่ Python OS Library
เพียงเท่านี้ การสร้างแอปพลิเคชันสำหรับเดสก์ท็อป Linux ไม่ใช่เรื่องยากโดยใช้ PyGObject คุณเพียงแค่ต้องสร้าง GUI นำเข้าโมดูลบางส่วน และเชื่อมโยงไฟล์ Python กับ GUI ไม่มีอะไรมาก ไม่มีอะไรน้อยไปกว่านั้น มีบทช่วยสอนที่เป็นประโยชน์มากมายเกี่ยวกับการทำเช่นนี้ในเว็บไซต์ PyGObject:
คุณได้ลองสร้างแอปพลิเคชันโดยใช้ PyGObject แล้วหรือยัง? คุณคิดอย่างไรเกี่ยวกับการทำเช่นนั้น? คุณเคยพัฒนาแอปพลิเคชันใดบ้างมาก่อน