Procedura dettagliata: disposizione del contenuto WPF in Windows Form in fase di progettazione

Articolo
08/11/2011

Questa procedura dettagliata mostra come utilizzare le funzionalità di layout di Windows Form, ad esempio l'ancoraggio e le guide di allineamento, per disporre i controlli di Windows Presentation Foundation Presentation Foundation (WPF).

Questa procedura dettagliata prevede l'esecuzione delle attività seguenti:

Creare il progetto.
Creare il controllo WPF
Includere i controlli WPF in un pannello del layout.
Allineare i controlli WPF utilizzando le guide di allineamento.
Ancorare e agganciare i controlli WPF.

Nota

È possibile che le finestre di dialogo e i comandi di menu visualizzati siano diversi da quelli descritti nella Guida a seconda delle impostazioni attive o dell'edizione del programma. Per modificare le impostazioni, scegliere Importa/Esporta impostazioni dal menu Strumenti. Per ulteriori informazioni, vedere Gestione delle impostazioni.

Prerequisiti

Per completare la procedura dettagliata, è necessario disporre dei componenti seguenti:

Visual Studio 2010.

Creazione del progetto

Il primo passaggio consiste nella creazione del progetto Windows Form.

Nota

Con il contenuto WPF sono supportati solo progetti C# e Visual Basic.

Per creare il progetto

Creare un nuovo progetto di applicazione Windows Form, denominato ArrangeElmentHost, in Visual Basic o Visual C#. Per ulteriori informazioni, vedere Procedura: creare un nuovo progetto di applicazione Windows Form.

Creazione del controllo WPF

Dopo avere aggiunto un controllo WPF al progetto, è possibile disporlo sul modulo.

Per creare controlli WPF

Aggiungere un nuovo controllo UserControl WPF al progetto. Utilizzar il nome predefinito per il tipo di controllo UserControl1.xaml. Per ulteriori informazioni, vedere Procedura dettagliata: creazione di nuovo contenuto WPF in Windows Form in fase di progettazione.
In visualizzazione Progettazione verificare che UserControl1 sia selezionato. Per ulteriori informazioni, vedere Procedura: selezionare e spostare elementi sull'area di progettazione.
Nella finestra Proprietà impostare il valore delle proprietà Width e Height su 200.
Impostare il valore della proprietà Background su Blue.
Compilare il progetto.

Inclusione di controlli WPF in un pannello del layout

È possibile utilizzare i controlli WPF nei pannelli del layout nello stesso modo in cui si utilizzano gli altri controlli Windows Form.

Per includere i controlli WPF in un pannello del layout

Aprire Form1 in Progettazione Windows Form.
Nella Casella degli strumenti trascinare un controllo TableLayoutPanel sul form.
Nel pannello smart tag del controllo TableLayoutPanel, selezionare Rimuovi ultima riga.
Ridimensionare il controllo TableLayoutPanelimpostando una larghezza e un'altezza maggiori.
In Casella degli strumenti fare doppio clic UserControl1 per creare un'istanza di UserControl1 nella prima cella del controllo TableLayoutPanel.

L'istanza di UserControl1 è inclusa in un nuovo controllo ElementHost denominato elementHost1.
Nella Casella degli strumenti fare doppio clic su UserControl1 per creare un'altra istanza nella seconda cella del controllo TableLayoutPanel.
Nella finestra Struttura documento selezionare tableLayoutPanel1. Per ulteriori informazioni, vedere Finestra Struttura documento.
Nella finestra Proprietà impostare il valore della proprietà Padding su 10, 10, 10, 10.

Entrambi controlli ElementHost vengono ridimensionati per esser adattati al nuovo layout.

Allineare i controlli WPF utilizzando le guide di allineamento

Le guide di allineamento semplificano l'allineamento dei controlli su un modulo. È possibile utilizzare le guide di allineamento per allineare anche i controlli WPF. Per ulteriori informazioni, vedere Procedura dettagliata: disposizione dei controlli in Windows Form utilizzando guide di allineamento.

Per utilizzare le guide di allineamento per allineare i controlli WPF.

Da Casella degli strumenti trascinare un'istanza di UserControl1 sul modulo e posizionarla nello spazio sotto al controllo TableLayoutPanel.

L'istanza di UserControl1 è inclusa in un nuovo controllo ElementHost denominato elementHost3.
Tramite le guide di allineamento allineare il bordo sinistro di elementHost3 con il bordo sinistro del controllo TableLayoutPanel.
Tramite le guide di allineamento ridimensionare elementHost3 impostandolo sulla stessa larghezza del controllo TableLayoutPanel.
Spostare elementHost3 verso il controllo TableLayoutPanel finché non viene visualizzata una guida di allineamento centrale tra i due controlli.
Nella finestra Proprietà impostare il valore della proprietà Margin su 20, 20, 20, 20.
Spostare elementHost3 al di fuori del controllo TableLayoutPanel finché non viene di nuovo visualizzata la guida di allineamento centrale. La guida di allineamento centrale indica ora un margine di 20.
Spostare elementHost3 verso destra fino ad allineare il bordo sinistro a quello di elementHost1.
Modificare la larghezza di elementHost3 finché il bordo destro non è allineato a quello destro di elementHost2.

Ancoraggio e aggancio di controlli WPF

Un controllo WPF incluso in un modulo è soggetto alle stesse regole di ancoraggio e aggancio degli altri controlli Windows Form.

Per ancorare e agganciare i controlli WPF

Selezionare elementHost1.
Nella finestra Proprietà impostare la proprietà Anchor su Top, Bottom, Left, Right.
Ridimensionare il controllo TableLayoutPanel impostandolo su una dimensione superiore.

Il controllo elementHost1 si estenderà fino ad occupare l'intera cella.
Selezionare elementHost2.
Nella finestra Proprietà impostare il valore della proprietà Dock su Fill.

Il controllo elementHost2 si estenderà fino ad occupare l'intera cella.
Selezionare il controllo TableLayoutPanel.
Impostare il valore della proprietà Dock su Top.
Selezionare elementHost3.
Impostare il valore della proprietà Dock su Fill.

Il controllo elementHost3 si estenderà fino a occupare lo spazio rimanente sul modulo.
Ridimensionare il form.

Tutti i tre controlli ElementHost verranno ridimensionati in maniera appropriata.

Per ulteriori informazioni, vedere Procedura: agganciare e ancorare controlli figlio in un controllo TableLayoutPanel.

Vedere anche

Condividi tramite