Obre l’espai de disseny o l’editor de Blocs de
l’App Inventor.
Baixeu els fitxers necessaris
Haureu de baixar-vos a l’ordinador una imatge d’un gat (kitty.png) i un fitxer d’audio (meow.mp3). A continuació disposeu dels dos fitxers esmentats:
Haureu de baixar-vos a l’ordinador una imatge d’un gat (kitty.png) i un fitxer d’audio (meow.mp3). A continuació disposeu dels dos fitxers esmentats:
• Kitty picture: kitty.png (click a l’enllaç
+ botó dret a la imatge i click a
Guardar imagen como…)
• Meow sound: meow.mp3 (click a l’enllaç + botó dret a la imatge i click a Guardar audio como…)
Deseu els dos fitxers sobre l’escriptori o allà on els podeu trobar fàcilment.
• Meow sound: meow.mp3 (click a l’enllaç + botó dret a la imatge i click a Guardar audio como…)
Deseu els dos fitxers sobre l’escriptori o allà on els podeu trobar fàcilment.
Seleccioneu els components per dissenyar l’app
Els components es poden seleccionar a la
secció, disponible a la dreta de la pantalla de l’App Inventor.
Per utilitzar un component a la teva app,
cliqueu-lo de la secció Palette i arrossegueu-lo cap a la secció Viewer (#1),
situada al mig de la pantalla. Llavors, també apareixerà a la secció Components
(#2). També apareixeran a la secció Properties (#3) les propietats
corresponents al component que estigui seleccionat.
Passos per seleccionar components i ajustar
les seves propietats.
Per obtenir un botó que mostri la imatge del
gat haureu de fer això:
1. Des de la secció User Interface de la
Palette, arrossega un Button cap a la secció Viewer (#1)
2. Per tenir una imatge al botó, a la secció
Properties a la propietat Image, feu click al text None… i click "Upload
File…" (#2). Click a Examinar i tria la imatge kitty.png que abans us vau
baixar (#3).
3. Canvia la propietat Text: Esborra
"Text for Button1", deixant en blanc aquesta propietat per a que no
hi hagi res escrit a sobre la cara del gat. L’aspecte hauria de ser el següent:
4. Des de la secció User Interface de la
Palette, arrossegueu una etiqueta (Label) al Viewer (#1), a sota mateix de la
imatge del gat. L’etiqueta apareixerà a la llista de components amb el nom de
Label1.
5. A la secció Properties, canvia la propietat
Text de l’etiqueta Label1 per a que es llegeixi “Pet the kitty!” (#2).
6. Canvia el tipus de lletra (Fontsize) del
text a tamany 30 (#3).
7. Canvia el color de fons (BackgroundColor)
de Label1 (#4) al color que vulguis.
8. Canvia el color de text (BackgroundColor)
de Label1 (#5) al color que vulguis.
9. A Palette, click a la secció Media, i
arrossega un component Sound al Viewer (#1). Apareixerà a sota del visor com a
component no visible.
10. Click Upload File... (#2) i selecciona el
fitxer meow.mp3 per carregar-lo al nostre projecte (#3).
11. A la secció Properties, a la propietat
Source, click la paraula None… i selecciona el fitxer meow.mp3 (#4).
No hay comentarios:
Publicar un comentario