Посебна функција за цртање у програму без анимације¶

За почетак прикажимо како се цртање може издвојити у посебну функцију (и то у прво у програму без анимација, а затим у програму са анимацијама). Кренимо од програма који смо раније већ срели, који црта три круга у разним бојама.

import pygame as pg

import pygamebg

​

# otvaramo prozor

(sirina, visina) = (200, 200)

prozor = pygamebg.open_window(sirina, visina, "Три круга")

​

​

prozor.fill(pg.Color("white")) # bojimo pozadinu u belo

(cx, cy) = (sirina // 2, visina // 2) # centar krugova je u sredni ekrana

pg.draw.circle(prozor, pg.Color("red"), (cx, cy), 100)   # crveni krug

pg.draw.circle(prozor, pg.Color("blue"), (cx, cy), 75)   # plavi krug

pg.draw.circle(prozor, pg.Color("green"), (cx, cy), 50)  # zeleni krug

​

​

# prikazujemo prozor i čekamo da ga korisnik isključi

pygamebg.wait_loop()

​

Цртање кругова је део главног програма. Исти ефекат можемо постићи ако дефинишемо функцију crtaj коју ћемо позвати из главног програма.

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 200) # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Три круга")

​

​

​

def crtaj():

    prozor.fill(pg.Color("white")) # bojimo pozadinu u belo

    (cx, cy) = (sirina // 2, visina // 2) # centar krugova je u sredni ekrana

    pg.draw.circle(prozor, pg.Color("red"), (cx, cy), 100)   # crveni krug

    pg.draw.circle(prozor, pg.Color("blue"), (cx, cy), 75)   # plavi krug

    pg.draw.circle(prozor, pg.Color("green"), (cx, cy), 50)  # zeleni krug

​

​

# pozivamo funkciju za crtanje

crtaj()

​

# prikazujemo prozor i čekamo da ga korisnik isključi

pygamebg.wait_loop()

​

Насумично одређивање боје позадине током анимације¶

Наредни програм ће приказивати једноставну анимацију у којој ћемо четири пута у секунди на насумичан начин одређивати боју позадине. Одређивање насумичне боје вршићемо помоћу посебне функције nasumicna_boja. Дефинисаћемо функцију crtaj у којој ће се насумично одређивати боја и затим ће се позадина прозора бојити том бојом. Пошто ћемо користити библиотеку PyGameBg, анимацију ћемо на крају програма покретати позивом pygamebg.frame_loop(4, crtaj), чиме ћемо постићи да се функција crtaj аутоматски изнова позива 4 пута у секунди.

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 200)

prozor = pygamebg.open_window(sirina, visina, "Боја позадине")

​

​

def nasumicna_boja():

    return (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))

​

def crtaj():

    boja = nasumicna_boja()  # nasumično određujemo boju pozadine

    prozor.fill(boja)        # bojimo pozadinu prozora

​

# pokrećemo animaciju tako što funkciju crtaj pozivamo 4 puta u sekundi

pygamebg.frame_loop(4, crtaj)

​

Подијум за игру¶

По истом принципу можемо прилагодити програм који је исцртавао подијум за игру, тако да подијум стварно „оживи”. Пронађи кôд који исцртава подијум и на основу тога допуни функцију crtaj.

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (400, 400) # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Подијум за игру")

​

def nasumicna_boja():

    return (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))

​

def crtaj():

    ???

​

# pokrećemo animaciju tako da se svake sekunde poziva funkcija crtaj

pygamebg.frame_loop(1, crtaj)

​

Промена боје позадине у круг¶

У многим анимацијама оно што се црта зависи од података који се мењају током анимације. Променимо програм у ком се мења боја позадине екрана тако да се боје не мењају насумично, него да се редом смењују црвена, зелена и плава.

Најједноставнији начин да се задатак реши је да боје држимо у листи (или торци) и да уз листу одржавамо и позицију текуће боје (њен индекс у листи). Након коришћења боје са те позиције, позицију ћемо увећавати за 1, при том проверавајући да се након последње боје поново вратимо на прву (да индекс постане 0). Најједноставнији начин да се то уради је да се након увећавања индекса за 1 израчуна његов остатак при дељењу са дужином листе (укупним бројем боја). Програм поново можемо реализовати издвајањем цртања у помоћну функцију, која ће се она током анимације аутоматски позивати два пута у секунди.

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 200)   # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Боја позадине")

​

​

boje = ["red", "green", "blue"]  # boje koje ćemo postavljati

broj_boje = 0                    # pozicija tekuće boje

​

def crtaj():

    global broj_boje                         # ova promenljiva se menja u funkciji

    prozor.fill(pg.Color(boje[broj_boje]))   # postavljanje boje pozadine na tekući element liste

    broj_boje = (broj_boje + 1) % len(boje)  # prelazimo na narednu boju

​

# pokrećemo animaciju tako što se funkcija crtaj poziva dva puta u sekundi

pygamebg.frame_loop(2, crtaj)

​

Приметимо да кôд који се налази у функцији користи променљиве boje и broj_boje које су дефинисане ван функције. Такве променљиве се називају глобалне променљиве и њихова се вредност може без икаквих проблема очитати из функције. Међутим, промена вредности глобалних у функцији је компликованија. Наиме, ако желимо да глобалној променљивој променимо вредност у функцији, на почетку те функције морамо нагласити да је та променљива глобална (помоћу кључне речи global иза које следи листа глобалних променљивих, раздвојених запетама, којима ћемо у тој функцији мењати вредност). Ако у функцији не бисмо навели реч global, добили бисмо поруку о грешци.

UnboundLocalError: local variable 'broj_boje' referenced before assignment

Нагласимо да глобалне променљиве нису најбољи начин за организовање сложенијих програма и постоје бољи начини да се подаци организују, међутим, у кратким програмима какве ћемо ми писати глобалне променљиве представљају најједноставније решење и стога ћемо их у наставку користити.

Функција crtaj је у претходном програму извршавала два задатка. Једно је цртање сцене на основу тренутних вредности глобалних променљивих, а друго је промена вредности променљивих чиме се са текућег прелази на наредни фрејм. И наредни програми са анимацијама ће имати те две функционалности, па програм постаје лепши ако их раздвојимо у две функције (иако овај корак можда делује сувишан код овако кратких програма, код дужих програма ће бити веома корисно да поступак цртања одвојимо од поступка измене стања програма).

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 200) # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Боја позадине")

​

​

boje = ["red", "green", "blue"]  # boje koje ćemo postavljati

broj_boje = 0                    # pozicija tekuće boje

​

def crtaj():

    prozor.fill(pg.Color(boje[broj_boje]))  # postavljanje boje pozadine na tekući element liste

​

def novi_frejm():

    global broj_boje # menjaćemo ovu globalnu promenljivu

    broj_boje = (broj_boje + 1) % len(boje)  # prelazimo na narednu boju

    crtaj() # ponovo iscrtavamo prozor

​

​

# pokrećemo animaciju tako što se funkcija novi_frejm poziva dva puta u sekundi

pygamebg.frame_loop(2, novi_frejm)

​

Анализирајмо још једном претходни пример.

• Стање програма је једнозначно одређено глобалном целобројном променљивом broj_boje која одређује редни број боје којом се прозор боји. Почетна вредност ове променљиве је нула, што значи да боје крећу да се приказују од почетка листе. Боје су смештене у глобалној листи boje која се не мења током извршавања програма.

• Функција crtaj боји прозор бојом одређеном вредношћу променљиве broj_boje.

• Функција novi_frejm ажурира вредност стања тј. променљиве broj_boje тако што јој увећава вредност и враћа је на нулу када вредност достигне укупан број боја. Пошто се мења вредност променљиве broj_boje која је глобална, у функцији novi_frejm морамо да променљиву broj_boje означимо помоћу кључне речи global.

Сви програми са анимацијама које ћемо у наставку писати биће организовани на овај начин и твој задатак ће бити да дефинишеш променљиве које одређују стање програма и функције crtaj и novi_frejm. На пример, програм који насумично мења боју позадине можемо написати на следећи начин.

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 200) # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Боја позадине")

​

​

# funkcija koja vraća nasumično određenu boju

def nasumicna_boja():

    return (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))

​

boja = nasumicna_boja()  # postavljamo nasumično početnu boju

​

# funkcija koja se izvržava svaki put kada se iscrtava ekran

def crtaj():

    prozor.fill(boja) # bojimo pozadinu na tekuću boju

​

# funkcija koja se izvršava na svaki otkucaj tajmera

def novi_frejm():

    global boja

    boja = nasumicna_boja()  # postavljamo nasumično tekuću boju

    crtaj()

​

​

# zapocinjemo animaciju tako sto svake sekunde pozivamo funkciju novi_frejm

pygamebg.frame_loop(1, novi_frejm)

​

Анализирајмо још једном претходни пример.

• Стање програма је једнозначно одређено глобалном целобројном променљивом boja која одређује тренутну боју позадине екрана. Почетна вредност ове променљиве се одређује насумично.

• Функција crtaj боји прозор бојом одређеном вредношћу променљиве boja.

• Функција novi_frejm ажурира вредност стања тј. променљиве boja тако што јој насумично додељује нову вредност. Пошто се мења вредност променљиве boja која је глобална, у функцији novi_frejm морамо да променљиву boja означимо помоћу кључне речи global. Ова се функција позива аутоматски у правилним временским итервалим и након ажурирања променљивих она позива функцију crtaj да би се прозор поново исцртао.

Кретање лоптице¶

Прикажимо још један пример анимације организоване на начин који смо управо описали. Написаћемо програм који анимира лоптицу која се креће са леве ка десној ивици екрана.

import pygame as pg

import pygamebg

​

(sirina, visina) = (400, 100)   # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Лоптица")

​

​

x = 0  # pozicija loptice

​

def crtaj():

    # crtamo lopticu

    prozor.fill(pg.Color("white"))

    pg.draw.circle(prozor, pg.Color("red"), (x, visina // 2), 30)

​

def novi_frejm():

    global x

    x += 1    # pomeramo lopticu za jedan piksel nadesno

    crtaj()

​

​

# pokrecemo animaciju tako što funkciju novi_frejm pozivamo 50 puta u sekundi

pygamebg.frame_loop(50, novi_frejm)

​

• Потребно је да дефинишемо променљиве које ће описивати стање објеката који се анимирају. У нашем примеру то је једна црвена лоптица и пошто се она креће хоризонтално, по средини екрана довољно је да памтимо само њену координату x (то може, на пример, бити координата њеног центра, а могла би бити и, на пример, координата горњег левог темена квадрата описаног око ње). Пошто лоптица своје кретање започиње на левом крају екрана, променљиву x ћемо иницијализовати на нулу.

• Функција crtaj се сада реализује веома једноставно. У њој бојимо позадину екрана у бело и затим исцртавамо лоптицу коришћењем вредности њеног положаја x.

• При преласку на сваки нови фрејм потребно је да лоптицу померимо мало (на пример, за 1 пиксел) удесно. Дакле, у функцији novi_frejm потребно је само да увећамо вредност променљиве x за 1. Пошто се мења вредност променљиве x која је глобална, у функцији novi_frejm морамо променљиву x означимо помоћу кључне речи global. Након померања лоптице позивамо функцију crtaj.

Насумично цртање кругова¶

Приступимо решавању овог задатка на начин који смо описали. Размисли прво који подаци описују стање наше анимације.

• Дакле, тренутно стање програма одређено је координатама центра x и y, полупречником r и бојом круга boja и њих ћемо представити глобалним променљивама (при чему се полупречник неће мењати).

Размисли сада шта је задатак функције crtaj.

• Дакле, функција crtaj ће бојити позадину у бело (како би се обрисао претходни круг) и цртаће круг на основу тренутних вредности глобалних променљивих.

Размисли сада шта је задатак функције novi_frejm.

• Дакле, функција novi_frejm ће насумично одредити боју новог круга и одредиће x и y координате центра, тако да круг не испадне ван екрана. То ће важити ако x координата буде у интервалу $[r, sirina-r]$, а y координата буде у интервалу $[r, visina-r]$.

Покушај да самостално напишеш цео програм. Ако не успеш, не брини, јер тек почињеш да учиш како се реализују апликације. Потражи помоћ и затим допуни започети програмски кôд.

import random

import pygame as pg

import pygamebg

​

(sirina, visina) = (250, 250)   # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Насумични кругови")

​

​

​

# pokrecemo animaciju tako što funkciju novi_frejm pozivamo 4 puta u sekundi

pygamebg.frame_loop(4, novi_frejm)

​

Срце које куца¶

• Једини податак који се мења од фрејма до фрејма је то да ли треба или не треба приказати срце. Можемо увести логичку променљиву treba_crtati.

• У функцији crtaj слику ћемо приказивати само ако променљива treba_crtati има вредност тачно (тј. True).

• У функцији novi_frejm мењаћемо вредност променљиве treba_crtati. Ако јој је тренутно вредност True, тада треба да се промени на False, а ако јој је тренутно вредност False, тада треба да се промени на True. Најлакши начин да се то уради је да текућу вредност негирамо помоћу оператора not (наравно, можемо употребити и гранање).

Покушај да на основу овога допуниш започети програмски кôд.

import pygame as pg

import pygamebg

​

(sirina, visina) = (200, 181)  # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Срце")

​

srce_slika = pg.image.load("srce.png")  # slika srca

treba_crtati = True  # da li treba crtati srce

​

def crtaj():

    prozor.fill(pg.Color("white"))   # bojimo pozadinu u belo

    if ???:                          # crtamo srce ako je to potrebno

        prozor.blit(???, (0, 0))

​

def novi_frejm():

    global treba_crtati

    treba_crtati = ???      # negiramo vrednost treba_crtati

    crtaj()

​

# animacija poziva funkciju novi_frejm dva puta u sekundi

pygamebg.frame_loop(2, novi_frejm)

​

Смајлић и тужић¶

Овај задатак је поново веома сличан претходном.

• Логичка променљива smajlic ће одређивати стање програма.

• Ако је у функцији crtaj вредност те променљиве True, приказаћемо слику смајлића, а ако је вредност False, приказаћемо слику тужића.

• У функцији novi_frejm негираћемо вредност променљиве smajlic.

Покушај да на основу овога потпуно самостално напишеш програм. Ако не успеш, онда потражи помоћ и допуни започети програмски кôд.

import pygame as pg

import pygamebg

​

(sirina, visina) = (230, 230)  # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Смајлић и тужић")

​

​

​

# animacija poziva funkciju novi_frejm dva puta u sekundi

pygamebg.frame_loop(2, novi_frejm)

​

Домаћи задатак - сијалице¶

• Стање програма ће у потпуности бити одређено вредношћу променљиве редним бројем сијалице која је укључена.

• У функцији crtaj исцртаваћемо само укључену сијалицу у облику белог круга. Пречник сваке сијалице ћемо одредити тако што ћемо ширину екрана поделити редним бројем сијалице. Координата x центра те сијалице биће одређена редним бројем укључене сијалице (центар сијалице 0 налази се на растојању r од леве ивице екрана, центар сијалице 1 на растојању r + 2r, центар сијалице 2 на растојању r+4r и тако даље).

• У функцији novi_frejm увећаваћемо редни број укључене сијалице, при чему ћемо га враћати на нулу када достигне укупан број сијалица.

Покушај да на основу претходне дикусије потпуно самостално решиш задатак. Ако не успеш, онда потражи помоћ, па допуни започети кôд.

import pygame as pg

import pygamebg

​

(sirina, visina) = (400, 100) # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Диоде")

​

​

​

# tokom animacije se funkcija novi_frejm poziva 5 puta u sekundi

pygamebg.frame_loop(5, novi_frejm)

​

Домаћи задатак - цртани филм¶

Овај задатак личи на задатак у ком смо током анимације циклично мењали боје позадине, једино што ћемо уместо листе која садржи називе боја чувати листу која садржи слике које чине цртани филм. Слике је пожељно учитати на почетку програма, пре почетка анимације (подсетимо се, слику можемо учитати помоћу функције pg.image.load).

• Стање анимације биће одређено искључиво редним бројем слике која се тренутно приказује. Променљива slika представљаће позицију слике у листи која се приказује у текућем фрејму.

• Функција crtaj има задатак само да обрише екран (бојећи позадину у бело) и да затим прикаже слику из листе slike која се налази на позицији одређеној променљивом slika (подсетимо се, слику приказујемо помоћу функције prozor.blit).

• Функција novi_frejm ће имати задатак да увећа вредност променљиве slika, тако да се вредност врати на нулу када превазиђе последњу вредност у листи.

На основу претходне дискусије допуни наредни програм.

import pygame as pg

import pygamebg

​

(sirina, visina) = (150, 180)  # otvaramo prozor

prozor = pygamebg.open_window(sirina, visina, "Цртани филм")

​

sredina_y = visina / 2

​

# učitavamo u listu slike setanje1.png, setanje2.png, ..., setanje5.png

slike = []   # niz u koji dodajemo slike

for i in range(1, 6):

    naziv_slike = "setanje" + str(i) + ".png"  # gradimo naziv slike od delova

    slike.append(???)   # učitavamo sliku i dodajemo je na kraj niza

​

slika = 0  # indeks tekuće slike

​

def crtaj():

    prozor.fill(pg.Color("white"))    # bojimo pozadinu prozora u belo

    ???                               # prikazujemo sliku

​

def novi_frejm():

    global slika  # ovu globalnu promenljivu menjamo

    slika = ???   # prelazimo na sledeću sliku

    crtaj()

​

# animacija poziva funkciju novi frejm 5 puta u sekundi

pygamebg.frame_loop(5, novi_frejm)

​

Пројекат - дигитални сат¶

Приказ тренутног времена потребно је извршити сваке секунде. Задатак ћемо решити помоћу анимације која је подешена тако да се сваке прелази на нови фрејм и исцртава садржај прозора.

Ова анимација је необична јер нема потребе за представљањем стања прозора. Дакле, нећемо имати нити глобалне променљиве нити функцију за прелазак на нови фрејм. У функцији crtaj очитаваћемо тренутно време и приказивати га на средини екрана.

Језик Python нам пружа подршку да очитамо тренутно време системског сата рачунара на ком се програм извршава. Функција datetime.now() из модула datetime (који увозимо на почетку програма помоћу import datetime) враћа тренутно време у облику структуре чије поље hour садржи број сати (од 0 до 23), поље minute садржи број минута (од 0 до 59) и second садржи број секунди (од 0 до 59). На основу тога поставићемо вредности променљивих sati, minuti, sekunde.

На основу броја сати, минута и секунди градимо текст који ћемо приказати. Желимо да и сати и минути и секунде увек имају тачно две цифре (ако су једноцифрени, желимо да се допуне водећим нулама). У језику Python ниску str можемо допунити водећим нулама до дужине n позивом str.rjust(n, "0"). Подсетимо се да ниске надовезујемо применом оператора +.

Када смо направили ниску која садржи тренутно време приказујемо је на средини прозора. То радимо на потпуно исти начин као у примерима које смо приказали у поглављу о цртању (можемо да дефинишемо посебну функцију која исписује дати текст тако да му центар буде у датој тачки).

Допуни наредни програм на основу претходне дискусије.

import pygame as pg, datetime

​

pg.init() # inicijalizujemo biblioteku PyGame

pg.display.set_caption("Дигитални сат") # otvaramo prozor

(sirina, visina) = (200, 200)

prozor = pg.display.set_mode((sirina, visina))

​

def tekst_centriran(poruka, x, y):

    font = pg.font.SysFont("Arial", 40)     # font kojim će biti prikazan tekst

    # gradimo sličicu koja predstavlja tu poruku ispisanu crnom bojom

    tekst = font.render(poruka, True, ???)

    # određujemo veličinu tog teksta (da bismo mogli da ga centriramo)

    (sirina_teksta, visina_teksta) = (tekst.get_width(), ???)

    # položaj određujemo tako da tekst bude centriran

    (x, y) = (???, ???)

    # prikazujemo sličicu na odgovarajućem mestu na ekranu

    prozor.blit(???, (x, y))

​

def crtaj():

    prozor.fill(pg.Color("white"))          # bojimo pozadinu u belo

    vreme = datetime.datetime.now()         # određujemo trenutno vreme

    sati = vreme.hour

    minuti = vreme.minute

    sekundi = vreme.second

    # tekst koja će se ispisivati

    poruka = (str(sati).rjust(2, "0") + ":" +

              ??? + ":" + \

              ???)

    tekst_centriran(poruka, sirina / 2, ???)

kraj = False

sat = pg.time.Clock()  # sat koji određuje broj frejmova u sekundi

while not kraj:

    # crtamo i ažuriramo sadržaj prozora

    crtaj()

    pg.display.update()

​

    # proveravamo da li je korisnik isključio prozor

    for dogadjaj in pg.event.get():

        if dogadjaj.type == pg.QUIT:

            kraj = True

​

    # pauziramo do sledeceg frejma

    sat.tick(1)

​

pg.quit() # isključujemo rad biblioteke PyGame

​