Come creare un'interfaccia grafica in NetBeans

Tramite: O2O 22/08/2016
Difficoltà: media
18

Introduzione

In tale guida verrà descritto come creare un'interfaccia grafica in NetBeans sfruttando un comodo editor Drag & Drop messo a disposizione dal programma. Il linguaggio che verrà utilizzato sarà java e, grazie all'utilizzo dell'editor, sarà possibile inserire con semplicità Bottoni, Etichette, Aree di testo, Menù.

28

Occorrente

  • NetBeans
38

creare un'interfaccia grafica (GUI: Graphical User Interface) in NetBeans è semplicissimo, veloce e senza scrivere una riga di codice in quanto ci penserà stesso il programma a generarlo al posto nostro una volta trascinato gli oggetti grafici nella rispettiva area disegno, come vedremo tra poco. L'obiettivo di questo minitutorial consiste nel creare una semplice applicazione grafica costituita da una finestra in cui vi è un pulsante, il quale, una volta premuto, visualizzerà in un'etichetta un messaggio, per esempio Hello World!. Il risultato finale sarà il seguente:.

48

Innanzitutto creiamo un nuovo progetto vuoto di un'applicazione Java seguendo la procedura vista nell'articolo "Creare ed eseguire un'applicazione in NetBeans", togliendo, però, il segno di spunta a Create Main Class. Chiamiamo il nostro progetto, per esempio, GUI. Ora dobbiamo creare la finestra in cui verranno, poi, inseriti il pulsante e l'etichetta; quindi, clicchiamo col tasto destro sul progetto appena creato e selezioniamo dal menu a tendina Nuovo>JFrame Form....A questo punto apparirà la finestra Nuovo JFrame Form. Inseriamo nell'apposita casella Nome della Classe un nome da dare alla finestra, per esempio lasciamo quello di default NewJFrame, e clicchiamo su Termina. NetBeans a questo punto suddivide/adatta il piano di lavoro in modo da avere tutto sotto mano nella realizzazione dell'interfaccia grafica; in particolare le aree principali sono quelle evidenziate nella figura 2.

Continua la lettura
58

Nell'area Ispezione sono presenti tutti gli oggetti aggiunti nella nostra interfaccia grafica. Essi vengono organizzati ad albero dove un oggetto nodo può identificare un contenitore nel quale sono presenti altri oggetti; questa organizzazione consente, oltre a facilitare la selezione di un determinato oggetto, che potrebbe risultare difficile in una GUI molto più complessa, di comprendere com' è strutturata l'interfaccia grafica che stiamo realizzando. L'area Disegno è dove vengono inseriti e posizionati i nostri oggetti grafici, attraverso un drag and drop, nella finestra appena creata. La Tavolozza contiene l'insieme di tutti gli oggetti grafici che possiamo utilizzare suddivisi in categorie, basta selezionare quello che ci interessa e trascinarlo nell'area disegno. L'area Proprietà oggetto consente di visualizzare/modificare tutte le proprietà, disponibili in fase di progettazione, di un determinato oggetto selezionato e di gestire gli eventi ad esso associato. Come si può notare in quest'area sono presenti delle tabs (Proprietà, Binding, Events, Code) che suddividono le caratteristiche dell'oggetto in esame. Ora dobbiamo aggiungere alla nostra finestra gli oggetti che ci interessano, ovvero: Dalla tavolozza estendiamo la categoria Swing Controls, quindi selezioniamo e trasciniamo nell'area disegno, rispettivamente, gli oggetti Etichetta e Pulsante (figura 3).

68

1. Selezioniamo il pulsante o dall'area inspector o direttamente dall'area disegno.2. Andiamo nell'area delle proprietà dell'oggetto "Pulsante"; assicuriamoci che la tab Proprietà sia attiva e andiamo a modificare la proprietà text che consente di cambiare il testo del pulsante: inseriamo per esempio Saluta!. Ora selezioniamo l'etichetta e nell'area proprietà, nella tab Proprietà, modifichiamo il carattere del testo cliccando sui tre puntini accanto alla proprietà font (figura 5). Attiviamo la tab Code, sempre dell'oggetto Etichetta, e cambiamo il nome della variabile (Variable Name) da jLabel1 ad un nome a piacere, per esempio msg_lbl, il quale ci consentirà nel codice di richiamare modificare la proprietà text dell'etichetta e, quindi, di cambiarla in fase di run time. È buona norma dare un nome significativo all'oggetto in modo tale da comprendere meglio la lettura del codice.

Immaginate un'interfaccia composta da tantissimi oggetti lasciando i nomi di default e riprendere il codice dell'applicazione dopo qualche giorno: fareste una faticaccia solo per capire a quale oggetto state facendo riferimento! Per il motivo suddetto facciamo la stessa cosa anche per il pulsante, cambiando il nome della variabile da jButton1 asaluta_btn. Per vedere un'anteprima dell'aspetto grafico dell'interfaccia clicchiamo sull'apposito pulsante Preview Design (figura 7). Questa operazione, come detto, visualizza solo l'aspetto grafico e quindi ogni eventuale funzionalità dei componenti dell'interfaccia, implementate col codice, non sono eseguite (fanno eccezione le funzionalità della finestra come la chiusura e il ridimensionamento della stessa). Ora ciò che ci resta da fare è inserire il codice che visualizza il messaggio nell'etichetta una volta premuto il pulsante. Per fare questo dovremmo gestire l'evento actionPerformed del pulsante, inserendo un ascoltatore di eventi eccetera eccetera; queste scocciature vengono evitate da NetBeans, vediamo come: Selezioniamo il pulsante saluta_btn, rinominato precedentemente, andiamo nell'area delle proprietà e attiviamo la tab Events. Qui vengono elencati tutti gli eventi standard associabili al pulsante. A noi interessa l'evento actionPerformed, quindi attiviamolo selezionando, dalla lista a discesa accanto all'evento stesso, il nome del nostro pulsante. A questo punto si aprirà l'editor di testo. Cosa è successo? NetBeans ha creato automaticamente una procedura a cui è associato l'evento actionPerformed e che viene eseguita ogni volta che premiamo sul pulsante; quindi, qui dobbiamo scrivere il codice che visualizzerà il messaggio: view sourceprint?1private void saluta_btnActionPerformed (java. Awt. Event. ActionEvent evt){2 // TODO add your handling code here:3 msg_lbl. SetText ("Hello world!");4}
All'avvio del programma bisogna cancellare la scritta di default dell'etichetta (potremmo farlo anche attraverso l'area delle proprietà ma in questo modo non noteremmo l'oggetto nell'area disegno), quindi posizioniamoci nel costruttore della classa NewJFramee scriviamo la seguente linea di codice: 1msg_lbl. SetText (null); Da notare che nel costruttore vi è già un altro metodo che viene richiamato ed è initComponents (). Questo metodo viene generato automaticamente dal programma e contiene tutto il codice dell'interfaccia grafica che abbiamo costruito nell'area disegno; il codice non può essere modificato direttamente ma solo attraverso l'area delle proprietà dei singoli oggetti. A questo punto non ci resta che lanciare l'applicazione e vedere l'effetto finale.

78

Guarda il video

Potrebbe interessarti anche

Segnala contenuti non appropriati

Tipo di contenuto
Devi scegliere almeno una delle opzioni
Descrivi il problema
Devi inserire una descrizione del problema
Si è verificato un errore nel sistema. Riprova più tardi.
Segnala il video che ritieni inappropriato
Devi selezionare il video che desideri segnalare
Verifica la tua identità
Devi verificare la tua identità
chiudi
Grazie per averci aiutato a migliorare la qualità dei nostri contenuti

Guide simili

Windows

Come creare un nuovo progetto NetBeans

In seguito, in questa guida vi verrà mostrato come creare un nuovo progetto in NetBeans per quanto riguarda la programmazione in java. In seguito alla creazione del progetto sarà possibile scrivere i propri programmi, direttamente dall'editor di questo...
Windows

Come modificare l'interfaccia di Windows 7

Uno dei punti di forza a livello visivo di Windows 7 è dato dall'ampia personalizzazione della propria interfaccia. L'avvento della shell Windows Aero e la possibilità di inserire gadget sul proprio desktop, permettono all'utente di rendere il proprio...
Windows

Come aggiornare il driver della scheda grafica ATI Radeon

La scheda grafica ATI Radeon, come qualunque altra scheda video del mercato, ha bisogno di adattatori di hardware per eseguire operazioni grafiche. Questi driver si usano per correggere errori e per migliorare la capacità della tua scheda video. Vediamo...
Windows

Come disegnare con Photoshop senza tavoletta grafica

Photoshop è un software che ci permette di realizzare una vsta gamma di lavori in ambito grafico. Oltre ad offrire pratici strumenti per il design, esso si occupa anche dell'editing di fotografie. Grazie al fotoritocco abbiamo modo di perfezionare i...
Windows

Come creare un'interfaccia di navigazione Access

Le interfacce di navigazione Access sono delle maschere (il termine corretto è maschera di spostamento) che permettono di navigare tra maschere/report/tabelle con estrema facilità, esattamente come si fa nelle pagine web. In questa guida vedremo come...
Windows

come disegnare con la grafica vettoriale di coreldraw

I programmi di elaborazione e di creazione delle immagini, come per esempio Paint o CorelDraw, si basano su due principi molto diversi. Paint si basa su grafica bitmap, mentre Corel su grafica vettoriale, che può visualizzare qualsiasi immagine e definirne...
Windows

Come sfruttare al massimo la tua scheda grafica

Molti dei computer in vendita oggi possiedono un quantitativo di RAM superiore ai 4GB e un sistema operativo a 64 bit in grado di sfruttare appieno tutta la grafica e potenza del PC, ma capita anche di trovare PC dotati di 4GB (o più) di RAM e un sistema...
Windows

Come creare interfacce grafiche per android in modo visuale

Uno degli ostacoli maggiori che un qualsiasi programmatore alle prime armi si trova a dover affrontare, è sicuramente la realizzazione di un'interfaccia grafica accattivante per la propria applicazione. Fortunatamente, però, esistono degli strumenti...