Technology Experience

Contenuti gestiti da Igor Damiani
posts - 949, comments - 2741, trackbacks - 15120

My Links

News

  • Questo blog si propone di raccogliere riflessioni, teoriche e pratiche, su tutto quello che riguarda il world-computing che mi sta attorno: programmazione in .NET, software attuale e futuro, notizie provenienti dal web, tecnologia in generale, open-source.

    L'idea è quella di lasciare una sorta di patrimonio personale, una raccolta di idee che un giorno potrebbe farmi sorridere, al pensiero di dov'ero e cosa stavo facendo.

    10/05/2005,
    Milano

Archives

Post Categories

Generale

Le mie (personali) linee-guida per il layout con WPF

WPF è un framework dalle innumerevoli caratteristiche che possono lasciare - credo - disorientato il neofita. Al di là di tante squisitezza tecnologiche, la cosa che mi ha fatto fatto più perdere tempo è l' auto-layout, ovvero la capacità di WPF di dimensionare e di posizionare i controlli sulle Windows o sulle Page in modo completamente automatico, seguendo logiche che probabilmente sono più vicine alla creazione delle pagine Web.

L'auto-layout permette innanzitutto di creare interfacce utente indipendenti dalla risoluzione. Scordatevi quindi di trascinare controlli dalla ToolBox sulla Window e di posizionarli dove e come volete voi. In realtà, potete farlo ancora: è sufficiente utilizzare il Canvas per ottenere esattamente lo stesso tipo di posizionamento che avete oggi con le classiche Windows Forms. Ovvio dire che l'utilizzo del Canvas è sconsigliato. La morale è questa: qualsiasi controllo assume le dimensioni del container che lo ospita. Se avete una Window e all'interno di essa definite una Grid con una sola riga ed una sola colonna, tale Grid sarà grande esattamente come la Window:

<Window x:Class="VivendoByte.CastingManager.TestWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="test" Background="LightYellow"> <Grid Background="LightGray"> <Grid.ColumnDefinitions><ColumnDefinition /></Grid.ColumnDefinitions> <Grid.RowDefinitions><RowDefinition /></Grid.RowDefinitions> </Grid> </Window>

La Grid ha uno sfondo LightGray, mentre il colore di sfondo della Window è LightYellow. Quest'ultimo colore però non viene visto, proprio perchè la Grid assume automaticamente le stesse dimensioni della Window e ne ricopre interamente la superficie. Se alla Grid assegniamo una proprietà Margin le cose cominciano a cambiare:

<Grid Background="LightGray" Margin="20"> ... </Grid>

In questi giorni, di sera, sto sviluppando un software commerciale in WPF, convertendo un software scritto in VB6.0 alcuni anni fa. Ho dovuto quindi ripensare in parte la struttura dell'applicazione, e ho dovuto anche ridisegnare le form trasformandole in Window di WPF. Come è facile intuire, non sono form semplici e ho dovuto litigare un pochino per ottenere un layout degno di questo nome. Le mie linee-guide sono, per adesso, le seguenti:

  1. Non assegno mai dimensioni ai controlli, lascio che esse vengano ereditate dai controlli contenitori e più in alto nel visual-tree
  2. Per evitare di avere Window definite in un unico gigantesco (e poco leggibili) XAML, definisco uno o più UserControl separati, che mi aiutano a disegnare poco alla volta o a debuggare meglio lo XAML stesso.
  3. Evito di assegnare in modo statico le dimensioni ai vari UserControl: come nel punto (1), faccio in modo che le dimensioni vengono assegnate automaticamente dal container nel quale lo UserControl viene inserito.
  4. Gioco con i Margin (spazio tra un controllo e l'altro) ed i Padding (spazio tra il bordo di un controllo ed il suo contenuto) per staccare i controlli l'uno dall'altro e per riempire in modo piacevole uno spazio (che sia GroupBox, un TabItem o simili).
  5. Gli unici momenti in cui assegno esplicitamente una Width od una Height sono le Grid. Se una Grid possiede solo righe, assegno le altezze di queste righe. Se una Grid possiede solo colonne, assegno le larghezze di queste colonne.
  6. Mi piace assegnare MinWidth e MinHeight alle Window. L'utente può ridimensionare finchè vuole, ma senza esagerare.
  7. Non uso mai e poi mai unità di misura particolari (come px, cm o roba del genere).
  8. Uso spesso l'asterisco (*) nei dimensionamenti, per indicare quando una colonna od una riga possono allargarsi o stringersi a piacere. Esempio: una Grid con 2 righe. 1° Riga : altezza fissa, contiene uno UserControl per esprimere diversi criteri con i quali fare ricerche. 2° Riga : altezza a piacere, contiene una ListBox che contiene i risultati della ricerca.

Non so se sono indicazioni corrette oppure no. Le ho semplicemente estratte dagli XAML e dalla mia esperienza proveniente dal mio primo vero progetto serio in WPF e mi sono state utili.

Print | posted on Monday, March 26, 2007 5:40 PM | Filed Under [ Sviluppo .NET ]

Feedback

Gravatar

# re: Le mie (personali) linee-guida per il layout con WPF

Controlli simili per la gestione dei layouts sono presenti anche in VS2005 per le "tradizionali" applicazioni .NET 2.0.
Dopo averne visto l'uso in WPF ho cominciato ad usarli nelle mie applicazioni..
Trovo che, superato lo scoglio iniziale, aiutano parecchio nell'imaginare l'aspetto di tutte le form.
3/26/2007 6:08 PM | Giancarlo Dellamora
Gravatar

# re: Le mie (personali) linee-guida per il layout con WPF

Nel mio commento "imaginare" va sostituito com "impaginare" (imparassi a rileggere quello che scrivo..) :-)
3/26/2007 6:10 PM | Giancarlo Dellamora
Comments have been closed on this topic.

Powered by:
Powered By Subtext Powered By ASP.NET