Includere Libro in videata
copia linkTrascrizione

Ripartiamo dalla visualizzazione del prototipo così da renderci conto di cosa dobbiamo ancora creare. La videata Situazione contiene 3 riquadri, nel riquadro superiore sinistro ha trovato posto un pannello basato su una tabella IMDB. Dobbiamo ora preoccuparci dei restanti riquadri che saranno entrambi creati con l’utilizzo dell’oggetto Libro.
Passiamo al progetto, mostrando in progettazione la videata Situazione. Nella porzione sinistra inferiore possiamo aggiungere elementi, nel nostro riquadro a sinistra: con il Tasto Destro, Aggiungi Libro. (Con questo meccanismo abbiamo incluso un libro direttamente in una videata, nello specifico in una porzione di videata.)
Doppio clic sul libro, per modificarne le proprietà. Assegniamo come nome Libro Servizi ed impostiamo anche due flag (di norma, sono sempre da attivare nel caso di interfacce dinamiche) :
Confermando, possiamo già vedere in progettazione, nel riquadro, l’assenza di toolbar e anche l’assenza dei bordi.
Sono visibili, però, solo delle scrollbar, dovute alla dimensione eccessiva del libro rispetto allo spazio del riquadro.
Invito sempre a eliminare in progettazione le scrollbar, ridimensionando in maniera corretta il libro, più precisamente impostando le dimensioni opportune nell’oggetto Nuova Pagina Mastro. Per cui, modifichiamo le proprietà con un doppio clic su Nuova Pagina Mastro.
Come formato della Pagina, seleziono la voce Personalizzato, in quanto nessun formato elencato sarà applicabile al riquadro. Ovviamente, scegliendo la voce Personalizzato, dobbiamo impostare manualmente le Dimensioni di larghezza e altezza. La complicanza è data dal fatto che le dimensioni sono espresse in millimetri ed invece le dimensioni pannello o riquadro sono in pixel.
Tralascio questa impostazione. Tra poco vi suggerisco un trucco. Prima, però, di confermare, valorizzo anche la proprietà Adattamento al valore Adatta alla pagina cosicché, a runtime, il libro si adatta alla dimensione del browser.
Confermo e ricontrollo la videata, dove noto che non è cambiato nulla. Ovviamente non è cambiato nulla perché non abbiamo modificato la dimensione.
Ecco lo stratagemma che vi dicevo prima. Fate in modo di avere nell’interfaccia di Instant Developer a destra il pannello delle Proprietà (nel caso non lo abbiate, dal Menu Visualizza, Finestra Proprietà) .
Ora, selezioniamo nell’albero di progetto, l’oggetto, con un clic semplice, Nuova Pagina Mastro, un clic singolo e teniamo sott'occhio la videata. Utilizzando la finestra Proprietà possiamo modificare i valori di Altezza e Larghezza, fino a quando ci soddisfano. Precisamente, fino a quando saranno scomparse le scrollbar. Provo anche io a modificarli.
Come altezza 45.
Come larghezza 50.
Risultato ottenuto: le scrollbar sono scomparse, però, avendo ridimensionato la Pagina Mastro, sicuramente abbiamo ridimensionato anche le box contenute nella Pagina Mastro, precisamente: Testata Pagina, Corpo Pagina e Piede Pagina.
Quindi, doppio clic sulla Pagina Mastro per mostrarla in progettazione, andiamo a ridimensionare, nella maniera corretta le box. Abbiamo Testata Pagina, la teniamo nella parte superiore. Abbiamo un Corpo Pagina. Il Piede Pagina in teoria non ci interessa, lo cancello. Possiamo quasi aver terminato, se riesco a trascinare questo, lo faccio manualmente, perchè, così: perfetto.
Quindi, con questa ultima modifica abbiamo preparato il riquadro inferiore. Ovviamente, la stessa modalità dovrà essere utilizzata per il riquadro centrale, che vi lascio come esercitazione: aggiungerete al riquadro centrale un oggetto libro, toglierete l’aspetto classico dell’anteprima stampa ed andrete a ridimensionarlo, per farlo comparire correttamente all’interno della videata.
Nella prossima lezione il progetto conterrà già il libro del riquadro centrale correttamente impostato.
Passiamo al progetto, mostrando in progettazione la videata Situazione. Nella porzione sinistra inferiore possiamo aggiungere elementi, nel nostro riquadro a sinistra: con il Tasto Destro, Aggiungi Libro. (Con questo meccanismo abbiamo incluso un libro direttamente in una videata, nello specifico in una porzione di videata.)
Doppio clic sul libro, per modificarne le proprietà. Assegniamo come nome Libro Servizi ed impostiamo anche due flag (di norma, sono sempre da attivare nel caso di interfacce dinamiche) :
- Nascondi Bordi pagina in Anteprima: questo check nasconde l’effetto classico dell’anteprima di stampa che visualizza normalmente un foglio con dei bordi
- Nascondi Riquadro: questo check nasconde l’intera toolbar che di solito compare con l’anteprima screen.
Confermando, possiamo già vedere in progettazione, nel riquadro, l’assenza di toolbar e anche l’assenza dei bordi.
Sono visibili, però, solo delle scrollbar, dovute alla dimensione eccessiva del libro rispetto allo spazio del riquadro.
Invito sempre a eliminare in progettazione le scrollbar, ridimensionando in maniera corretta il libro, più precisamente impostando le dimensioni opportune nell’oggetto Nuova Pagina Mastro. Per cui, modifichiamo le proprietà con un doppio clic su Nuova Pagina Mastro.
Come formato della Pagina, seleziono la voce Personalizzato, in quanto nessun formato elencato sarà applicabile al riquadro. Ovviamente, scegliendo la voce Personalizzato, dobbiamo impostare manualmente le Dimensioni di larghezza e altezza. La complicanza è data dal fatto che le dimensioni sono espresse in millimetri ed invece le dimensioni pannello o riquadro sono in pixel.
Tralascio questa impostazione. Tra poco vi suggerisco un trucco. Prima, però, di confermare, valorizzo anche la proprietà Adattamento al valore Adatta alla pagina cosicché, a runtime, il libro si adatta alla dimensione del browser.
Confermo e ricontrollo la videata, dove noto che non è cambiato nulla. Ovviamente non è cambiato nulla perché non abbiamo modificato la dimensione.
Ecco lo stratagemma che vi dicevo prima. Fate in modo di avere nell’interfaccia di Instant Developer a destra il pannello delle Proprietà (nel caso non lo abbiate, dal Menu Visualizza, Finestra Proprietà) .
Ora, selezioniamo nell’albero di progetto, l’oggetto, con un clic semplice, Nuova Pagina Mastro, un clic singolo e teniamo sott'occhio la videata. Utilizzando la finestra Proprietà possiamo modificare i valori di Altezza e Larghezza, fino a quando ci soddisfano. Precisamente, fino a quando saranno scomparse le scrollbar. Provo anche io a modificarli.
Come altezza 45.
Come larghezza 50.
Risultato ottenuto: le scrollbar sono scomparse, però, avendo ridimensionato la Pagina Mastro, sicuramente abbiamo ridimensionato anche le box contenute nella Pagina Mastro, precisamente: Testata Pagina, Corpo Pagina e Piede Pagina.
Quindi, doppio clic sulla Pagina Mastro per mostrarla in progettazione, andiamo a ridimensionare, nella maniera corretta le box. Abbiamo Testata Pagina, la teniamo nella parte superiore. Abbiamo un Corpo Pagina. Il Piede Pagina in teoria non ci interessa, lo cancello. Possiamo quasi aver terminato, se riesco a trascinare questo, lo faccio manualmente, perchè, così: perfetto.
Quindi, con questa ultima modifica abbiamo preparato il riquadro inferiore. Ovviamente, la stessa modalità dovrà essere utilizzata per il riquadro centrale, che vi lascio come esercitazione: aggiungerete al riquadro centrale un oggetto libro, toglierete l’aspetto classico dell’anteprima stampa ed andrete a ridimensionarlo, per farlo comparire correttamente all’interno della videata.
Nella prossima lezione il progetto conterrà già il libro del riquadro centrale correttamente impostato.
Ultima modifica: 08/06/2021 / Validità: da 21.0.8100