Esempio Gui in Lazarus/Pascal

Per gli esempi delle GUI su Linux stavo cercando di ritirare fuori Kylix (che esisteva anche in versione Open Edition oltre che commerciale) quando mi sono accorto che e' un prodotto praticamente defunto


In ogni caso esiste un sostituto che ne mima le funzionalita', l'interfaccia ed il linguaggio ovvero Lazarus Pascal

La differenza principali nell'Editor di Gui e' che i widgets non si trascinano sul Form ma si deve cliccare sulla toolbar per selezionare il widget e poi cliccare sul Form per inserirlo

Schermata dell'IDE di Lazarus

Per la gestione degli eventi si usa il tab vicino alle proprieta' del widget, si seleziona l'evento e si apre l'editor di codice che nel caso in esame e' particolarmente semplice

--------------------------------------
ProgressBa1.position = TrackBar1.Position;
Label1.Caption = IntToStr(TrackBar1.Position);
--------------------------------------

Esempio Gui in Mono/C#

La GUI di esempio scritta in C# Mono
Per Debian e' sufficiente installare il pacchetto mono-complete che aggiunge anche l'IDE MonoDevelop

Una prima osservazione: in MonoDevelop i progetti si chiamano soluzioni per cui per creare un progetto si deve creare una soluzione
qwe
Il Designer della GUI si trova nella Interfaccia Utente della Soluzione

Gui Designer di Mono Develop

Per creare l'evento da associare al Widget si deve cliccare sul Menu' a scomparsa sulla sinistra Proprieta' e, dopo aver selezionato il Widget, si clicca il tab Segnali (dove solo elencati i segnali specifici del widget sia quelli ereditati)

Cliccando sul segnale richiesto si apre l'editor si apre l'editor del codice in cui e' stato inserito

---------------------------------------------
double t = hscale1.Value;
string s = System.Convert.ToString(t) ;
label1.Text = s;
progressbar1.Fraction = t/100;
---------------------------------------------

Esempio GUI con GTK in C

Per creare la GUi viene impiegata la libreria GTK senza l'impiego di Glade (ovvero in GUI Designer di GTK)

Impiegando Code::Block e scegliendo il progetto GTK non e' necessario impostare le flag del compilatore che vengono aggiunte in automatico dall'IDE per cui e' molto semplice giungere ad un eseguibile

Compilare l'esempio seguente con Eclipse e' decisamente piu' complicato

Una delle principali differenze rispetto a Qt risiede nel fatto che GTK e' completamente in C (ha una interfaccia in C++ ma solo come wrapper) per cui la gestione degli oggetti non esiste in modo tradizionale. Inoltre per aggiungere una azione ad un widget si usa signal connect

--------------------------------------------------

#include <stdlib.h>
#include <gtk/gtk.h>
#include <stdio.h>



GtkWidget *scale = NULL;
GtkWidget *label = NULL;
GtkWidget *progressbar= NULL;


static void cambia_valore (GtkWidget *wid, GtkWidget *win)
{
  gdouble current_value = gtk_range_get_value(GTK_RANGE(scale));

  char buffer [14] = { '\0' };
  sprintf ( buffer, "%.0f", current_value);

  gtk_label_set_text(label,buffer);
  gtk_progress_bar_set_fraction(progressbar,current_value/100);

}


int main (int argc, char *argv[])
{

  GtkWidget *win = NULL;
  GtkWidget *vbox = NULL;



  /* Initialize GTK+ */
  g_log_set_handler ("Gtk", G_LOG_LEVEL_WARNING, (GLogFunc) gtk_false, NULL);
  gtk_init (&argc, &argv);
  g_log_set_handler ("Gtk", G_LOG_LEVEL_WARNING, g_log_default_handler, NULL);

  /* Create the main window */
  win = gtk_window_new (GTK_WINDOW_TOPLEVEL);
  gtk_container_set_border_width (GTK_CONTAINER (win), 8);
  gtk_window_set_title (GTK_WINDOW (win), "Progress Bar");
  gtk_window_set_position (GTK_WINDOW (win), GTK_WIN_POS_CENTER);
  gtk_widget_realize (win);
  g_signal_connect (win, "destroy", gtk_main_quit, NULL);

  /* Create a vertical box with buttons */
  vbox = gtk_vbox_new (TRUE, 6);
  gtk_container_add (GTK_CONTAINER (win), vbox);

  scale = gtk_hscale_new_with_range(0,100,1);
  g_signal_connect (G_OBJECT (scale), "value_changed", G_CALLBACK (cambia_valore), (gpointer) win);
  gtk_box_pack_start (GTK_BOX (vbox), scale, TRUE, TRUE, 0);

  label = gtk_label_new("0");
  gtk_box_pack_start (GTK_BOX (vbox), label, TRUE, TRUE, 0);

  progressbar = gtk_progress_bar_new();
  gtk_box_pack_start (GTK_BOX (vbox), progressbar, TRUE, TRUE, 0);


  /* Enter the main loop */
  gtk_widget_show_all (win);
  gtk_main ();
  return 0;
}

--------------------------------------------------

nel caso di compilazione a mano si puo' invece da riga di comando indicare
gcc `pkg-config --cflags --libs gtk+-2.0` main.c -o programma

Esempio GUI con QTCreator

Da non confondersi con QT Designer questo tool e' una IDE integrata per QT e non un semplice disegnatore di interfacce

per creare l'esempio non e' stata scritta una riga di codice. E' stato sufficiente collegare il segnale del sender (in questo caso lo slider) al widget di destinazione (ovvero la label e la progress bar)

Esempio GUI con WX Python

Cosi' come per PyGtk anche le librerie WxPython non sono aggiornate a Python 3.x per cui si deve usare la versione 2.x
Nella versione per Windows richiedono i privilegi di amministrazione

----------------------------------------------------------

import wx

class MyFrame(wx.Frame):
def __init__(self, parent, id, title):
wx.Frame.__init__(self, parent, id, title, wx.DefaultPosition,(300,150))
panel = wx.Panel(self, -1)

        self.sld = wx.Slider(self, -1, 0, 0, 100,(10,10),(270,50),wx.SL_AUTOTICKS | wx.SL_HORIZONTAL | wx.SL_LABELS)
self.label = wx.StaticText(self,wx.ID_ANY,"0 ",pos=(140,60),size=(100,20))
self.progressbar = wx.Gauge(self,-1,100,pos=(10,90),size=(270,20))

self.Bind(wx.EVT_SLIDER, self.sliderUpdate)
       
        wx.EVT_BUTTON(self, 9, self.OnClose)

def OnClose(self, event):
self.Close()

def sliderUpdate(self,event):
self.label.SetLabel(str(self.sld.GetValue()))
self.progressbar.SetValue(self.sld.GetValue())

class MyApp(wx.App):
    def OnInit(self):
frame = MyFrame(None, -1, 'Progress Bar')
frame.Show(True)
frame.Centre()
return True

app = MyApp(0)

----------------------------------------------------------

Esempio GUI con Java

per scrivere questo esempio e' stato impiegato Eclipse nella versione per sviluppatori Java che include al suo interno il plugin di Google denominato WindowBuilder Pro per la gestione dell'interfaccia grafica di Java

Per creare un progetto Java/WindowBuilder, dopo aver installato Eclipse, si clicca File/New/Other/WindowBuilder/SwingDesigner/Application

per spostarsi tra l'editor visuale e la parte di codice si clicca nei tab in basso. Per il resto la programmazione e' molto simile agli altri ambienti di sviluppo visuale

------------------------------------------------------------------------
package com.test.swing2;

import java.awt.EventQueue;

import javax.swing.JFrame;
import javax.swing.JProgressBar;
import java.awt.BorderLayout;
import javax.swing.JLabel;
import javax.swing.JSlider;
import javax.swing.event.ChangeListener;
import javax.swing.event.ChangeEvent;
import javax.swing.SwingConstants;

public class Swing2 {

    private JFrame frmProgressBar;

    /**
     * Launch the application.
     */
    public static void main(String[] args) {
        EventQueue.invokeLater(new Runnable() {
            public void run() {
                try {
                    Swing2 window = new Swing2();
                    window.frmProgressBar.setVisible(true);
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        });
    }

    /**
     * Create the application.
     */
    public Swing2() {
        initialize();
    }

    /**
     * Initialize the contents of the frame.
     */
    private void initialize() {
        frmProgressBar = new JFrame();
        frmProgressBar.setTitle("Progress Bar");
        frmProgressBar.setBounds(100, 100, 279, 94);
        frmProgressBar.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      
        final JProgressBar progressBar_1 = new JProgressBar();
        frmProgressBar.getContentPane().add(progressBar_1, BorderLayout.SOUTH);
      
        final JSlider slider = new JSlider();

        frmProgressBar.getContentPane().add(slider, BorderLayout.NORTH);
      
        final JLabel lblNewLabel = new JLabel("50");
        lblNewLabel.setHorizontalAlignment(SwingConstants.CENTER);
        frmProgressBar.getContentPane().add(lblNewLabel, BorderLayout.CENTER);
      
        slider.addChangeListener(new ChangeListener() {
            public void stateChanged(ChangeEvent arg0) {
                lblNewLabel.setText(Integer.toString(slider.getValue()));
                progressBar_1.setValue(slider.getValue());
            }
        });
    }

}


------------------------------------------------------------------------

Esempio GUI con PYGtk

Al contrario degli esempio precedenti PyGtk non funziona con la versione 3.x di Python per cui e' necessario usare un compilatore della serie 2.x

----------------------------------------------
import pygtk
pygtk.require('2.0')
import gtk

class SecondWin:
        def __init__(self):
            self.win = gtk.Window(gtk.WINDOW_TOPLEVEL)
            self.win.connect("delete_event", self.delete_event)
            self.win.connect("destroy", self.destroy)
            #self.win.set_resizable(gtk.FALSE)
            self.win.set_title('Progress Bar')
            self.win.set_border_width(5)
            self.win.resize(200,100)

            self.vbox = gtk.VBox()
            self.win.add(self.vbox)

            adjustment = gtk.Adjustment(0, 0, 100, 5, 10, 0)
            self.hscale = gtk.HScale(adjustment)
            self.vbox.pack_start(self.hscale)
            self.hscale.set_digits(0)
            self.hscale.connect("value-changed", self.scale_moved)

            self.label = gtk.Label(str="   ")
            self.vbox.pack_start(self.label)

            self.progressbar = gtk.ProgressBar()
            self.vbox.pack_start(self.progressbar)
           
            self.win.show_all()

        def scale_moved(self, event):
            self.label.set_text(str(self.hscale.get_value()))
            self.progressbar.set_fraction(self.hscale.get_value()/100)
           
        def delete_event(self, widget, event, data=None):
            return gtk.FALSE
        def destroy(self, widget, data=None):
            return gtk.main_quit()
        def main(self):
            gtk.main()

if __name__ == "__main__":
    second = SecondWin()
    second.main()
----------------------------------------------

Esempio di GUI con Gambas

Tempo di sviluppo : 3 minuti (e non avevo mai usato prima Gambas)

-----------------------------------------------------------------
PUBLIC SUB Form_Open()
Label1.Alignment = 3
END

PUBLIC SUB Slider1_Change()

  Label1.Text = Slider1.Value
  ProgressBar1.Value = Slider1.Value / 100

END
-----------------------------------------------------------------

Esempio GUI con TKinter

Un esempio di uso della GUI Tkinter su Python 3.2 (da confrontare con questo post)

------------------------------------------
import tkinter as tk
from tkinter import ttk

class App:


    def __init__(self):
        self.root = tk.Tk()

        self._job = None
        self.root.title("Progress Bar")

        self.frame = tk.Frame(self.root, width=200, height=10)
        self.frame.pack()
       
        self.slider = tk.Scale(self.root, from_=0, to=100,
                               orient="horizontal",
                               command=self.updateValue, length=200)
        self.slider.pack()

        self.lab = tk.Label(self.root, text="         ")
        self.lab.pack()
   
       
        self.pbar = ttk.Progressbar(self.root, length=200,mode="determinate", maximum=100)
        self.pbar.pack(padx=5, pady=5)
        self.pbar.start
       
        self.root.mainloop()

    def updateValue(self, event):
        if self._job:
            self.root.after_cancel(self._job)
        self.pbar["value"] = int(self.slider.get())
        self.lab.config(text=str(self.slider.get()))
       

app=App()
------------------------------------------

Esempio GUI con PyQt

Un esempio di GUI mediante PyQT

import sys
from PyQt4 import QtGui, QtCore

app = QtGui.QApplication(sys.argv)
widget = QtGui.QWidget()

widget.setGeometry(200, 100, 220, 120)
widget.setWindowTitle('Slider Example')

label1 = QtGui.QLabel("Valore:      ", widget)
label1.move(80, 50)

slider = QtGui.QSlider(QtCore.Qt.Horizontal, widget)
slider.setGeometry(10, 10, 200, 30)
slider.setFocusPolicy(QtCore.Qt.NoFocus)

pb = QtGui.QProgressBar(widget)
pb.setGeometry(10, 70, 215, 20)

def getValue(value):
    label1.setText("Valore: "+str(value))
    pb.setValue(value)


   
widget.connect(slider, QtCore.SIGNAL('valueChanged(int)'), getValue)



widget.show()
sys.exit(app.exec_())