I gradienti

Gli oggetti grafici hanno la proprietà gradiente che può essere utilizzata per creare ottimi effetti o addirittura animazioni.

A sinistra un gradiente lineare, al centro un gradiente radiale, a destra uno a spirale con 6 colori.

La proprietà gradiente può essere modificata dal property inspector:

Si può applicare sia al contenuto (fill), sia al bordo (stroke).
La maschera colorata al centro vi permette di aggiungere tutti i colori che volete, una volta scelto il tipo di gradiente, cliccate due volte sulla barra per aggiungere un colore e scegliere la sua posizione. Potete cambiare la posizione trascinando il cursore e cliccando con il tasto destro apapre un menù aggiuntivo per: centrarlo, cancellarlo, modificare colore o trasparenza.
E' possibile modificare anche l'orientamento del gradiente o la sua estensione usando gli appositi cursori sull'oggetto:

Esempio con gradiente sia del bordo che del contenuto

Sono disponibili diversi tipo di gradienti:

Conical gradient

Diamond gradient

linear gradient

radial gradient

spiral gradient

SQRTXY gradient

XY gradient

Potete anche decidere la qualità grafica del gradiente: normal o good.
Potete anche decidere il numero di ripetizioni:

Ripetuto 7 volte

Se selezionate mirror, il gradiente ripetuto è specchiato ad ogni ripetizione.
Se selezionate wrap,il gradiente è ripetuto fino a riempire tutto l'oggetto.
Nei prossimi post vedremo come realizzare un'animazione.

Fare un fumetto digitale

Una delle possibilità offerte da Livecode è quella di poter fare dei libri o fumetti interattivi. Nel caso di oggi non stiamo parlando dei classici ebook in formato epub o pdf, ma dei libri digitali che si scaricano dai market come iTunes o Google play.
I libri (o i fumetti) digitali sotto forma di app presentano alcuni vantaggi per chi li produce:

• impossibilità di copia pirata
• costi di distribuzione nulli
• vasto pubblico

Proprio per questi motivi la Industrial Toys ha deciso di sviluppare un fumetto digitale interattivo con Livecode: il cui nome è Midnight Rises.

Il fumetto si basa sulla trama del gioco Midnight Start. Oltre ad essere un fumetto, Midnight Rises, è anche un piccolo gioco, poichè al lettore è chiesto di fare delle scelte durante la lettura, che influenzeranno lo sviluppo e il finale del fumetto.

Font su iOS

Se non vi interessa caricare nuovi font con la vostra app per iOS, la  società di software WhiteFly ha pubblicato una lista con tutti i font delle varie versione di iOS, ecco il link:

http://www.borzini.it/Utility/fontios/listafontios.html

Corso Android

Sono stato contattato dalla NEOL srl per preparare un corso su Android con Livecode a fine Marzo.
Ci siamo messi d'accordo sugli argomenti e il corso verterà sui seguenti argomenti:

1) Come impostare l'ambiente per creare app android
Installazione e gestione del JDK
Installazione e gestione del Android SDK
Aggiornamento del JDK e del Android SDK
Creare la firma e firmare digitalmente un'app

2) Costruire l'interfaccia di una applicazione mobile
Campi nativi
Scrolling di un testo (o altro) su android
La tastiera virtuale
I pulsanti di android

3) I monitor android
Gestire le dimensioni degli schermi
Esempi pratici delle possibili soluzioni
Gestire l'orientamento dei dispositivi

4) Come accedere alle funzionalità  del cellulare
Foto
Accelerometri
Bussola
GPS

5) Concetti base per i videogiochi
Muovere gli oggetti
Le collisioni
I timer e i messaggi a tempo
La grafica: vantaggi e svantaggi fra vettoriale e bitmap
I suoni

6) Come creare un videogioco da zero alla fine
Fare un videogioco tipo questo:  https://play.google.com/store/apps/details?id=com.hyperkani.marblemaze

7) Inviare Messaggi  ed Interfacciarsi con servizi
Rubrica
Email
Sms

8) Servizi web
Notifiche push
Creare un servizio di chat come Whatsapp
App che si integra con Facebook

9) Database SQLite
Vantaggi e svanataggi rispetto ad un file di testo
Cenni di SQL
Comandi livecode per interagire con SQLite
Gestione delle tabelle con la libreria datagrid

Per modalità e costi contattate la Neol ai recapiti sul sito: http://didacta.com/

Multimedia con raspberry Pi

Livecode su linux utilizza mplayer per visualizzare i filmati, e lo stesso vale per la scheda raspberry Pi.
Rasperry non ha mplayer già installato, ma è semplicissimo installarlo.
Per installare mplayer su raspberry basta lanciare il comando:

sudo apt-get update
sudo apt-get install mplayer

in questo modo potrete creare applicazioni multimediali con livecode senza problemi anche su raspberry Pi.

Non impazzire con le stringhe

Può capitare molte volte di dover comporre delle stringhe molto lunghe, ad esempio quando si lavora con i database, e non sempre la sintassi di livecode può essere agevole.
Ad esempio immaginiamo di dover scrivere l'espressione:

SELECT nome,cognome FROM "elenco indirizzi" WHERE "nome"="Mario";

Con livecode diventa:


put "SELECT nome,cognome FROM " & quote & "elenco indirizzi" & quote & " WHERE " & quote & "nome" & quote & "=" & quote & "Mario" & quote & ";" into espressione



forse è troppo lunga e difficile da interpretare. Per fortuna c'è la funzione merge(), che serve a lavorare con i testi. La funzione merge() prende una stringa ed elabora il contenuto tra doppie parentesi quadre.
Ad esempio:

put merge("[[1+1]]")

dà 2 come risultato. Sembra un'ulteriore complicazione, ma l'esempio con select la possiamo scrivere così:

put merge("SELECT nome,cognome FROM [[quote]]elenco indirizzi[[quote]] WHERE [[quote]]nome[[quote]]=[[quote]]Mario[[quote]];") into espressione

eliminando tutti quegli spazi e quelle & si rende più leggibile il codice.
La funzione merge() è utlizzata molto anche per chi usa livecode come server, nella generazione di pagine web, e nell'esportazione in formati RTF, Word o Openoffice.

Localizzazione di un programma

Il termine localizzazione viene usato impropriamente nel campo informatico, mutuandolo dall'inglese, riguardo alla lingua mostrata dal programma. Quando si scrivono programmi per diverse nazioni, di solito di localizza, nel senso che si usa la lingua locale (italiano, francese, spagno, inglese, ecc.).
Scrivere un programma con diverse localizzazioni al suo interno ci risparmia di dover riscrivere più volte lo stesso programma. Livecode permette di trasformare agevolmente il programma utilizzando i Property profile (profili). I profili si impostano dall'ispettore delle proprietà:

Grazie ai profili con un solo comando potete impostare tutte le proprietà di tutti gli elementi del programma. Ad esempio per passare al francese:

set the profile of this stack to "francese"

Tutto ciò funziona solo su Windows, Linux e Mac.
Su Android e iOS dovrete utilizzare un database (ad esempio SQLite) di appoggio, poichè i profili su mobile non sono supportati.

Keydown e RawKeyDown

Se scorrete il dizionario di livecode, noterete che esistono molti messaggi che si attivano quando premete un pulsante della tastiera:

• keydown
• rawKeyDown
• optionKeyDown
• controlKeyDown 
• commandKeyDown

Vediamo insieme le differenze.
Di base un programmatore dovrebbe utilizzare keydown, esso permette di intercettare cosa preme l'utente e modificare il comportamento del programma. Se volessimo che in un campo l'utente digiti solo numeri, possiamo inserire questo codice nel campo:

on keyDown theKey
   if theKey is a number then pass keyDown
end keyDown

In questo modo il messaggio di aver premuto il pulsante viene passato solo se il pulsante premuto è un numero. KeyDown si attiva solo normali della tastiera, non si attiva per le frecce o per il pulsante Esc, Tab, CTRL, Alt, Shift, Backspace, ecc. In questo modo l'utente può modificare il campo di testo usando la tastiera.
Se invece dobbiamo intercettare ogni tipo di pulsante (eccetto CTRL e Alt), c'è il comando rawKeyDown.
Per intercettare Alt abbiamo il comando optionKeyDown.
Per intercettare CTRL c'è commandKeyDown.

Font con iOS e Android

Quando lavoriamo sui sistemi mobili (Android e iOS) è tutto più difficile, perchè le politiche di sicurezza cercano di limitare le interazioni fra sistema e programmi esterni. Oggi vedremo come avere un programma che usi dei font personalizzati sui sistemi mobili.
Il problema è solo che i nomi dei font su iOS non combaciano o sono del tutto assenti rispetto a quelli su PC/Mac.
Fate uno programmino come il seguente:

dove c'è un pulsante, uno scrolling list e un campo di testo semplice (field). Chiamate lo scrolling list fonts, mentre l'altro campo di testo risultato.
Nel codice del pulsante metti questo codice:

on mouseUp
   put the fontNames into fld "fonts"
   sort lines of fld "fonts"
end mouseUp

mentre nel campo di testo al centro metti questo:

on mouseDown
   set the textFont of fld "risultato" to the selection
   set the text of fld "risultato" to ("esempio di " & the selection)
end mouseDown

Eseguendolo su pc e su Android o iOS abbiamo dei risultati differenti: ogni volta che cliccheremo sul pulsante, avremo la lista dei font disponibili sul sistema.

I font disponibili nativamente non sono molti, per includerne altri non è difficile.
Innanzitutto, per iOS conviene mettere nello stack metti nello stack questo codice, così il font personalizzato si vedrà senza problemi:

on openStack
   if the environment is not "development" then
      iphoneUseDeviceResolution true
   end if
end openStack

Poi bisogna andare su Standalone application setting, il pannello Copy files e da li aggiungi il file TTF che contiene il font che vuoi usare:

Fatto ciò, incrociamo le dita perchè, se tutto è andato per il verso giusto, Livecode riconoscerà il file font e lo installerà dentro la nostra app. Quindi senza bisogno di ulteriore codice, avviando di nuovo la piccola app appena fatta, lo troveremo tra la lista dei font disponibili.

Font personalizzati su Android

Font personalizzati su iOS

Ruotare più oggetti rispetto allo stesso centro

Nel post precedente abbiamo visto come ruotare un oggetto, ora vediamo come ruotare insieme più oggetti. Se cambiassimo solo la proprietà angle, ogni oggetto girerebbe attorno al proprio baricentro, mentre vogliamo che tutti gli oggetti ruotino attorno allo stesso punto (centro di rotazione). Per chiaririci questo è quello che vogliamo ottenere:

Come vedete i due triangoli ruotano attorno allo stesso punto. Per fare ciò dobbiamo, ad ogni rotazione,  individuare la posizione degli oggetti che non ruotano al proprio baricentro; cioè nel nostro caso il secondo triangolo.
La posizione è data dalle funzioni trigonometriche seno e coseno. Esse ci danno i coefficienti rispetto all'angolo corrente, da dare alla posizione dell'oggetto.
Se il centro di rotazione si trova in (152,118) e il secondo triangolo di deve sempre trovare a 100 pixel dal centro, il codice nel pulsante è:

on mouseUp
   if the label of me is "START" then
      set the label of me to "STOP"
      ruotafigura
   else
      set the label of me to "START"      
   end if
   
end mouseUp

on ruotafigura
   if the label of me is "START" then
      exit ruotafigura
   end if
   put the thumbpos of scrollbar "angolo" into Dangolo
   lock screen
   put the angle of graphic 1 into curangolo
   put dangolo + curangolo into curangolo
   set the angle of graphic 1 to curangolo
   set the angle of graphic 2 to curangolo
   #loc = 152,118
   #w x h = 100,100
   set the loc of graphic 2 to (152 + 100 * cos(pi/180 * curangolo), 118 + 100 * sin(pi/180 * curangolo) )
   unlock screen
   send ruotafigura to me in 0.017 sec #non ha senso scendere sotto questo valore
end ruotafigura