Erstellt Ären eegene Webbrowser an Desktop Recorder Uwendungen mat PyGobject - Deel 3

Dëst ass den 3. Deel vun der Serie iwwer d'Schafe vun GUI Uwendungen ënner dem Linux Desktop mat PyGObject. Haut schwätze mir iwwer d'Benotzung vun e puer fortgeschratt Python Moduler & Bibliothéiken an eise Programmer wéi 'os', 'WebKit', 'Ufroen' an anerer, Nieft e puer aner nëtzlech Informatiounen fir programméiere.

Dir musst all dës viregt Deeler vun der Serie vun hei duerchgoen, fir weider Instruktioune fir méi Viraus Uwendungen ze kreéieren:

1. GUI Uwendungen erstellen ënner Linux Desktop mat PyGObject - Deel 1
2. Advance PyGobject Uwendungen op Linux erstellen - Deel 2

Moduler & Bibliothéiken am Python si ganz nëtzlech, amplaz vill Ënnerprogrammer ze schreiwen fir e puer komplizéiert Aarbechten ze maachen déi vill Zäit an Aarbecht daueren, kënnt Dir se einfach importéieren! Jo, importéiert just d'Moduler & d'Bibliothéiken déi Dir braucht an Äre Programm an Dir wäert fäeg sinn vill Zäit an Effort ze spueren fir Äre Programm ofzeschléissen.

Et gi vill berühmt Moduler fir Python, déi Dir am Python Module Index fannt.

Dir kënnt och Bibliothéiken fir Äre Python Programm importéieren, vun gi.repository import Gtk dës Linn importéiert d'GTK Bibliothéik an de Python Programm, et gi vill aner Bibliothéike wéi Gdk, WebKit .. etc.

Erstellt Advance GUI Uwendungen

Haut erstellen mir 2 Programmer:

1. En einfachen Webbrowser; déi d'WebKit-Bibliothéik benotzt.
2. En Desktop Recorder mat dem 'avconv' Kommando; deen den 'os' Modul vum Python benotzt.

Ech wäert net erkläre wéi ech Widgets am Glade Designer vun elo un zéien an erofsetzen, ech soen Iech just den Numm vun de Widgets déi Dir musst erstellen, zousätzlech ginn ech Iech den .glade Datei fir all Programm, an d'Python-Datei sécher.

Fir e Webbrowser ze kreéieren, musse mir de \WebKit Motor benotzen, deen en Open-Source Rendering-Motor fir de Web ass, et ass deeselwechten deen an Chrome/Chromium, fir méi Informatiounen doriwwer kënnt Dir op déi offiziell Webkit.org Websäit referenzéieren.

Als éischt musse mir d'GUI erstellen, den Glade Designer opmaachen an déi folgend Widgets addéieren. Fir méi Informatiounen iwwer wéi een Widgets erstellt, befollegt d'Deel 1 an Deel 2 vun dëser Serie (Links hei uewen).

1. Erstellt 'window1' Widget.
2. Erstellt 'box1' an 'box2' Widget.
3. Erstellt 'button1' an 'button2' Widget.
4. Erstellt 'entry1' Widget.
5. Erstellt 'scrolledwindow1' Widget.

Nodeems Dir Widgets erstallt hutt, kritt Dir déi folgend Interface.

Et gëtt näischt Neies, ausser de Widget \Scrolled Window; dëse Widget ass wichteg fir datt de WebKit Motor dran implantéiert gëtt, mam \ >Scrolled Window” Widget kënnt Dir och horizontal a vertikal scrollen wann Dir d'Websäite surft.

Dir musst elo den \backbutton_clicked Handler un de Back Knäppchen \clicked Signal addéieren, \refreshbutton_clicked b> Handler op de Refresh Knäppchen \geklickt Signal an \enterkey_clicked Handler zum \aktivéierten Signal fir d'Entrée .

Déi komplett .glade Datei fir den Interface ass hei.

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

Kopéiert elo den uewe genannte Code a paste en an den \ui.glade Fichier an Ärem Dossier doheem. Erstellt elo eng nei Datei mam Numm \mywebbrowser.py a gitt de folgende Code dobannen, all Erklärung ass an de Kommentaren.

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

Späichert d'Datei, a lafen se.

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

An dat ass wat Dir kritt.

Dir kënnt op déi WebKitGtk offiziell Dokumentatioun referenzéieren fir méi Optiounen ze entdecken.

An dëser Rubrik léiere mir wéi Dir lokal Systembefehle oder Shell-Skripte aus der Python-Datei ausféiert mat dem 'os'-Modul, deen eis hëlleft fir en einfachen Bildschirmrecorder fir den Desktop mat der Hëllef vun der 'avconv' Kommando.

Öffnen de Glade Designer, a kreéiert déi folgend Widgets:

1. Erstellt 'window1' Widget.
2. Erstellt 'box1' Widget.
3. Erstellt 'button1', 'button2' an 'button3' Widgets.
4. Erstellt 'entry1' Widget.

Nodeems Dir uewen genannte Widgets erstallt hutt, kritt Dir ënnert Interface.

Hei ass déi komplett ui.glade Datei.

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

Wéi gewinnt, kopéiert de uewe genannte Code a paste en an de Fichier \ui.glade an Ärem Heemverzeichnis, erstellt eng nei \myrecorder.py Datei a gitt de folgende Code dobannen (All nei Zeil gëtt an de Kommentaren erkläert).

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

Fuert elo d'Datei andeems Dir déi folgend Kommandoen am Terminal applizéiert.

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

An Dir hutt Ären éischten Desktop Recorder.

Dir kënnt méi Informatiounen iwwer de 'os'Modul an der Python OS Bibliothéik fannen.

An dat ass et, Applikatioune fir de Linux Desktop erstellen ass net schwéier mat PyGObject, Dir musst just d'GUI erstellen, e puer Moduler importéieren an d'Python-Datei mat der GUI verbannen, näischt méi, näischt manner. Et gi vill nëtzlech Tutorials iwwer dëst op der PyGObject Websäit ze maachen:

Hutt Dir probéiert Uwendungen mat PyGObject ze kreéieren? Wat mengt Dir dovun ze maachen? Wéi eng Uwendungen hutt Dir virdru entwéckelt?