Pescara calcio campionato 2016-2017 versione 1.1

goalE’ disponibile versione 1.1 dell’applicazione android Pescara 2016-2017 sviluppata con MIT app inventor.

Questa nuova versione sommando i punti fatti in ogni partita fornisce il totale punti realizzati. Inoltre per ogni partita è stato selezionato un video su youtube o vimeo dove vi è una sintesi ben fatta della partita in questione. Stiamo verificando il modo migliore per introdurre il relativo video in forma di link utilizzando MIT app inventor.

Scaricatela dal Play Store e se siete interessati fatemi sapere cosa vorreste trovare nelle prossime versioni.

Oggi prima giornata di campionato di calcio: Pescara 2016-2017 seconda app android

goalOggi è la prima giornata del campionato italiano di calcio serie A.
Dovevo festeggiarlo con una piccola applicazione android ed eccovi la mia seconda applicazione utilizzando MIT app inventor: Pescara 2016-2017.

Ovviamente è gratuita. Semplicemente mette in evidenza il calendario del Pescara calcio ed i relativi risultati. E’ una versione iniziale e sarà semplice introdurre con calma nel tempo informazioni.

Scaricatela dal Play Store e se siete interessati fatemi sapere cosa vorreste trovare nelle prossime versioni.

Prima app in Google Play sviluppata con MIT app inventor

MIT app inventor può sembrare un giochino, invece è uno strumento di programmazione visuale raffinato.
La possibilità di salvare il progetto in apk permette di introdurre l’applicazione in Google Play.
Al momento ho creato una semplice applicazione gratuita (Magic Square) che però mi ha permesso di fare in Google Play l’introduzione più complessa: un’applicazione con bollino PEGI 3 e certificata Family.

Con la prossima proverò la possibilità di metterla in vendita ad un prezzo bassissimo od irrisorio (0,05 o 0,10) sempre per capire come funziona.

Magic Square 3×3 la mia seconda app Android

MagicSquareAppQuesta seconda app è qualcosa di più serio anche se non merita ancora di essere pubblicata in Google Play.
Vi sono 9 bottoncini con sopra una X, schiacciandoli la X si trasforma in un numero da 1 a 9 in sequenza.
Dovrete schiacciarli in modo tale che sommando i numeri in orizzontale, verticale e diagonale diano sempre 15.
In questo caso avrete costruito un quadrato magico 3×3 (in Cina detto lu-shu).
In ogni caso alla fine vi saranno due saranno le possibilità:

  • wonderful! it is a magic square
  • retry, it is not a magic square

Potrete sempre ricominciare utilizzando il tasto clear.

1.0 – 2 giugno 2016 (70 anni della repubblica italiana) prima release
1.1 – 3 giugno 2016 shacking ha lo stesso effetto di clear
1.2 e 1.3 – 4 giugno 2016 ottimizzazione del codice per ridurre le linee di codice utilizzando funzioni. Lo scopo è di riuscire a sviluppare in modo semplice magic square nxn
1.5 – 5 giugno 2016 ShowAllert

http://ai2.appinventor.mit.edu/?galleryId=6332432314007552

Ho scoperto MIT App Inventor e programmerò App Android

Ho scoperto MIT App Inventor!
Richiede l’accesso con un utente google infatti utilizza Blockly.
Ho seguito alcune demo e sto cercando di capire come funziona.
Non è complesso quando già si è utilizzato Snap e Scratch.
Ho dovuto però chiedere l’aiuto di mia figlia con il suo smartphone android. Avevo provato inizialmente con l’emulatore messo a disposizione ma non sono riuscito a testare l’applicazione fatta perché sembra non allinearsi.
Invece con lo smartphone funziona tutto senza problemi.
Si scarica l’app e si “allinea” il tool di sviluppo con l’app e si possono vedere in diretta le modifiche.
Non ho ancora ben capito cosa utilizza, è comunque in grado di consentire di salvare file apk.

La mia prima app è un bottone, cliccandolo viene visualizzata una immagine, facendo shacking l’immagine sparisce.

ai2.appinventor.mit.edu/?galleryId=4569098937958400

Dovete imparare il PHP, dopo aver imparato i fondamenti di HTML

L’HTML è un linguaggio client di visualizzazione. Ovvero le istruzioni presenti interpretate dal browser sul vostro client (computer, smartphone, tablet, …) vi permetteranno di visualizzare la pagina graficamente in un modo piacevole.
Permette di visualizzare immagini, link, testo (font), utilizzare tabelle, …
Difficilmente viene percepito come un linguaggio e difficilmente si programma in html. Si utilizzano tool che nascondono la programmazione html, si parla di videoscrittura, così come con Word.

Ma se avete bisogno di un linguaggio server di programmazione inserito nell’html?
Ovvero immaginate di aver bisogno di chiedere informazioni a chi legge le vostre pagine html e con quelle informazioni fare delle operazioni.
Ad es. Google (motore di ricerca) come funziona?
E’ una pagina html con una semplice finestrella< ed un bottone. Introducendo le chiavi e schiacciando il bottone dite ad un server (o più server) cerca nel tuo archivio e trova i risultati più attinenti alle mie chiavi e fammi vedere il tutto.

Il linguaggio più naturale per questo tipo di programmazione è il PHP.

L’html prevede le form (la possibilità di fare le finistrelle) ma i dati inseriti verranno poi gestiti da un linguaggio di programmazione server e qui entra in gioco il php.

Ad es.

<form action=”action.php” method=”POST”>
<p>Il tuo Nome: <input type=”text” name=”nome” value=”” /></p>
<p>La tua età: <input type=”text” name=”eta” value =”” /></p>
<p><input type=”submit”></p>

significa: crea due finestrelle dove l’utente può introdurre del testo. Nella prima l’utente potrà inserire il suo nome e verrà scritto nella variabile nome, nella seconda l’utente potrà scrivere la sua età e verrà scritta nella variabile eta quando l’utente avrà pigiato il bottone invia (submit tradotto in italiano) ed il tutto sarà passato al programma php contenuto nel file action.php

Il tuo Nome:

La tua età:

Questo action.php

<html>
<p>Ciao <strong><?php echo htmlspecialchars($_POST[‘nome’]); ?></strong>.</p>
<p>La tua età è di <strong><?php echo (int)$_POST[‘eta’]; ?></strong> anni.</p>
<p>Se li hai già compiuti quest’anno allora sei nato nel <strong><?php echo 2016-(int)$_POST[‘eta’]; ?></strong> altrimenti nel <strong><?php echo 2016-(int)$_POST[‘eta’]-1; ?></strong>.</p>
</html>

Ovvero nell’html i comandi php sono del tipo <?php …..?>
echo
è come print un comando per “stampare” il contenuto di una variabile.
Il server (web) esegue i contenuti delle righe php, stampa i risultati delle variabili ed invia il file html al nostro browser che lo visualizzerà.

Nello stesso modo potrebbe compiere qualsiasi attività sul server o su altri server come estrarre dati da un database, eseguire applicazioni, …

Queste sono le basi per capire come funziona internet e la rete di computer interconnessi che si nascondono dietro.

Corso di introduzione all’html che feci nel 2014 per le mie figlie

C’erano già germi di Codescuola.it prima della sua creazione. Questo un corso di introduzione all’html che feci nel 2014 ad uso e consumo delle mie figlie.

Le mie figlie (10 e 12 le più grandi) sanno utilizzare poco il computer (hanno imparato l’utilizzo a scuola), lo usano quasi solo per ricerche scolastiche, non posseggono smartphone o tablet.
Non sono interessato ad insegnare loro come si utilizza un computer, lo impareranno. Mi piacerebbe che capissero cosa si nasconde dietro un computer e quindi dietro un qualsiasi oggetto delle vita quotidiana. Mi piacerebbe capissero l’importanza delle comunicazioni tra computer, internet.

Per iniziare a comprendere cosa si nasconde dietro bisogna imparare i rudimenti di un linguaggio di programmazione. Meglio se il linguaggio è nato con internet e con i browser in modo tale da riuscire a visualizzare quello che si sta facendo. Ho deciso perciò di iniziare con HTML il linguaggio fondamentale di internet, un linguaggio di visualizzazione.

Il file: un file HTML è un file di testo con estensioni .htm o .html
Usando un programma per editare testo (ad esempio notepad, blocco note in italiano, su Windows) salviamo un file senza niente in esercizio.htm [per un editor più attuale vi ricordo l’articolo relativo a Atom].
Vedrete che il sistema operativo lo riconosce (tramite l’estensione) come un file html sapendo così che se lo mandate in esecuzione (doppio click in Windows) dovrà aprire il browser e far vedere all’interno i comandi da voi introdotti.

I tag: come tutti i linguaggi anche l’html ha delle regole, i tag.
introducendo all’inizio <html>
e alla fine </html>
con <html> dichiariamo qui inizia l’html
Con </html> qui finisce l’html
I tag <…> sono sempre di inzio, i tag </…> di fine

Ed ora?
Scrivete quello che volete!
Ecco il contenuto del mio file esercizio.htm 😉

<html>
Scrivete quello che volete!
</html>

In Windows doppio click su esercizio.htm e magia, si apre il browser ed in una pagine nuova possiamo leggere Scrivete quello che volete!

Ora andate a capo e scrivete Questa è la seconda riga e provate a visualizzare
la modifica. NON VA A CAPO!
Esatto: c’è un tag speciale per andare a capo: <br />

<html>
Scrivete quello che volete!<br />
Questa è la seconda riga
</html>

In teoria potreste già scrivere in vostro primo romanzo html, diciamo che per essere dei veri raffinati bisognerebbe utilizzare anche i tag di inizio e fine paragrafo <p>…</p>, i tag di grasseto <strong>…</strong>, i tag di corsivo <em>…</em>
Ad esempio

<html>
<p>
Scrivete quello che volete!<br />
Questa è la seconda riga<br />
Questo è evidenziato in <strong>grassetto</strong><br />
Questo è evidenziato in <em>italico</em><br />
</p>
</html>

Se farete degli errori nello scrivere i tag il browser non riuscirà ad interpretarli correttamente e cercherà di farvi vedere quello che ha capito.
Ad es.

<html>
<p>
Questo è un errore molto comune <strong>grassetto<strong> perché ho chiuso il grassetto con il tag di apertura
</p>
</html>

Dovreste già capire perché esistono programmi che vi aiutano a scrivere pagine html ma ora conoscete la base di quello che si nasconde dietro.
Ora gli ultimi due tag complessi che hanno segnato la rivoluzione internet.

Il LINK: <a href=”il link”>il testo che cliccato porterà al link indicato</a>
Ad esempio: <a href=”http://www.pivari.com”>questo è il mio sito</a>

<html>
<p>
<a href=”http://www.pivari.com”>questo è il mio sito</a>
</p>
</html>

Il link sembra sempre una magia ma è proprio un comando semplice: clicca sul testo indicato ed andrai a vedere un’altra pagina html (nello stesso o in un altro sito)

Caricare le immagini: <img src=”l’immagine da caricare” />
Ad esempio
<img
src=”http://www.pivari.com/wp-content/uploads/2014/01/pivari-logo.gif” />
caricherà il logo di Pivari.com

Combinando link ed immagine possimo fare in modo che cliccando l’immagine si vada a vedere una pagina
<a href=”http://www.pivari.com”><img
src=”http://www.pivari.com/wp-content/uploads/2014/01/pivari-logo.gif” /></a>

Questo il nostro esercizio.htm FINALE

<html>
<p>
<a href=”http://www.pivari.com”><img
src=”http://www.pivari.com/wp-content/uploads/2014/01/pivari-logo.gif” /></a><br />
Scrivete quello che volete!<br />
Questa è la seconda riga<br />
Questo è evidenziato in <strong>grassetto</strong><br />
Questo è evidenziato in <em>italico</em><br />
<a href=”http://www.pivari.com”>questo è il mio sito</a><br />
Questo è un errore <strong>grassetto<strong> perché ho chiuso il grassetto con
il tag di apertura
</p>
</html>

Dovreste vedere


Scrivete quello che volete!
Questa è la seconda riga
Questo è evidenziato in grassetto
Questo è evidenziato in italico
questo è il mio sito
Questo è un errore grassetto perché ho chiuso il grassetto con
il tag di apertura