Baixar PDF

Transcrição

Baixar PDF

Python
2
Pokedex
AllCodeClubsmustberegistered.Byregisteringyourclubwecanmeasureour
impact,andwecancontinuetoprovidefreeresourcesthathelpchildrenlearnto
code.Youcanregisteryourclubatcodeclubworld.org.
Introdução:
Nesteprojetovocêaprenderácomocriarumainterfacegráficade
usuário(GUI),atravésdacriaçãodeumPokedex(queéum
programaparaprocurarinformaçõesemumPokemon).
ÉassimquesuaGUIPokedexvaiaparentar:
DadosdoPokemon
OsdadosdoPokemonaseremusadosnesteprojeto
podemseracessadosatravésdepokeAPI.Elesforam
criadosporPaulHallett.
1
©RaspberryPiFoundation.UKRegisteredCharity1129409.TheseprojectsareforuseoutsidetheUKonly.Moreinformationatwww.codeclubworld.org.
ThiscourseworkisdevelopedonGitHub,atwww.github.com/CodeClub.
Listadeatividade
SigaestasINSTRUÇÕESumaauma
Testeseuprojeto
CliquenabandeiraverdeparaTESTAR
Salveseuprojeto
Certifique-sedeSALVARseutrabalho
2
Step1:Widgets!
Listadeatividades
Ainterfacegráficadeusuário(GUIs)podersercriada
facilmenteusandoomódulo‘tkinter’.UmaGUIcontém
muitas“coisas”diferentes,chamadaswidgets.Por
exemplo:
fromtkinterimport*
#criaçãodeumanovajanelaGUI
janela=Tk()
janela.title("UmaJanela")
#umaetiqueta
lbl=Label(janela,text="Umaetiqueta")
lbl.pack()
#umacaixadeentradadetexto
texto=Entry(janela)
texto.pack()
#umbotão
btn=Button(janela,text="UmBotão")
btn.pack()
janela.mainloop()
Sevocêexecutaresteprograma,vocêveráumajanela
principal,quecontémumaetiquetadetexto,umacaixa
deentradadetextoeumbotão.
3
Cadawidgetécriadoearmazenadoemumavariável,e
depoisempacotadoemumajanelaprincipal.Percebaque
quandoestivercriandoumwidget,vocêtemquedizer
emqualjanelavocêquerqueeleapareça,equaltexto
serámostrado,assim:
#umaetiqueta
lbl=Label(janela,text="Umaetiqueta")
Agoravocêpodeacrescentarmaiswidgetsparaseu
Pokedex:
fromtkinterimport*
#crieumanovajanelaGUI
janela=Tk()
janela.title("Pokedex")
#umaetiquetacontendoasinstruções
EtiquetaDeInstrucoes=Label(janela,text="Entreuma
númeroentre1e718:")
EtiquetaDeInstrucoes.pack()
#umacaixadeentradadetextoparadigitaronúmerodo
pokemon
txtPokemonNo=Entry(janela)
txtPokemonNo.pack()
#umbotãoquevaiobterainformaçãoparaopokemon
btnObterInfo=Button(janela,text="ObtenhaDados!")
btnObterInfo.pack()
4
#etiquetasparaonomedopokemon
etiquetaTextoNome=Label(janela,text="Nome:")
etiquetaTextoNome.pack()
etiquetaValorNome=Label(janela,text="???")
etiquetaValorNome.pack()
janela.mainloop()
Percebaquevárioscomentáriosúteisforamadicionados
paratelembrarparaquêcadawidgetéusado.Onome
dasvariáveisdoswidgetstambémforamalteradaspara
tornaroprogramamaisfácildeserentendido.
SalveSeuProjeto
5
Desafio:Maiswidgets
VocêconsegueterminardecriarainterfaceGUIparaque
elamostreosdetalhesdoPokemoneparaqueelafique
comessaaparência:
SuainterfaceGUIprecisaráde:
Umacaixadeentradadetextoparadigitarqual
Pokemonvocêquerver;
UmbotãoparaobterasinformaçõesdoPokemon;
Váriasetiquetasparamostrarasinformaçõesdo
Pokemon:
Nome;
PontosAtingidos;
Ataque;
Defesa;
Velocidade.
Lembre-sequesevocêacrescentarcomentárioseutilizar
nomesdevariáveissignificativos,istoteajudarábastante
maistarde!
6
SalveSeuProjeto
Step2:Customizandoseuswidgets
AgoraquevocêjátemvárioswidgetsdiferentesnasuajanelaGUI,você
podemudaraaparênciadeles.
ListadeAtividades
Primeirovamosmudaralgumascoresparaqueos
widgetsfiquemmaisinteressantes.Mudeocódigoque
quemostraajanelaprincipal:
#crieumanovajanelaGUI
janela=Tk()
janela.config(bg="#e0e0ff")
janela.title("Pokedex")
Autilizaçãode .config() permitequevocêconfigurea
7
aparênciadascoisas.Eminglês, bg significa
“background”,ouseja,planodefundoe "#e0e0ff" éo
códigohexapararoxoclaro.Vocêtambémpode
configuraraaparênciadoswidgets,porexemplo,as
etiquetasparamostraronomedoPokemon:
etiquetaTextoNome.config(bg="#e0e0ff",fg="#111111")
etiquetaValorNome.config(bg="#e0e0ff",fg="#111111")
fg
significaeminglêsforeground,eemportuguês,
significaprimeiroplano.Comelevocêajustaacorda
etiquetadetexto.
Emseguida,vocêpodemudarafontedecadaumdos
widgets.Primeirovocêpodecriarvariáveispara
armazenarinformaçõesdediferentesfontes.Adicione
estecódigoaoseuprogramalogoapósalinhaque
8
importaomódulo tkinter :
fontePequena=["Helvetica",14]
fonteMedia=["Helvetica",18]
fonteGrande=["Helvetica",30]
Vocêpodeagoraescolherafontedecadawidget,desta
maneira:
etiquetaTextoNome.config(bg="#e0e0ff",fg="#111111",
font=fonteMedia)
etiquetaValorNome.config(bg="#e0e0ff",fg="#111111",
font=fonteGrande)
Namodificaçãoacima,aúnicacoisaquefoiacrescentada
ao .config() foi font=fonteMedia and font=fonteGrande .
9
SalveSeuProjeto
10
Desafio:Fazendocomqueoswidgetsfiquem
maisbonitos
Vocêconsegueacrescentarfontesecoresparamelhorara
aparênciadaGUIdoseuPokedex.Vejaaquiumexemplo
decomoelepodeficar:
SeuPokedexpodeterumaaparênciadiferentedesta.Você
podeusardiferentesfontes,porexemplo Times , Courier ,
ouqualqueroutrafonteinstaladanoseucomputador.
Vocêtambémpodeescolhersuasprópriascores(incluindo
códigohexadecimaldecores).
SalveSeuProjeto
11
Step3:Adicionandocomandos
AgoraquevocêtemumaGUIcomumaaparênciafantástica,vamos
fazerumbotãoquerealmentemostreosdadosdoPokemon!
ListadeAtividades
Primeiro,tenhacertezaquevocêtemumarquivo
chamado pokeapi.py salvonomesmodiretóriodoseu
programadeinterfaceGUIdoPokedex.Peçaajudaao
líderdoseuclubesevocênãoconseguirencontraro
arquivo.Estearquivocontémumafunçãochamada
getPokemonData()
,queobtémtodososdadosdeum
Pokemonespecífico.Parausarestafunção,vocêtem
apenasqueimportá-lodoarquivo pokeapi.py ,paraisto,
acrescenteestecódigonoiníciodoseuprograma:
frompokeapiimport*
Vamoscriarumanovafunçãochamada
mostreDadosDoPokemon()
getPokemonData()
,queiráusarafunção
quevocêacaboudeimportar.Esta
funçãoobteráosdadosdoPokemonescolhido,ecolocará
osdadosnasetiquetasdaGUI.Coloqueestecódigomais
próximodoiníciodoprograma:
#funçãoparamostrardadosparaumnúmerodepokemon
defmostreDadosDoPokemon():
#captureonúmerodigitadonacaixadeentrada
numeroDoPokemon=txtPokemonNo.get()
#useafunçãoencontradaem'pokeapi.py'paraobter
osdadosdopokemon
dicionarioDoPokemon=
getPokemonData(numeroDoPokemon)
12
#pegueosdadosdodicionárioeosutilizenas
etiquetas
etiquetaValorNome.configure(text=
dicionarioDoPokemon["name"])
etiquetaValorAtingidos.configure(text=
dicionarioDoPokemon["hp"])
Nãosepreocupeemcomoafunção getPokemonData()
funciona.Tudoquevocêprecisasaberéqueafunção
retorna(tedá)umdicionário.Eleéentãousadodentro
dafunção mostreDadosDoPokemon() paramostrarosdados
nasetiquetas name e hp .
Agoraquevocêtemasfunçõesquevocêprecisa,você
podeadicionarocomandoaobotão:
#umbotãoquevaiobterainformaçãoparaumpokemon
btnObterInfo=Button(janela,text="Obtenhadados!",
command=mostreDadosDoPokemon)
Agoratentedigitarumnúmeronacaixadeentradade
textoevejaoqueacontece:
13
VocêpodeatémesmofazerumjogodeTopPokemon,
paraistobastaremoverowidgettheentradadetextoe,
aoinvésdistopegarumPokemonaleatórioacadavez.
Apenasmudeafunção mostreDadosDoPokemon() para:
#obtenhaumnúmeroaleatóriodepokemon
numeroDoPokemon=randint(1,718)
#(orestantedafunçãocontinuaomesmo...)
Lembre-sedeimportaromódulo random noiníciodoseu
programa( fromrandomimport* ).Vocêpodecompetir
comumamigo,comparandoquemobteveomaior
númeroparaumahabilidadeparticular.
SalveSeuProjeto
Desafio:TerminaroseuPokedex
Adicionecódigoàsuafunção mostreDadosDoPokemon()
paramostraroataque,adefesaeavelocidadedo
Pokemon.Vocêprecisarásaberqueaschavesdo
dicionáriosão:
Ataque- dicionarioDoPokemon["attack"])
Defesa- dicionarioDoPokemon["defense"]) (perceba
queaortografiadoinglêsamericanoéutilizada!)
Velocidade- dicionarioDoPokemon["speed"])
Sevocêpreferir,vocêpodeatémesmomudar(ou
acrescentar)osdadosquesãomostradosparacada
Pokemon.Vocêtambémpodemostrar "happiness" ,
"height"
, "weight" emuitasoutrascaracterísticas.
Vocêpodeusarestesiteparavertodososdadosde
14
Vocêpodeusarestesiteparavertodososdadosde
Pokemon.
SalveSeuProjeto
Step4:(Opcional)Acrescentandoumaimagem
TambémépossívelmostrarafotodoPokemonselecionadonoseu
Pokedex!
15
Nota
Vocêsópodecompletarestepassosevocêtiveromódulo
‘pillow’instaladonoseucomputador.Sevocênãotem
certeza,pergunteaoseulíderdeclube.
ListadeAtividades
ÉumpoucodifícilmostaraimagemdeumPokemonno
seuPokedex,masnãosepreocupe-existeumafunção
getPokemonImage()
noarquivo pokeapi.py parafazero
trabalhodifícilparavocê!Estafunçãoobtémaimagem
doPokemon,quepodesermostradaemumaetiqueta.
Primeiro,vamoscriarumaetiquetaparamostrara
imagemdentro.Adicioneestecódigoemalgumpontodo
seuprogramaprincipal,juntamentecomasoutras
etiquetas:
#etiquetaparaaimagemdoseupokemon
etiquetaImage=tkinter.Label(janela)
etiquetaImage.config(bg="#e0e0ff",fg="#111111")
etiquetaImage.pack()
Vocêpodemodificarafunção mostreDadosDoPokemon() para
mostrartambémaimagem:
16
#obtenhaumnúmeroaleatóriodepokemon
numeroDoPokemon=randint(1,178)
#useafunçãoacimaparaobterosdadoseaimagem
dopokemon
dicionarioDoPokemon=
getPokemonData(numeroDoPokemon)
imagemDoPokemon=getPokemonImage(numeroDoPokemon)
#pegueosdadosdodicionárioeosutilizenas
etiquetas
etiquetaValorNome.configure(text=
dicionarioDoPokemon["name"])
etiquetaValorAtingidos.configure(text=
dicionarioDoPokemon["hp"])
etiquetaValorAtaque.configure(text=
dicionarioDoPokemon["attack"])
etiquetaValorDefesa.configure(text=
dicionarioDoPokemon["defense"])
etiquetaValorVelocidade.configure(text=
dicionarioDoPokemon["speed"])
#adicioneaimagemecoloque-anaetiqueta
etiquetaImage.configure(image=imagemDoPokemon)
etiquetaImage.image=imagemDoPokemon
Quandovocêrodarseuprogramaeclicarem“Obtenha
umPokemon!”vocêverátambémumaimagem!
17
SalveSeuProjeto
18

Baixar PDF

Transcrição

Documentos relacionados

Caça fantasmas

Baixar PDF - Languages

Baixar PDF

Minecraft 2D

Jogo da Memória

Arte em ASCII

Secret Messages

regulamento

Lojamundi – Tecnologia Sem Limites www.lojamundi.com.br

Pokemon World