Paghimo sa Imong Kaugalingong Web Browser ug Desktop Recorder Application Gamit ang PyGobject - Bahin 3


Kini ang ika-3 nga bahin sa serye bahin sa paghimo og mga aplikasyon sa GUI ubos sa desktop sa Linux gamit ang PyGObject. Karon kita maghisgot mahitungod sa paggamit sa pipila ka advanced Python modules & library sa atong mga programa sama sa 'os', 'WebKit', 'mga hangyo' ug ang uban, gawas sa ubang mapuslanong impormasyon para sa programming.

Kinahanglan nimong tun-an ang tanan niining mga nangaging bahin sa serye gikan dinhi, aron makapadayon sa dugang nga mga instruksyon sa pagmugna og mas abante nga mga aplikasyon:

  1. Paghimo ug GUI nga Aplikasyon Ubos sa Linux Desktop Gamit ang PyGObject – Bahin 1
  2. Paghimo Advance PyGobject Applications sa Linux – Bahin 2

Ang mga module ug librarya sa Python mapuslanon kaayo, imbis nga magsulat ug daghang mga sub-program aron mahimo ang pipila ka mga komplikado nga trabaho nga magkinahanglan og daghang oras ug trabaho, mahimo ra nimo kini i-import! Oo, i-import lang ang mga module ug librarya nga kinahanglan nimo sa imong programa ug makadaginot ka ug daghang oras ug paningkamot aron makompleto ang imong programa.

Adunay daghang bantog nga mga module alang sa Python, nga imong makit-an sa Python Module Index.

Mahimo ka usab nga mag-import ug mga librarya alang sa imong Python program, gikan sa gi.repository import Gtk kini nga linya nag-import sa librarya sa GTK sa programa sa Python, adunay daghang uban pang mga librarya sama sa Gdk, WebKit.. etc.

Paghimo ug Advance GUI Applications

Karon, maghimo kami ug 2 nga mga programa:

  1. Usa ka yano nga web browser; nga mogamit sa WebKit library.
  2. Usa ka desktop recorder gamit ang 'avconv' nga sugo; nga mogamit sa 'os' module gikan sa Python.

Dili nako ipasabut kung giunsa ang pag-drag ug pag-drop sa mga widget sa Glade nga tigdesinyo gikan karon, isulti ko lang kanimo ang ngalan sa mga widget nga kinahanglan nimo nga buhaton, dugang nga hatagan ko ikaw sa .glade file alang sa matag programa, ug ang Python file sigurado.

Aron makahimo og web browser, kinahanglan namong gamiton ang \WebKit” nga makina, nga usa ka open-source rendering engine para sa web, mao ra kini ang gigamit sa Chrome/Chromium, para sa dugang nga impormasyon bahin niini mahimo nimong tan-awon ang opisyal nga Webkit.org nga website.

Una, kinahanglan natong mugnaon ang GUI, ablihi ang Glade nga tigdesinyo ug idugang ang mosunod nga mga widget. Para sa dugang nga impormasyon kon unsaon paghimo og mga widgets, sunda ang Bahin 1 ug Bahin 2 niini nga serye (mga link nga gihatag sa ibabaw).

  1. Paghimo og 'window1' widget.
  2. Paghimo og 'box1' ug 'box2' widget.
  3. Paghimo og 'button1' ug 'button2' widget.
  4. Paghimo og 'entry1' widget.
  5. Paghimo og 'scrolledwindow1' widget.

Pagkahuman sa paghimo og mga widget, makuha nimo ang mosunud nga interface.

Walay bag-o, gawas sa \Scrolled Window” widget; kini nga widget importante aron tugotan ang WebKit nga makina nga mabutang sa sulod niini, gamit ang \Scrolled Window widget mahimo ka usab nga mag-scroll horizontally ug vertically samtang nag-browse ka sa mga website.

Kinahanglan nimong idugang ang \backbutton_clicked” handler sa Balik nga buton \gi-klik” nga signal, \refreshbutton_clicked b>” handler sa Refresh button \clicked signal” ug \enterkey_clicked” handler sa \activate” signal para sa entry .

Ang kompletong .glade file para sa interface ania dinhi.

<?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>

Karon kopyaha ang code sa ibabaw ug idikit kini sa \ui.glade” nga payl sa imong home folder. Karon paghimo ug bag-ong file nga gitawag og \mywebbrowser.py” ug pagsulod ang mosunod nga code sa sulod niini, ang tanan nga katin-awan anaa sa mga komento.

#!/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()

I-save ang file, ug padagana kini.

$ chmod 755 mywebbrowser.py
$ ./mywebbrowser.py

Ug kini ang imong makuha.

Mahimo nimong i-refer ang WebKitGtk opisyal nga dokumentasyon aron madiskubre ang daghang kapilian.

Niini nga seksyon, makakat-on kita unsaon pagpadagan ang mga local system commands o shell scripts gikan sa Python file gamit ang 'os' module, nga makatabang nato sa paghimo og simple nga screen recorder para sa desktop gamit ang 'avconv' nga sugo.

Ablihi ang Glade designer, ug paghimo sa mosunod nga mga widgets:

  1. Paghimo og 'window1' widget.
  2. Paghimo og 'box1' widget.
  3. Paghimo og 'button1', 'button2' ug 'button3' nga mga widget.
  4. Paghimo og 'entry1' widget.

Human sa paghimo sa ibabaw sa giingon nga mga widget, makakuha ka sa ubos nga interface.

Ania ang kompletong ui.glade file.

<?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>

Sama sa naandan, kopyaha ang code sa ibabaw ug idikit kini sa file nga \ui.glade” sa imong home directory, paghimo og bag-ong \myrecorder.py” file ug isulod ang mosunod nga code sa sulod niini (Ang matag bag-ong linya gipasabut sa mga komento).

#!/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()

Karon padagana ang file pinaagi sa pagpadapat sa mosunod nga mga sugo sa terminal.

$ chmod 755 myrecorder.py
$ ./myrecorder.py

Ug nakuha nimo ang imong unang desktop recorder.

Makita nimo ang dugang nga impormasyon bahin sa 'os' module sa Python OS Library.

Ug mao kana, ang paghimo og mga aplikasyon alang sa Linux desktop dili lisud gamit ang PyGObject, kinahanglan ka lang maghimo sa GUI, mag-import sa pipila ka mga module ug i-link ang Python file sa GUI, wala’y labi pa, wala’y gamay. Adunay daghang mapuslanon nga mga panudlo bahin sa pagbuhat niini sa website sa PyGObject:

Nasulayan na ba nimo ang paghimo og mga aplikasyon gamit ang PyGObject? Unsay imong hunahuna sa pagbuhat niini? Unsa nga mga aplikasyon ang imong nahimo kaniadto?