2009-07-02 13 views
11

Sto cercando un parere sull'utilizzo dei pannelli Canvas vs. Grid in WPF. Ho bisogno di creare forme di input classiche che hanno fondamentalmente layout di griglia, alcuni possono avere piccoli datagrids all'interno, groupbox, ma tutti allineati nella griglia. Sto lottando se usare il pannello Grid o Canvas per tutte le mie forme. La griglia mi sta dando una buona struttura; Posso mantenere più facilmente l'allineamento dei controlli Avrò una classe base (che eredita la classe Window) per tutte le finestre, quindi designer in Visual Studio sarà inutile, dal momento che ha problemi per questo tipo di ereditarietà, e con il pannello Grid non ho davvero nemmeno bisogno di designer, e posso imposta finestra SizeToContent in modo che tutto vada bene. Ma di nuovo con Canvas, ho la possibilità di posizionare i controlli in qualsiasi modo mi piaccia, e questo è solo un beneficio che vedo quando utilizzo Canvas.Grid vs. Canvas

Non avevo tanta esperienza in WPF per prevedere quali tipi di problemi potrei ottenere dalle richieste dei clienti sul layout. Sui moduli Web a volte utilizzo il posizionamento assoluto per i moduli solo nel caso in cui il cliente abbia qualche richiesta "speciale" di avere il pixel di controllo a destra o a sinistra in alto, ecc. Tutti hanno lavorato con clienti esigenti sanno cosa intendo.

Mi piacerebbe vedere cosa ne pensi, quali sono i pro e i contro per entrambi nella creazione di layout di moduli di applicazioni aziendali? Perché uno è migliore dell'altro? Eventuali casi in cui un pannello sarebbe male da usare, e altri no? Quali sono gli svantaggi di un pannello rispetto all'altro? Quale pannello useresti?

Grazie

risposta

16

tela di canapa è in gran parte destinati a funzionalità disegno personalizzato più di ogni altra cosa. La griglia è sicuramente la migliore scelta disponibile per personalizzare il tuo layout.

+0

Sono d'accordo con CSharperWithJava - è un elemento molto più pratico per il layout generale dell'interfaccia utente. – Giffyguy

+1

Avrai voglia di andare con un layout basato su Grid o Panel. Dai un'occhiata alla panoramica di MSDN del sistema di layout WPF: http://msdn.microsoft.com/en-us/library/ms745058.aspx – rmoore

+0

Ecco un tutorial per iniziare a utilizzare i layout di griglia: http: // www .wpftutorial.net/GridLayout.html – CodeFusionMobile

2

Definitivamente Le griglie sembrano essere ciò di cui avete bisogno per le vostre esigenze.

Vorrei paragonare le griglie alle tabelle in html (molto utile se usato in modo appropriato), mentre Canvas è più simile a div. La differenza è che le griglie sono le tabelle che dovrebbero essere in HTML e allo stesso modo con div e contro Canvas.

Sull'argomento delle griglie, prenditi il ​​tempo necessario per definire RowDefinitions e ColumnDefinitions, piuttosto che inserire margini sui controlli per posizionare tutto correttamente. Te ne pentirai se non lo fai.

+2

Eh ... lo sai che usare le tabelle per scopi di layout non è raccomandato, giusto? – luiscubal

+0

assolutamente, ma per questo esempio volevo qualcosa da usare come esempio, ho pensato che sarebbe il miglior esempio. Come ho già detto, le griglie in WPF sono ciò che le tabelle cercavano di essere in HTML. –

3

È possibile ottenere abbastanza a fondo con il layout attuale della griglia, colonna/riga spanning, larghezza, altezza, ecc

a mio parere è sarebbe più facile da fare il layout dei vari elementi di una griglia controllando la riga e la colonna sizez di quanto facciano tutto ciò che è codificato in una tela. Renderà anche le cose più facili se decidono di cambiare le risoluzioni più avanti lungo la strada.

Da Adam Nathan WPF Unleashed (. P 168):

Imitando una tela con griglia se si lascia griglia con una sola riga e colonna e impostare il HorizontalAlignment e VerticalAlignment di tutti i bambini hanno valori diversi da Stretch, i bambini vengono aggiunti a la singola cella proprio come una tela. Impostazione di HorizontalAlignment su Left e VerticalAlignment to Top è come impostare Canvas.Left e Canvas.Top su 0. Impostazione HorizontalAlignment to Right e VerticalAlignment to Bottom è come impostare Canvas.Right e Canvas.Bottom su 0.Inoltre, l'applicazione dei valori Margine a ciascun elemento può darti lo stesso effetto dell'impostazione delle proprietà allegate di Canvas agli stessi valori .

È inoltre possibile essere creativi con il contenuto dei controlli nella griglia per avere un livello più preciso di controllo del layout.

Una tela può essere utile per qualcosa di simile a una finestra di dialogo che cambierà raramente le dimensioni e ha solo pochi controlli su di essa, perché richiederebbe molto tempo per sovrapporli man mano che il numero aumenta.

Personalmente uso le griglie da solo. Può essere un po 'più di lavoro per mettere le cose a livello di pixel, ma per il 5% del tempo è necessario ne vale la pena per sottrarre un sacco di problemi. È anche utile quando è necessario ridimensionare al volo righe e colonne, il GridSplitter lo rende istantaneo.

0

Anche se non è possibile utilizzare VS Designer, è comunque possibile utilizzare un visual designer XAML per creare/modificare il contenuto della griglia.

Uno dei principali vantaggi di UX di WPF/SL/XAML è la capacità di layout "liquido" simile a HTML. Anche se potresti non averne bisogno con il tuo attuale design, è chiaramente il futuro e vale la pena imparare come fare. ottima lista di

Controllare Rob Relyea di disposizione XAML editors

+0

Collegamento interrotto, correggere – kbo4sho88

0

vorrei andare con una griglia o una griglia sottoclasse specializzata. Hai ragione su Visualizza ereditarietà. Il designer di Visual Studio in UWP, WPF genera il codice di supporto per la base e la sottoclasse con gli stessi nomi di metodo. Non viene compilato.

Dato che sono pre-generici possiamo tornare alle metodologie precedenti. Uno di questi è una classe di supporto. Ogni vista implementa IBaseView e ha una proprietà ViewHelper o ViewHelper<T>. enum ViewHelperOptions potrebbe essere necessario. Se necessario, ciascuno dei ViewHelper può utilizzare l'ereditarietà senza interrompere Visual Designer. Ciò consente l'uso di codice generico e codice di visualizzazione specifico senza interrompere il modello MVVM. Chiamiamolo MVHVM poiché ViewHelper ha una conoscenza di ViewHelper. Questo separa ulteriormente la V dalla VM.

L'implementazione completa potrebbe richiedere l'utilizzo di Activator.CreateInstance. Un'altra considerazione sono i costruttori che sono invocati dal progettista. Devi spostare tutto il codice "will-crash-if-not-running" in un'inizializzazione generata da (diciamo) l'evento Loaded. In alternativa è possibile fare uso di (UWP):

if (!Windows.ApplicationModel.DesignMode.DesignModeEnabled) 
{ DoStuffWhichShouldOnlyBeDoneAtRunTime(); }