Rapid-Q by William Yu (c)1999-2000	.
Back to holyguard.net

Capitolo 4: Il vostro primo programma Rapid-Q

4. Il vostro primo programma Rapid-Q

Passiamo direttamente a scrivere programmi Windows in Rapid-Q! Questa è una semplice guida passo passo, completa di codice sorgente alla fine del capitolo.

4. 1 Decidere cosa scrivere

Non scriveremo una semplice demo 'Hello World!', ma nemmeno un Web browser; partiremo da qualcosa di significativo, ma al tempo stesso semplice. Scriveremo un semplice programma di database basato su un form. Fra i concetti di cui parleremo ci saranno la gestione dei form, degli eventi e l'utilizzo dei componenti QEDIT, QBUTTON, QFORM, QLABEL, e QLISTBOX. Ecco come dovrebbe apparire la nostra applicazione una volta completata, potete modificare l'interfaccia a vostro piacimento (se vi sentite abbastanza sicuri).

Potrà sembrare molto, ma in realtà il codice è meno di 100 righe! La maggior parte del tempo è impiegato nel disegno della grafica.

4. 2 Disegnare il form

Potete praticamente vedere i componenti di cui avremo bisogno. Un QFORM, 2 QBUTTON, 4 QEDIT, 4 QLABEL, ed infine 1 QLISTBOX. Prima di tutto, serve una finestra (il nostro form). Digitare:

           DIM MainForm AS QFORM

           MainForm.Center
           MainForm.Caption = 'My First Application'
           MainForm.Height = 340
           MainForm.Width = 350
           MainForm.ShowModal    '-- Visualizza il form

Se avete digitato tutto questo correttamente, dovreste vedere una finestra vuota con la stessa geometria del diagramma sopra indicato. Una cosa che va rilevata è che non stiamo usando MainForm.Left o MainForm.Top in quanto quando il form principale è centrato, vengono automaticamente calcolati per noi. Quello che ci serve realmente è di fornire la larghezza e l'altezza della nostra finestra.

Bene, ora che abbiamo la nostra finestra dovremo aggiungervi dei controlli. Il codice che segue dovrà essere sistemato PRIMA della riga MainForm.ShowModal. Tanto per cominciare, aggiungiamo alcune etichette alla nostra finestra.

       DIM NameLabel AS QLABEL, AddrLabel AS QLABEL
       DIM CityLabel AS QLABEL, PhLabel AS QLABEL

           NameLabel.Parent = MainForm
           NameLabel.Caption = 'Name:'
           NameLabel.Top = 13
           NameLabel.Left = 25
           AddrLabel.Parent = MainForm
           AddrLabel.Caption = 'Address:'
           AddrLabel.Top = 38
           AddrLabel.Left = 25
           CityLabel.Parent = MainForm
           CityLabel.Caption = 'City:'
           CityLabel.Top = 63
           CityLabel.Left = 25
           PhLabel.Parent = MainForm
           PhLabel.Caption = 'Phone #:'
           PhLabel.Top = 88
           PhLabel.Left = 25

Stiamo creando quattro componenti etichetta, ed useremo MainForm come contenitore per questi componenti, da cui l'associazione Parent = MainForm. Se ad esempio avessero creato un QPANEL nel nostro form, esso potrebbe fare da contenitore per i nostri controlli. Ci arriveremo più avanti. Per il momento, prendetevi un po' di tempo per assimilare il codice ed aggiungerlo a quello precedente.

Ora abbiamo la nostra finestra e le nostre quattro etichette. Aggiungiamo i quattro controlli casella di testo al nostro programma.

       DIM NameEdit AS QEDIT, AddrEdit AS QEDIT
       DIM CityEdit AS QEDIT, PhEdit AS QEDIT

           NameEdit.Parent = MainForm
           NameEdit.Left = 70
           NameEdit.Top = 10
           NameEdit.Width = 230
           AddrEdit.Parent = MainForm
           AddrEdit.Left = NameEdit.Left
           AddrEdit.Width = NameEdit.Width
           AddrEdit.Top = 35
           CityEdit.Parent = MainForm
           CityEdit.Left = NameEdit.Left
           CityEdit.Width = NameEdit.Width
           CityEdit.Top = 60
           PhEdit.Parent = MainForm
           PhEdit.Left = NameEdit.Left
           PhEdit.Width = NameEdit.Width
           PhEdit.Top = 85

Non vi sembra familiare? Funziona come le nostre QLABEL, la cosa più difficile è posizionarli correttamente nel form. Nell'esempio di cui sopra, abbiamo allineato tutti i controlli QEDIT subito dopo i QLABEL. Ancora, prendetevi un po' di tempo per assimilare il codice ed aggiungerlo a quello precedente.

Ci resta solo da aggiungere i nostri due bottoni ed il nostro controllo listbox. Ecco come fare:

       DIM AddButton AS QBUTTON, ClearButton AS QBUTTON
       DIM ListBox AS QLISTBOX

           AddButton.Parent = MainForm
           AddButton.Left = 70
           AddButton.Top = 115
           AddButton.Width = 110
           AddButton.Caption = '&Add to Database'
           ClearButton.Parent = MainForm
           ClearButton.Left = 190
           ClearButton.Top = 115
           ClearButton.Width = 110
           ClearButton.Caption = '&Clear Database'

           ListBox.Parent = MainForm
           ListBox.Top = 150
           ListBox.Left = 70
           ListBox.Width = 230
           ListBox.Height = 150

Copia e incolla, ed ecco fatto! Wow, ora abbiamo un form esattamente come il diagramma illustrato in precedenza (sezione 4. 1). Eseguitelo, osservatelo bene per un po' e poi riprendete la lettura, ci sono ancora due cose da inserire.

4. 3 Gestione degli eventi

Come avete visto, il codice sopra indicato formsce un'interfaccia utente, ma nulla più. Se avete provato a premere i pulsanti, non fanno niente. Dovrete scrivere il gestore dell'evento relativo al clic sul bottone. Ecco come fare:

           AddButton.OnClick = AddButtonClick

Tutto qui? Bene, solo in parte: il gestore dell'evento OnClick trasferirà l'esecuzione alla subroutine che abbiamo denominato AddButtonClick. A questo punto dovremo scrivere la nostra subroutine. Assicuratevi di avere incluso la subroutine sopraindicata, prima di aggiungere il codice di cui sopra.

           SUB AddButtonClick
               IF ListBox.ItemCount > 0 THEN
                  '-- Aggiungiamo un bel separatore
                  ListBox.AddItems '--------------------------'
               END IF
               ListBox.AddItems NameEdit.Text, AddrEdit.Text, _
                                CityEdit.Text, PhEdit.Text
           END SUB

Bene, cominciamo a vedere qualche risultato. Quando l'utente preme il pulsante add (aggiungi), il codice sopraindicato viene eseguito. Come potete vedere, aggiunge semplicemente i campi testo alla nostra listbox. In caso non lo sapeste già, il carattere underscore '_' può essere utilizzato in Rapid-Q per suddividere righe lunghe. Abbiamo quasi finito, ora aggiungeremo un gestore di evento per l'altro pulsante.

           SUB ClearButtonClick
               ListBox.Clear
           END SUB

           ClearButton.OnClick = ClearButtonClick

OK, se avete contato tutte le righe, sono ben meno di 100! Il nostro programma è completo, potete giocarci, aggiungerci qualcosa, e comunque imparare qualcosa.

4.4 Codice sorgente completo

DIM MainForm AS QFORM
DIM NameEdit AS QEDIT, AddrEdit AS QEDIT, _
    CityEdit AS QEDIT, PhEdit AS QEDIT
DIM NameLabel AS QLABEL, AddrLabel AS QLABEL, _
    CityLabel AS QLABEL, PhLabel AS QLABEL
DIM ListBox AS QLISTBOX
DIM AddButton AS QBUTTON, ClearButton AS QBUTTON

SUB AddButtonClick
  IF ListBox.ItemCount > 0 THEN
    '-- Aggiungere un bel separatore
    ListBox.AddItems '--------------------------------'
  END IF
  ListBox.AddItems NameEdit.Text, AddrEdit.Text, _
                   CityEdit.Text, PhEdit.Text
END SUB

SUB ClearButtonClick
  ListBox.Clear
END SUB

NameLabel.Parent = MainForm
NameLabel.Caption = 'Name:'
NameLabel.Top = 13
NameLabel.Left = 25
AddrLabel.Parent = MainForm
AddrLabel.Caption = 'Address:'
AddrLabel.Top = 38
AddrLabel.Left = 25
CityLabel.Parent = MainForm
CityLabel.Caption = 'City:'
CityLabel.Top = 63
CityLabel.Left = 25
PhLabel.Parent = MainForm
PhLabel.Caption = 'Phone #:'
PhLabel.Top = 88
PhLabel.Left = 25

NameEdit.Parent = MainForm
NameEdit.Left = 70
NameEdit.Top = 10
NameEdit.Width = 230
AddrEdit.Parent = MainForm
AddrEdit.Left = NameEdit.Left
AddrEdit.Width = NameEdit.Width
AddrEdit.Top = 35
CityEdit.Parent = MainForm
CityEdit.Left = NameEdit.Left
CityEdit.Width = NameEdit.Width
CityEdit.Top = 60
PhEdit.Parent = MainForm
PhEdit.Left = NameEdit.Left
PhEdit.Width = NameEdit.Width
PhEdit.Top = 85

AddButton.Parent = MainForm
AddButton.Left = 70
AddButton.Top = 115
AddButton.Width = 110
AddButton.Caption = '&Add to Database'
AddButton.OnClick = AddButtonClick
ClearButton.Parent = MainForm
ClearButton.Left = 190
ClearButton.Top = 115
ClearButton.Width = 110
ClearButton.Caption = '&Clear Database'
ClearButton.OnClick = ClearButtonClick

ListBox.Parent = MainForm
ListBox.Top = 150
ListBox.Left = 70
ListBox.Width = 230
ListBox.Height = 150

MainForm.Center
MainForm.Caption = 'My First Application'
MainForm.Height = 340
MainForm.Width = 350
MainForm.ShowModal