Tutorial Flash #3 - Display size procedure
Ciao ragazzi,
oggi andremo a vedere un nuovo tutorial super rapido, naturalmente sono spunti che poi dovrete sviluppare o perché no migliorare in autonomia.
Quando si inizia a programmare con ambienti simili ad AppInventor, e magari da autodidatta come me, sono tante le cose che possono sfuggire specialmente all'inizio.
Vi siete mai chiesti cosa succede nel momento in cui la nostra app viene fatta girare su dispositivi con display differenti da quello usato per fare i test ? In realtà non lo so nemmeno io bene :-) Come verranno visualizzati tutti i componenti che abbiamo inserito?
Diciamo che se durante la creazione dell'app abbiamo usato sapientemente le dimensioni in percentuale e il fill parent non dovremmo avere brutte sorprese o meglio la visione dovrebbe essere proporzionata con quello che vediamo sul display test. E' anche vero che oggi in commercio ci sono veramente tanti dispositivi quindi caratteristiche differenti e bisogna conosce molto di più del trucchetto che vedremo tra poco.
Lo andremo ad utilizzare con la grandezza del font dei nostri componenti perché è un valore che non si modifica in automatico con il componente e non si può impostare in percentuale; volendo lo stesso metodo si può applicare anche alla dimensione dei vari componenti se non vogliamo affidarci alla percentuale ma facciamo attenzione all'altezza.
Vediamo il codice.
Considerando la prima procedura, andiamo a paragonare la larghezza del display in uso (quindi dell'utilizzatore,che cambia di volta in volta) con Screen Width e la dimensione del display test (in questo caso il mio ) cioè 360 la stessa proporzione dovrà essere mantenuta anche tra la grandezza del font dell'utilizzatore , che dobbiamo calcolare, e la grandezza che ho scelto io durante la programmazione.
La proporzione generale sarà qualcosa del genere : Dimensione font utilizzatore : Dimensione font test = Larghezza display utilizzatore : Larghezza display test
Il prodotto dei medi è uguale al prodotto degli estremi da cui avremo -> Dim. font utilizzatore = (Dim. font test x Larg. display utilizzatore) / Larg. display test
Bene la prima procedura fa proprio questo calcolo ma in un modo molto particolare, preleva il valore del font che ho inserito io nell'app tramite il blocco call new font passando l'elemento font size (80 per Button1) lo passa alla procedura con result che farà il calcolo (considerando anche la nuova larghezza dello screen ) restituendo un nuovo valore che servirà per impostare la grandezza del font dei componenti. Vi ricordo che creando la prima procedura, premendo sull'ingranaggio potrete aggiungere nuovi elementi, come ho fatto con font size e in automatico verrà generato anche il blocco collegato call new font.
La seconda procedura è più semplice e permette di mandare in esecuzione, quando voglio, tutti i cambi di font lanciando il blocco corrispondente call resize font.
Bene abbiamo visto come modificare la grandezza del testo per ogni display in automatico e come utilizzare una tipologia di procedura molto utile per ricavare dati da valori a seguito di valori passati per il calcolo che naturalmente possono anche variare nel tempo o a seconda della situazione .
Date sfogo alla vostra immaginazione.
Alla prossima.
Come sempre vi lascio il link al progetto in formato .aia per testarlo e vedere il codice all'interno Link al progetto
Se hai apprezzato il mio lavoro offrimi un bel caffè 😍
Commenti
Posta un commento