8 Giugno 2007
Navigazione
<<-- Microsoft Windows Mobile Device Center 6.1 per Windows Vista
Editoriale: Segui PdV su Google ! (Solo x Firefox !!!) -->>




Ci siamo spostati su blogvista.it Vieni a trovarci


Programmazione dei Gadget per la sidebar di Windows Vista - Introduzione

Articolo di realtebo, inserito in Trucchi e Guide |

Lo so, anche a voi fanno impazzire i gadget per la sidebar di Vista… ma per quanti ce ne sono, forse manca proprio quello che fa per voi…

Se avete una bella idea,o se proprio ve ne necessita uno, perchè non programmate un gadget per Vista voi stessi? Non è così difficile, si tratta di buttar giù semplicemente un po di html, javascript e della bella grafica.

Seguitemi passo passo mentre io stesso provo a spiegarvi come scrivere un gadget per Vista. Al termine di questa prima lezione avrete il vostro primo gadget funzionante !!!!

Cosa sono i Gadget per Windows Vista

La Sidebar di Vista è una delle nuove caratteristiche del sistema operativo di casa Microsoft. La Sidebar permette all’utente di avere delle mini applicazioni chiamate gadget, appunto, che possano svolgere le più disparate funzioni, dall’accedere a dati via internet a svolgere piccoli compiti tipici di alcune utility stand-alone. Oppure svolgono lavori per noi. Sulla Gallery Live ce ne sono già alcune centinaia e spesso ne parliamo anche noi.

Ogni gadget ha accesso inoltre alle informazioni sul pc su cui è installato (alcune, non temete per la vostra privacy), per cui è possibile creare monitor di risorse, configura tori di rete, visualizzatori della proprie foto, etc…

E’ possibile anche usare le finestre di dialogo più comuni con estrema facilità per consentire una buona integrazione all’utente.

Infine, è possibile memorizzare le preferenze utente tramite appositi oggetti di sistema messi in automatico a disposizione dalla sidebar stessa.

Curiosità: La sidebar memorizza separatamente le impostazione di ogni singolo gadget, il che rende possibile avere vari orologi con diverse impostazioni, vari lettori di feed, varie slideshow da cartelle diverse, etc.
Le impostazioni vengono salvate al logout o al riavvio dal sistema

Le interazioni da parte dell’utente sono gestite via script in risposta a precisi eventi che la sidebar ‘trasporta’ al gadget stesso: per esempio moltissimi gadget appaiono diversi se sono ancorati dentro o ‘in volo’ fuori dalla sidebar, e possono reagire al proprio spostamento.

Come si fa?

Come abbiamo detto prima, i gadget sono scritti in HTML con l’aggiunta di script interpretabili da Internet Explorer (vbscript, javascript, altri se Ie li mastica).

Nota: Questo vuol dire che se non conoscete l’HTML e almeno le basi di Javascript (e dei CSS aggiungo) non è il caso che procediate perchè spiegherò come fare un gadget, non come programmare !

All’atto pratico il ciclo di programmazione si riassume in: creiamo una directory, un file html e uno xml, zipppiamo e proviamo il gadget.

Oltre a i due fondamentali (html che ne mostra l’aspetto e l’xml che ne riporta il ‘manifesto’, a paroloni diciamo che è una minima configurazione / identificazione del gadget) possiamo aver bisogno di aggiungervi altri file javascript e quasi sempre anche immagini e fogli di stile, nonchè le icone per l’elenco dei gadget

Hello World !

Come mancare al classico appuntamento con Hello World !? Dovete sapere che qualsiasi cosa si impara sempre iniziando con un esempio che dice solo ‘Hello World’, ma proprio qualsiasi cosa…

Da Windows Explorer, rintracciamo la cartella che contiene i gadget installati sotto la nostra utenza. Si trova qui:

%userprofile%\AppData\Local\Microsoft\Windows Sidebar\Gadgets

cioè nella pratica in

c:\Users\IlTuoNomeUtente\AppData\Local\Microsoft\Windows Sidebar\Gadgets

Creiamo una nuova cartella denominata HelloWorld.gadget (si, compresa l’estensione !)

Manteniamo lo stesso nome per il file html, e così creiamo un file di testo che contiene il cuore del gadget chiamandolo CiaoMondo.html all’interno della cartella appena creata. Non è fondamentale il nome, ne tantomeno rispettare le maiuscole-minuscole, tanto il nome di questo file andrà specificato successivamente nello scrivere il file di configurazione.

Copiateci dentro il testo che segue:






<html>
<head>
    <title>Il mio primo gadget</title>
</head>
<style>
  BODY {
   width: 130px;
  } 

  #principale {
   color: red;
   font-family: Verdana; 
   font-size: 10pt;
  }
</style>
<body>
    <span id=”principale”>
        Saluto: ciao da Mirko!
    </span>
</body>
</html>

Benissimo! Come avete visto c’è solo una riga di testo racchiuso nel tag SPAN per meglio formattarlo. Il CSS non ha nulla di particolare, se non altro abbiamo dovuto precisare la larghezza del gadget (lo style del tag body), perchè la sidebar altrimenti avrebbe visualizzato una strisciolina microscopica soltanto.

Ora scriviamo il file di configurazione XML, che deve obbligatoriamente chiamarsi gadget.xml, scrivendo quanto segue al suo interno:


<?xml version="1.0" encoding="utf-8" ?>
<gadget>
    <name>Ciao mondo by Realtebo!</name>
    <version>1814</version>
    <author name=”Realtebo”>
        <info url=”http://www.mirkotebaldi.it” />
    </author>
    <copyright>&#169; 2007</copyright>
    <description>il mio primo gadget  v.1816</description>
    <hosts>
        <host name=”sidebar”>
            <base type=”HTML”
                 apiVersion=”1.0.0″
                 src=”CiaoMondo.html” />
            <permissions>Full</permissions>
            <platform minPlatformVersion=”1.0″ />
        </host>
    </hosts>
</gadget>

Quello che è scritto qui è il non è proprio il file minimo possibile ma quasi. Tutto quello che c’è scritto è strettamente necessario. Di opzionale aggiunto da noi c’è la sezione Author, il copyright e description, che però vi consiglio di inserire, modificandolo come volete, per meglio facilitarvi nell’identificare il vostro gadget all’interno della schermata ‘Aggiungi Gadget’

Da notare che il ‘.src’ indicato è il file html di cui sopra, di cui va riportato rispettando il nome esatto.

tutto ciò che è scritto all’interno della sezione <hosts> è fondamentale e va sempre scritta integralmente e così com’è riportata. Ripeto: l’unico parametro modificabile di questa sezione è il nome del file html principale.

name, version, author e description sono ‘pasticciabili a vostro piacimento’. Torneremo ad approfondire l’argomento in seguito. Per ora vi basti sapere che name è il nome pubblico esposto dal gadget, e così la sua description che viene riportata nei dettagli nella finestra Aggiungi Gadget assieme agli altri dati su autore, copyright e altri che aggiungeremo in futuro

Prova su strada

Che ci crediate o no, il vostro primo gadget è pronto!

Andate per aggiungere un gadget alla Sidebar e dovreste avere nell’elenco un che si intitola ‘Ciao Mondo’, con una icona, per ora, scelta da Vista (un collage di orologio + calcolatrice + blocknotes)

 

Technorati:

Popolarità: 28% [?]

Condividi

Chiudi
Invia e-mail