Passaggio 5: aggiungere controlli al form

In questo passaggio si aggiungono controlli, ad esempio un controllo PictureBox e un controllo CheckBox, al form.Si aggiungeranno quindi pulsanti al form.

per una versione video di questo argomento, vedere esercitazione 1: Creare un Visualizzatore immagini in Visual Basic alla visualizzazione 2 o esercitazione 1: Creare un Visualizzatore immagini in c# - la visualizzazione 2.

Per aggiungere controlli al form

1. Andare alla Casella degli strumenti ed espandere il gruppo Controlli comuni.Verranno visualizzati i controlli più comuni dei form.

2. Fare doppio clic sul controllo PictureBox.L'IDE aggiunge un controllo PictureBox al form.Poiché TableLayoutPanel è ancorato in modo da riempire il form, l'IDE aggiunge il controllo PictureBox alla prima cella vuota.

3. Fare clic sul triangolo nero sul nuovo controllo PictureBox per visualizzare il relativo elenco attività, come mostrato nell'immagine seguente.

   Attività relative a PictureBox

   

   [!NOTA]

   Se accidentalmente si aggiunge il tipo non corretto di controllo a TableLayoutPanel, è possibile eliminarlo.Fare clic con il pulsante destro del mouse sul controllo, quindi scegliere Elimina dal menu.È inoltre possibile scegliere Annulla dal menu Modifica per rimuovere i controlli dal form.

4. Fare clic sul collegamento Ancora nel contenitore padre.La proprietà Dock di PictureBox verrà automaticamente impostata su Fill.Per verificarlo, fare clic sul controllo PictureBox per selezionarlo, andare alla finestra Proprietà e accertarsi che la proprietà Dock sia impostata su Fill.

5. Estendere il controllo PictureBox su entrambe le colonne modificandone la proprietà ColumnSpan.Selezionare il controllo PictureBox e impostare la relativa proprietà ColumnSpan su 2.Inoltre, quando PictureBox è vuoto, si desidera visualizzare un frame vuoto.Impostare la proprietà BorderStyle su Fixed3D.

6. Aggiungere il controllo CheckBox al form.Fare doppio clic sull'elemento CheckBox nella Casella degli strumenti per consentire all'IDE di aggiungere un nuovo controllo CheckBox alla cella libera successiva della tabella.Poiché un controllo PictureBox occupa le prime due celle, viene aggiunto un controllo CheckBox alla cella inferiore sinistra.Selezionare il nuovo controllo CheckBox e impostare la proprietà Text su Stretch come mostrato nell'immagine seguente.

   Controllo TextBox con la proprietà Stretch

   

7. Andare al gruppo Contenitori nella Casella degli strumenti (dove si è ottenuto il controllo TableLayoutPanel) e fare doppio clic sull'elemento FlowLayoutPanel per aggiungere un nuovo controllo all'ultima cella di PictureBox.Ancorarlo quindi nel contenitore padre (scegliendo Ancora nel contenitore padre dall'elenco attività o impostando la relativa proprietà Dock su Fill).

   [!NOTA]

   Un controllo FlowLayoutPanel è un contenitore che dispone gli altri controlli nelle righe in modo corretto e ordinato.Quando si ridimensiona un controllo FlowLayoutPanel, tutti i controlli vengono disposti in una singola riga, se esiste spazio.In caso contrario, vengono disposti su più righe, uno sopra l'altro.Si utilizzerà un controllo FlowLayoutPanel per contenere quattro pulsanti.

Per aggiungere pulsanti

1. Selezionare il controllo FlowLayoutPanel aggiunto.Andare a Controlli comuni nella Casella degli strumenti e fare doppio clic sull'icona Pulsante per aggiungere un pulsante chiamato button1 al controllo FlowLayoutPanel.Ripetere l'operazione per aggiungere un altro pulsante.L'IDE determina che un pulsante chiamato button1 esiste già e denomina il successivo button2.

   [!NOTA]

   In Visual Basic i pulsanti sono denominati con l'iniziale maiuscola, pertanto button1 è Button1, button2 è Button2 e così via.

2. In genere, si aggiungono gli altri pulsanti utilizzando la Casella degli strumenti.Questa volta, fare clic su button2, quindi scegliere Copia dal menu Modifica (o premere CTRL+C).Scegliere Incolla dal menu Modifica (o premere CTRL+V) per incollare una copia del pulsante.Ora incollarlo nuovamente.L'IDE ha aggiunto button3 e button4.

   [!NOTA]

   È possibile copiare e incollare qualsiasi controllo.L'IDE denomina e posiziona i nuovi controlli in modo logico.Se si incolla un controllo in un contenitore, l'IDE sceglie lo spazio logico successivo per la posizione.

3. Selezionare il primo pulsante e impostare la relativa proprietà Text su Visualizza immagine.Impostare quindi le proprietà Text dei tre pulsanti successivi su Cancella immagine, Imposta colore di sfondo e Chiudi.

4. Il passaggio successivo consiste nel ridimensionare i pulsanti e nel disporli in modo che vengano allineati sul lato sinistro del pannello.Selezionare il controllo FlowLayoutPanel e analizzare la relativa proprietà FlowDirection.Modificarla in modo che venga impostata su RightToLeft.I pulsanti vengono immediatamente allineati sul lato destro della cella e l'ordine viene invertito in modo che il pulsante Visualizza immagine si trovi sulla destra.

   [!NOTA]

   Se i pulsanti sono ancora nell'ordine errato, è possibile trascinarli nel controllo FlowLayoutPanel per ridisporli in qualsiasi ordine.È possibile fare clic su uno dei pulsanti e trascinarlo verso sinistra o verso destra.

5. Fare clic sul pulsante Chiudi per selezionarlo.Tenere premuto il tasto CTRL e fare clic sugli altri tre pulsanti, in modo che siano tutti selezionati.Mentre tutti i pulsanti sono selezionati, andare alla finestra Proprietà e scorrere verso l'alto fino alla proprietà AutoSize.Questa proprietà consente di ridimensionare automaticamente il pulsante in modo che si adatti a tutto il testo.Impostarla su true.I pulsanti sono ora ridimensionati correttamente e si trovano nell'ordine corretto.Finché i quattro pulsanti sono selezionati, è possibile modificare contemporaneamente le quattro proprietà AutoSize. Nell'immagine riportata di seguito vengono illustrati i quattro pulsanti.

   Visualizzatore immagini con quattro pulsanti

   

6. Ora eseguire nuovamente il programma per visualizzare il form con il nuovo layout.Facendo clic sui pulsanti e sulla casella di controllo non viene prodotto ancora nessun risultato, ma i controlli funzioneranno a breve.

Per continuare o rivedere l'esercitazione

• Per andare al passaggio successivo dell'esercitazione, vedere Passaggio 6: assegnare un nome ai pulsanti.

• Per tornare al passaggio precedente dell'esercitazione, vedere Passaggio 4: creare il layout del form con un controllo TableLayoutPanel.