Programski paket PixelByPixel za vizualizaciju rasterskih algoritama računarske grafike

Size: px
Start display at page:

Download "Programski paket PixelByPixel za vizualizaciju rasterskih algoritama računarske grafike"

Transcription

1 UNIVERZITET U NIŠU PRIRODNO-MATEMATIČKI FAKULTET DEPARTMAN ZA RAČUNARSKE NAUKE Programski paket PixelByPixel za vizualizaciju rasterskih algoritama računarske grafike Master rad Mentor: dr Vesna Veličković Student: Andrija Đurišić Niš, 2018.

2 Sadržaj Sadržaj 1 Uvod Osnovni pojmovi računarske grafike Razlika između rasterske i vektorske grafike Vektorska grafika Rasterska grafika Rezolucija slike Boja piksela Formati rasterskih slika Osobine rasterske slike Koordinatni sistem površine za crtanje Predstavljanje piksela u memoriji Primena računarske grafike Preteče softvera PixelByPixel Programski paket MrPixel Korisnički interfejs Alati za rad programskim paketom MrPixel Alati za rad sa programskim kôdom Alati za izvršavanje kôda Alati za vizalizaciju piksela Koriničke funkcije MrPixel-a Programski paket MsPixel Korisnički interfejs Mesto za rad u programskom paketu MsPixel Alati za izvršavanje kôda Koriničke funkcije MsPixel-a Programski paket MrPixelMM Korisnički interfejs

3 Sadržaj Alati za rad programskim paketom MrPixelMM Alati za izvršavanje kôda Alati za kreiranje panela za vizalizaciju Koriničke funkcije MrPixelMM-a Izbor tehnologija i potrebnih alata Klase C#.NET koje koristi paket PixelByPixel Klasa Graphics Klasa Pen Klasa Brush Klasa Color Višestruke forme u PixelByPixel-u Dijalozi u PixelByPixel-u MetroFramework O PaxScripter-u Metode PaxScripter -a Osobine PaxScripter -a Događaji PaxScripter -a Programski paket PixelByPixel Korisnički interfejs Panel za vizualizaciju Code&Text editor Paleta alata Alati programskog paketa PixelByPixel-a Paleta alata Script Paleta alata Image Paleta alata Edit Paleta Grid Peleta Editor Paleta Options

4 Sadržaj Menu Pixel By Pixel Search box Korisničke funkcije PixelByPixel-a Funkcija creategrid Funkcija DrawAxis Funkcija DrawHalfAxis Funkcija Plot. Bojenje piksela podrazumevanom bojom Funkcija Plot. Bojenje piksela zadatom bojom Funkcija PlotColor Funkcija PlotEx Funkcija ison Funkcija Invert Funkcija DrawLine Funkcija DrawEllipse Bojenje piksela klikovima miša Primeri vizualizacije nekih rasterskih algoritama Primeri vizualizacije piksela Primeri vizualizacije nekih rasterskih algoritama Bresenham-ov algoritam za crtanje duži Bresenham-ov algoritam za prvi oktant Bresenham-ov algoritam za sve oktante Bresenham-ov algoritam za crtanje kruga Zaključak Lista slika Literatura

5 1 Uvod Uvod U ovom radu opisan je postupak razvoja grafičke aplikacije, odnosno programskog paketa PixelByPixel koji služi za pisanje, testiranje i iscrtavanje odnosno vizualizaciju algoritama rasterske grafike. Ovaj programski paket razvijen je sa ciljem da prikaže postupak rada unetog algoritma. Programski paket PixelByPixel je razvijen za potrebe predmeta Računarska grafika, na Prirodno matematičkom fakultetu u Nišu. Osim studentima, paket je namenjen svima koji žele da uče ili da usavrše svoje znanje iz računarske grafike. U glavi koja sledi nakon Uvoda, Osnovni pojmovi računarske grafike uvode se pojmovi koje je potrebno razumeti, a vezani su za računarsku grafiku. U glavi Preteče softvera PixelByPixel su predstavljena tri programska paketa koji su prethodila razvoju ovog programskog paketa. U glavi Izbor tehnologije i potrebnih softverskih alata govori se programu u kome je razvijena desktop aplikacija PixelByPixel. U petoj glavi Programski paket PixelByPixel govori se o samom programskom paketu. Tu se nalaze metode koje predstavljaju funkcionalnost paketa, a koje korisnik može da koristi prilikom implementacije algoritma. U ovoj glavi se nalaze i opisi alata koje sadrži programski paket. Šesta glava se odnosi na primenu programskog paketa i u ovoj glavi dat je opis korišćenja paketa na konkretnim primerima. Poslednju glavu čini zaključak. 4

6 2 Osnovni pojmovi računarske grafike Osnovni pojmovi računarske grafike Grafika predstavlja vizuelno prikazivanje fotografija, crteža, skica, dijagrama i slično na nekoj površini kao što su platno, monitor, papir i sl. Računarska grafika, jeste oblik grafike koja za stvaranje i prikazivanje informacije koristi računar. Računarska grafika, u opštem obliku, obuhvata: - vektorsku grafiku i - rastersku grafiku. Ova podela je izvršena na osnovu osnovnih elemenata od kojih je građena slika. Vektorska grafika definiše slike pomoću jednostavnih geometrijskih oblika kao što su tačke, linije, krive i poligoni. Za prikaz slika koje se sastoje od mnogo detalja između kojih je veoma teško uspostaviti neku jasnu matematičku vezu (npr. za prikaz fotografija ili umetničkih slika), vektorska grafika je potpuno nepodesna. U tim slučajevima se koristi rasterska (bitmapirana) grafika. 2.1 Razlika između rasterske i vektorske grafike Upoređivanjem rasterske i vektorske grafike uočavaju se sledeće razlike: prva bitna razlika je da pri povećanju bitmap slike opada kvalitet slike, dok se kod vektorskih slika ne gubi kvalitet slika, zato što pri svakoj izmeni računar ponovo izračunava vrednost svih piksela. Kod vektorske slike uvećavanje se vrši promenom veličine vektora koristeći aritmetičke formule, tako da povećanje slike nema uticaja na kvalitet prikaza. Druga bitna razlika je veličini grafičkog fajla. Slike rasterske grafike imaju mnogo veći fajl, dok vektorska grafika omogućuje mnogo manju veličinu fajla. Primer: prikaz linije u rasterskoj i vektorskoj grafici: Rasterska slika: 5

7 Osnovni pojmovi računarske grafike Vektorska slika: Sledeći primer ilustruje razliku između rasterske i vektorske slike: Slika 2.1. Razlika između rasterske i vektorske grafike. 2.2 Vektorska grafika Vektorska grafika je način prikazivanja slike pomoću geometrijskih oblika koji se zasnivaju na matematičkim jednačinama. Osnovni elementi koji grade sliku su objekti, poput pravih i krivih linija, kao i otvorenih i zatvorenih, ispunjenih i neispunjenih geometrijskih oblika (pravougaonika, elipsi itd.) koji mogu da se preklapaju, prekrivaju ili uklapaju i na taj način kreiraju sliku. Za iscrtavanje ovakvih slika, računari koriste matematičke formule vektorske algebre (odakle i potiče naziv vektorska grafika) koje opisuju način i redosled iscrtavanja objekata. Kod vektorske grafike slika se čuva kao kolekcija figura, zajedno sa parametrima koji definišu kako će figura biti iscrtana i gde će biti pozicionirana. Prilikom čuvanja geometrijskih figura u memoriji računara pamte se samo njegovi parametri. Za čuvanje ovakvih slika u memoriji potrebno je samo nekoliko bajtova, bez obzira koliki je objekat koji se prikazuje. Koliko memorije će zauzeti slika vektorske grafike zavisi samo od broja elemenata od kojih se slika sastoji, a ne i od veličine slike. Primer vektorskog predstavljanja kruga. Potrebno je zapamtiti: - tip objekta krug, - koordinate njegovog centra, - poluprečnik, 6

8 - boju, - debljinu, - vrstu linije i - boju kojom je popunjen. Osnovni pojmovi računarske grafike Vektorski formati se najčešće koriste za prikaz logotipova, tipografije znakova i sličnog sadržaja. Najpoznatiji vektorski formati su: EPS, AI, PDF itd. Najrasprostranjeniji programi koji podržavaju vektorski format su: Adobe Illustrator, Corel Draw, Macromedia Freehand i drugi. 2.3 Rasterska grafika Rasterska grafika je naziv za tip grafike kod koje se informacija koja treba da se prikaže predstavlja pikselima. Matrica u kojoj su smešteni pikseli zove se raster. Slika se nakon generisanja u računaru prosleđuje izlaznoj jedinici radi njenog grafičkog prikazivanja. Slika se najčešće prikazuje na monitoru nakon čega se može prikazati na nekom drugom medijumu ili se odštampati. Osnovne osobine rasterske slike su: rezolucija slike, boja odnosno dubina slike i format slike, čija objašnjenja slede u nastavku rada Rezolucija slike Rezolucija slike je veličina matrice u kojoj se smeštaju pikseli. Reč je o dvodimenzionalnoj matrici u kojoj jedna dimenzija čini širinu, a druga - visinu slike. Ukupan broj redova i kolona, odnosno proizvod piksela po širini i visini daje rezoluciju slike. Primer: Ako slika ima M piksela po širini i N piksela po dužini, tada se rezolucija slike dobija tako što se pomnoži broj piksela po vertikalnoj dimenziji sa brojem piksela po horizontalnoj dimenzij, tj. MxN. Broj koji se dobije čini rezoluciju cele slike. Radi lakšeg korišćenja, taj broj piksela se može izraziti preko broja megapiksela odnosno kada se proizvod broja piksela po vrstama i kolonama podeli sa milion ( ). Ovaj primer ilustruje apsolutnu rezoluciju. Rezolucija može da se izrazi i kao relativna rezolucija koja predstavlja broj piksela po jedinici dužine (najčešće po inču). 7

9 Osnovni pojmovi računarske grafike Boja piksela Rasterska slika se sastoji od piksela. Svaki piksel slike se čuva posebno u memoriji. Za svaki piksel se u memoriji alocira jedan, dva, tri ili četiri bajta, zavisno od dubine boje koju piksel sadrži. Zavisno od broja nijansi koje piksel može da sadrži rasterske slike mogu biti: - monohromatske slike (crno bele slike) - grayscale (sive slike), - slike u boji (kolor slike). Na kvalitet rasterske slike, osim rezolucije, utiče i dubina boje. Dubina boje određuje ukupan broj različitih nijansi boje koje se mogu predstaviti. Vrednost svakog piksela se posebno definiše u memoriji. Zavisno od broja nijansi piksel u memoriji računara može biti predstavljen kao: a) 1-bit-na crno-bela slika - jednom pikselu na ekranu odgovara jedan bit u memoriji. To je najmanji mogući sadržaj informacije za svaki piksel. Vrednost može biti 0 ili 1. Pikseli sa oznakom 1 su označeni kao crni, a pikseli sa oznakom 0 kao beli. Slike predstavljene na ovaj način, zauzimaju: (širina x visina) bitova. Ovaj način predstavljanja pogodan je za čuvanje jednostavne grafike i teksta. b) 8-bit-na siva slika - jednom pikselu na ekranu odgovara jedan bajt (8 bita) u memoriji, što omogućava da piksel ima 256 različitih nivoa osvetljenosti. Po dogovoru 0 označava belu boju, a 255 crnu boju. U binarnom obliku, beli piksel bi imao vrednost , a crni Vrednosti između 0 i 255 predstavljaju različite nijanse sive boje. Vrednost 127 predstavlja 50% maksimalnog nivoa osvetljenosti. Ovakva slika zauzima: (širina x visina x 8) bitova memorije, odnosno (visina x širina) bajtova. Slika nijansi sive boje c) 16-bit-ne slike u boji (16 bit RGB) - jednom pikselu na ekranu odgovaraju dva bajta (16 bita) u memoriji. Ovaj sistem koristi po 5 bita za svaku boju (R,G,B) i jedan bit za alfa kanal. Ovakva slika zauzima (širina x visina x 16) bitova memorije odnosno (širina x visina x 2) bajta memorije. 8

10 Osnovni pojmovi računarske grafike Slika bit-na slika u boji d) 24 bit-ne slike u boji (24 bit RGB) - jednom pikselu na ekranu odgovaraju tri bajta (24 bita) u memoriji. Ovaj sistem koristi po 8 bita (1bajt) za svaku komponentu boje. Vrednost 0 označava da komponenta nema udeo u toj boji, a 255 se odnosi na potpuno zasićen udeo te boje. U binarnom obliku čista crvena boja, 24-bitne dubine, prikazana je kao (prvih 8 bita predstavlja udeo crvene boje, drugih 8 bita udeo zelene i poslednjih 8 bita udeo plave boje). S obzirom na to da svaka komponenta ima 256 različitih stanja, postoji mogućih boja. Ovakva slika zauzima: (širina x visina x 3) bajta memorije. Slika bit-na slika u boji e) 32 bit-ne slike u boji (32 bit RGB) jednom pikselu na ekranu odgovaraju četiri bajta (32 bita) u memoriji. Ovo je isti sistem kao kod 24 bit-nih boja, samo sa dodatkom 8 bit-nog alfa kanala. Alfa kanal se koristi da predstavi prozirnost. Kod ovog sistema postoji 4.3 miliona boja. Slika bit-na slika u boji 9

11 Osnovni pojmovi računarske grafike Formati rasterskih slika Format slike predstavlja način na koji je slika snimljena u datoteci. Postoji veći broj formata bitmapiranih slika, a najkorišćeniji su: bmp, jpeg, gif, png i tiff. Format BMP (bitmap) Bitmap predstavlja dvodimenzionalnu matricu u kojoj se smeštaju pikseli, koji čine informaciju slike. U datoteku se skladišti svaki piksel slike pojedinačno sa odgovarajućim brojem bitova (bajtova) koji određuju boju. Format JPEG (Joint Photographers Experts Group) Format JPEG je grafički format koji je izveden iz bitmap-e. Ovaj format se u datoteku skladišti sa malim gubitkom kvaliteta i ne omogućava vraćanje na originalnu sliku, nakon kompresije. Predstavlja najkorišćeniji format slike danas. Razvijen je kako bi se smanjila veličina datoteke. Format GIF (Graphics Interchange Format) Format GIF je grafički format koji je izveden iz bitmap-e. U datoteku se snima bez gubitka podataka. Koristi maksimalno 256 boja. Niz istih piksela se skladište kao jedan simbol pomnožen sa brojem njegovih ponavljanja. Ovaj format se može koristiti na različitim platformama. Pogodan je za slike sa manjim brojem različitih boja (npr. grafika, crteži...). U jedan.gif fajl moguće je smestiti više slika GIF animacija. Format PNG (Portable Network Format Graphics) Format PNG je grafički format koji je takođe izveden iz bitmap-e. Predstavlja napredniju verziju.gif formata. Zamišljen je kao grafički format za razmenu preko interneta, a ne za profesionalnu upotrebu. Sadrži dva formata : - png-8, sadrži 8-bit-nu informaciju o bojama, - png-24, sadrži 24-bit-nu informaciju o bojama. Namenjen je za grafiku na Web-u. 10

12 Osnovni pojmovi računarske grafike Format TIFF (Tagged Image File Format) Format TIFF je grafički format koji je izveden iz bitmap-e. Podržava razne metode kompresije i razne modele boja. Namenjen je za profesionalnu upotrebu. Ovo je najčešći format za štampanje i skeniranje. Podržava različite platforme, poput Microsoft Windows-a i Macintosh-a Osobine rasterske slike Rasterska slika se još naziva i bitmapa, digitalna slika, rasterska grafika, ili raster. Termin bitmap se u osnovi koristi za sisteme sa jednim bitom po pikselu. Za sisteme sa više bitova po pikselu koristi se izraz pixmap. Ove slike su veoma velike. Svaki piksel na slici ima sopstvenu adresu izraženu preko x i y koordinata. Brojeći piksele od koordinatnog početka do odabranog piksela, po obe ose, svakom pikselu se može dodeliti jedinstvena adresa. Znajući adresu piksela i oblik mreže (koordinatnog sistema) lako se može odrediti pozicija bilo kog piksela u rasteru. Rasterska grafika ima fiksiranu rezoluciju. Drugim rečima, rasterske (bitmap) grafike izgledaju najbolje kada se prikazuju ili štampaju u originalnoj veličini. Uvećanjem ovih grafika, dolazi do uvećanja piksela, koji čine da grafika gubi na kvalitetu i jasnoći. Umanjenjem se gube pikseli da bi se slika prikazala u novoj veličini, čime se takođe gubi na kvalitetu slike. Rasterska slika se ne može povećati na veću rezoluciju bez gubitka kvaliteta Koordinatni sistem površine za crtanje Svaka grafička površina za crtanje ima koordinatni sistem koji malo odstupa od klasičnog matematčkog koordinatnog sistema. Zapravo, u ovom koordinatnom sistemu se koordinatni početak (X koordinata jednaka nuli i Y koodinata jednaka nuli) nalazi u gornjem levom uglu, pozitivni deo X ose ide od leve stranice ka desnoj, a pozitivni deo Y ose od vrha ka dnu. 11

13 Osnovni pojmovi računarske grafike Slika 2.6. Grafički koordinatni sistem Slika 2.7. Adresiranje piksela Predstavljanje piksela u memoriji Na slici 2.8. prikazana je crno bela slika i način predstavljanja njenih piksela u memoriji račiunara. Slika 2.8. Crno bela slika Predstavljanje 1-bit-ne slike bitmap-om vrši se tako što se obojen piksel predstavlja jedinicom, a neobojen - nulom. Na taj način se vrši pretvaranje piksela u bitove. Na osnovu toga slika može se predstaviti binarno kao: , , , , , ili dekadno kao: 1, 2, 4, 6, 8, 16, 32. Ovaj način opisivanja zove se mapa bitova, odnosno bitmapa. 12

14 Osnovni pojmovi računarske grafike Slika 2.9. Predstavljanje crno bele slike u memoriji računara Za sliku u boji, za svaki piksel mora se upisati još i podatak o boji, npr. dodati još dva bita za svaki piksel ako se radi o paleti od 8 boja (Red, Green, Blue Crvena, Zelena i Plava), po jedan bit za svaku osnovnu boju. Slika Predstavljanje slike u boji u memoriji računara 2.4 Primena računarske grafike Računarska grafika ima primenu u raznim oblastima: u tehnici, konstruisanju, nauci, medicini, industriji zabave, sve do kontrole kvaliteta u procesnoj industriji, a najčešće se primenjuje za: računarske igre, računarske animacije, snimanje, obradu i reprodukciju video sadržaja, za kreiranje specijalnih filmskih efekata, za obradu slika, za raznorazne simulacije i sl. Takođe, računarska grafika ima upotrebu i: - u računarstvu radi bolje komunikacije sa korisnikom programa, - kao pomoć u učenju (pomaže da se gradivo lakše razume i zapamti), - u poslovanju i ekonomiji (dijagrami), - u filmskoj industriji (specijalni efekti), - na internetu radi reklamiranja proizvoda, - u nauci, industriji, arhitekturi, - u dizajnu, i u drugim oblastima. 13

15 3 Preteče softvera PixelByPixel Preteče softvera PixelByPixel U ovoj glavi biće predstavljena tri programska paketa koja služe za vizualizaciju algoritama rasterske grafike i koji su preteče programskog paketa PixelByPixel: MrPixel, MsPixel, MrPixelMM. Ove programske pakete su razvili studenti za potrebe kursa Računarska grafika koji se predaje na Prirodno-matematičkom fakultetu u Nišu, na Departmanu za računarske nauke kod profesorke Vesne Veličković. Aktivno su korišćeni u nastavi ovog predmeta, testirani su i dorađivani tokom vremena u skladu sa potrebama i sugestijama studenata i profesora. 3.1 Programski paket MrPixel Programski paket MrPixel je razvijen u programskom okruženju Delphi. Ima mogućnost pisanja programskog kôda u pseudo jeziku koji ima sintaksu Pascal-a. Taj kôd se interpretira i vizualizuje na panelu za vizualizaciju. Na tom panelu su pikseli uvećani tako da studenti lako uočavaju koji pikseli su uključeni i kako se vrši postupak izvršenja algoritma. Autor ovog programskog paketa je Branislav Stojković Korisnički interfejs Korisnički interfejs paketa MrPixel sadrži formu fiksne veličine koja se sastoji iz sledećih celina: editora kôda, panela za vizualizaciju, dodatnih kontrola. Korisnički interfejs programskog paketa MrPixel prikazan je na slici

16 Preteče softvera PixelByPixel Slika 3.1. Korisnički interfejs programskog paketa MrPixel Alati za rad programskim paketom MrPixel Alati za rad sa programskim paketom MrPixel se mogu podeliti u tri funkcionalne grupe i to, alati za rad sa: programskim kôdom (New file, Open, Save, Help) izvršavanjem kôda (Execute, StepInfo, Reset, Var&Value) grafičkim prikazom piksela (Color, Speed, Real Size, Zoom, Clear Screen, Export Image) Alati za rad sa programskim kôdom Editor za unos programskog kôda služi za unos nekog algoritama rasterske grafike. Programski paket MrPixel podržava programski jezik Pascal, tako da su sintaksa i 15

17 Preteče softvera PixelByPixel semantika programa iste kao u Pascal-u. Prilikom startovanja MrPixel-a pojavljuje se prazan blok za unos kôd-a: Slika 3.2. Početni sadržaj Editor-a programskog paketa MrPixel New File. Dugme koje je vezano za Editor. Briše trenutni sadržaj Editor-a i postavlja kôd koji inicijalizuje program sa praznim blokom naredbi, unutar kojeg treba da dođe programski kôd nekog algoritma rasterske grafike (slika3.2). Open File. Dugme koje je vezano za Editor. Služi za otvaranje dijaloga i učitavanje fajlova u Editor. Učitavanje se vrši sa hard diska računara ili sa eksternog diska ako je priključen. Postoji mogućnost izbora između fajlova sa ekstenzijom.pas ili All File. Save File. Dugme koje je takođe vezano za Editor. Služi za otvaranje dijaloga i čuvanje sadržaja teksta iz Editor-a na određenoj lokaciji, uz mogućnost izbora tipa fajla, odnosno različitih ekstenzija. Help. Sadrži spisak procedura i funkcija koje podržava programski paket MrPixel Alati za izvršavanje kôda Drugi deo grafičkog interfejsa čine komande koje su vezane za izvršavanje programa, odnosno kompajliranje. Tačnije, to su dugmići sledećih mogućnosti: Execute: omogućava kompajliranje i izvršavanje unetog programskog kôda. U slučaju greške, dobija se obaveštenje u MessageBox-u, sa oznakom(brojreda: brojkarakterauredu), uz prateću poruku o grešci. kôd. Step into: omogućava da se program izvršava idući korak po korak kroz programski Reset: dugme koje je vezano za dugme Step Into. Služi za vraćanje na početak, odnosno na prvu liniju, nakon dolaska do poslednje linije kôd-a, krećući se korak po korak. Osim dugmića za izvršavanje navedenih operacija, program sadrži i panel: Var&Value. To je panel koji sadrži dva reda. U prvom redu su polja koja služe za unos imena promenljivih (Variable) čije vrednosti želimo da pratimo. U drugom redu se u toku izvršavanja programa pojavljuju vrednosti (Value) promenljivih unetih u redu Variable. 16

18 Preteče softvera PixelByPixel Alati za vizalizaciju piksela Treći deo grafičkog interfejsa čini panel za vizalizaciju koji sadrži raster. Na panelu se nalazi mreža uvećanih piksela sa fiksnim brojem piksela po širini i dužini. Boja ove mreže je takođe fiksna i uvek je zelena. Na sredini se nalaze koordinatne ose, koje dele mrežu piksela na četiri kvadranta. Operacije koje mogu da se izvrše nad ovim panelom su: Export Image: pruža mogućnost čuvanja slike u.bmp formatu na određenoj lokaciji na računaru, ili na nekom eksternom priključenom uređaju. Clear Screen: omogućava brisanje trenutnog sadržaja panela. Klikom na dugme Clear Screen, panel dobija početni izgled. Zoom: omogućava uvećanje sadržaja slike. Opcija Speed: odnosi se na brzinu uključivanja piksela na panelu za vizualizaciju. Pomeranjem dugmeta na klizaču na desno povećava se brzina izvršenja programa. Panel Real Size: nakon izvršenja programskog kôda, uključuju se pikseli na panelu Real Size i dobija se slika u realnoj veličini. Opcija Color: služi za izbor boje. Nakon izbora boje i pokretanja izvršenja programskog kôda, pikseli koji se uključuju biće obojeni izabranom bojom Koriničke funkcije MrPixel-a U ovom poglavlju dajemo spisak funkcija koje korisnik može koristiiti u svom programskom kôdu. procedure DrawLine (X1, Y1, X2, Y2: Double); - zadatak ove procedure je da nacrta pravu liniju. DrawLine spaja dve prethodne definisane tačke: početak i kraj linije. Početak linije definiše tačka (X1, Y1), a njen kraj tačka (X2, Y2). procedure DrawEllipse (X1, Y1, X2, Y2: Double); - zadatak ove procedure je da nacrta elipsu. Argumenti funkcije definišu pravougaonik opisan oko elipse. On je određen X i Y koordinatom gornjeg levog temena, širinom i visinom. procedure Plot (X,Y: Double); - zadatak ove procedure jeste da osvetli piksel na poziciji (X, Y). Piksel ce biti osvetljen default -nom bojom. procedure PlotEx (X, Y, I: Double); - zadatak ove procedure jeste bojenje piksela na zadatim koordinatama, ali sa zadatom providnošću boje. Providnost uzima vrednost između 0 i 1. 17

19 Preteče softvera PixelByPixel procedure Invert (X, Y: Double); - zadatak ove procedure jeste da ispita da li je piksel na poziciji (X, Y), upaljen. Ako je upaljen funkcija Invert ima zadatak da ga ugasi odnosno da mu promeni boju na boju pozadine. Ako nije upaljen funkcija Invert ima zadatak da upali piksel na zadatoj poziciji. procedure SetColor (Color: string); - postavlja boju iscrtavanja piksela. procedure TurnOff (X, Y: Double); - isključuje upaljeni piksel. Odnosno, ako je piksel upaljen, pozivom ove funkcije piksel će se ugasiti. U slučaju da se funkcija poziva za piksel koji nije upaljen, piksel će ostati ugašen. procedure ReadInt (var X: Integer); - otvara InputBox za unos vrednosti promenljive. Prihvata promenljive tipa Int. Nakon klika na dugme Ok, vrednost se smešta u promenljivu. procedure ReadFloat (var X: Double); - otvara InputBox za unos vrednosti promenljive. Ovde je reč o promenljivama tipa Float. Nakon klika na dugme Ok, vrednost se smešta u promenljivu. procedure Push (X : Integer); - smešta podatak na vrh ugrađenog steka. procedure Pop (var X: Integer); - uzima podatak sa vrha ugrađenog steka. procedure Swap (var X, Y: Double); - zamenjuje vrednosti promenljivama koje su navedene kao argumentu funkcije. function IsOn (X, Y: Double): boolean; - ova funkcija ispituje da li je piksel na poziciji (X, Y) upaljen. Ako jeste, vrednost koju vraća funkcija je true, a ako nije, ta vrednost je false. function Abs (X: Double): Double; - vraća apsolutnu vrednost zadatog argumenta. function Round (X: Double): Integer; - zaokružuje argument na najbliži ceo broj. function Trunc (X: Double): Integer; - vraća ceo deo realnog broja. function Frac (X: Double): Double; - vraća decimalni deo realnog broja. function Sign (X: Double): Integer; - ispituje znak vrednosti argumenta. Funkcija Sign vraća +1, ako je argument pozitivan broj, -1 ako je argument negativan broj, odnosno nulu, ako je vrednost argumenta 0. function StackCount: Integer; - prebrojava elemente koji se nalaze unutar steka. 18

20 3.2 Programski paket MsPixel Preteče softvera PixelByPixel Za razvoj programskog paketa MsPixel korišćeno je integrisano razvojno okruženje kompanije Microsoft, MS Visual Studio, odnosno programski jezik C#.NET. Programski paket MsPixel je razvijen za prikazivanje postupka rada algoritma, odnosno bojenja piksela na glavnoj formi projekta nakon pokretanja programa. Programski paket MsPixel razvio je Luka Lovre, student Prirodno-matematičkog fakulteta u Nišu Korisnički interfejs Korisnički interfejs programskog paketa MsPixel čini forma Windows aplikacije koja se dobija nakon pokretanja Windows Form projekta. Nakon pokretanja dobija se kvadratna matrica uvećanih piksela kao na slici 3.3. Slika 3.3. Korisnički interfejs programskog paketa MsPixel Mesto za rad u programskom paketu MsPixel Pokretanjem VisualStudio projekta ulazimo u glavnu klasu za izradu zadataka: MsPixel.cs. U metodi rad() se nalazi mesto gde se piše cela logika za rešavanje zadatka iz računarske grafike. Iznad metode rad() nalaze se konstante koje korisnik može da menja kako bi manipulisao vizualnim aspektima prikaza, kao sto su veličina fonta, veličina teksta, broj piksela kao i njihova veličina. 19

21 Preteče softvera PixelByPixel Slika 3.4. Mesto za rad u MsPixel-u Alati za izvršavanje kôda Pokretanje programskog paketa MsPixel vrši se klikom na dugme Start, ili korišćenjem kombinacije tastera CTRL + F5. Na primer: nakon unosa naredbi kao na slici 3.5 i nakon pokretanja izvršavanja, dobija se rezultat kao na slici 3.6. Slika 3.5. Programski kôd u MsPixel-u Slika 3.6. Rezultat izvršavanja programskog kôda sa slike

22 Preteče softvera PixelByPixel Koriničke funkcije MsPixel-a Programski paket MsPixel omogućava rad sa sledećim funkcijama: plot (int vrsta, int kolona) boji piksel na poziciji (vrsta, kolona) crvenom bojom. plot (int vrsta, int kolona, Color col) boji piksel na pozicji (vrsta, kolona) određenom bojom. Ovde korisnik sam određuje boju piksela. Zadavanje boje vrši se unošenjem naziva boje u pozivu funkcije. Na primer: plot (5, 5, "red"). DrawLine (double x1, double y1, double x2, double y2) crta liniju od tačke (x1, y1) do tačke (x2, y2), koristeći pri tome double vrednosti. DrawLine (int x1, int y1, int x2, int y2) - crta liniju od tačke (x1, y1) do tačke (x2, y2), koristeći pri tome int vrednosti. invert (int x, int y) vrši promenu boje piksela na poziciji (x, y). Ako je piksel na poziciji (x, y) obojen, nakon poziva funkcije invert (int x, int y), piksel će postati neobojen. U suprotnom, ako je piksel na poziciji (x, y) neobojen, postaće obojen. maxx (List<Point> list) - iz liste unetih tačaka vraća vrednost sa maximalnim X. minx (List<Point> list) - iz liste unetih tačaka vraća vrednost sa minimalnim X. maxy (List<Line> list) - iz liste unetih linija nalazi vrednost sa maximalnim Y. miny (List<Line> list) - iz liste unetih linija vraća vrednost sa minimalnim Y. pixel_at (int x, int y) - vraća vrednost piskela na datim koordinatama. writenumberinpixel<t> (T num, int x, int y) upisuje broj unutar uvećanog piksela na formi, na zadatim koordinatama. T predstavlja podatak koji treba da se ispiše (int, float, string), a x i y predstavljaju koordinate piksela unutar koga se vrši ispisivanje. Line (int x1, int y1, int x2, int y2) - klasa koja predstavlja liniju. Pixel (int x, int y) - definiše uvećani piksel i njegovo iscrtavanje. Point3D (int x, int y, int z) definiše tačku u koordinatnom sistemu xyz. 21

23 3.3 Programski paket MrPixelMM Preteče softvera PixelByPixel Programski paket MrPixelMM čiji je autor Miloš Micaković razvijen je u programskom jeziku C#. Pruža mogućnost pisanja programskog kôda koristeći sintaksu C# programskog jezika. Druga mogućnost koju pruža jeste da se uneti kôd interpretira i vizualizuje na panelu za vizualizaciju Korisnički interfejs Korisnički interfejs programskog paketa MrPixeMM sadrži formu koja sadrži: - editor kôda, - panel za vizualizaciju i - alate za rad datim komponentama. Korisnički interfejs programskog paketa MrPixelMM prikazan je na slici 3.7. Slika 3.7. Korisnički interfejs programskog paketa MrPikselMM 22

24 Preteče softvera PixelByPixel Alati za rad programskim paketom MrPixelMM Alati za rad sa programskim paketom MrPixelMM se mogu podeliti u dve funkcionalne grupe i to: alati za izvršavanje programskog kôda (Start, Naredni Korak), alati za grafički prikaz uvećanih piksela Alati za izvršavanje kôda Programski paket MrPixelMM sadrži dva dugmeta koja omogućavaju izvršavanje unetog programskog kôda i to: Start: omogućava kompajliranje i izvršavanje kôda. U slučaju greške, dobija se obaveštenje u MessageBox-u sa odgovarajućim opisom. Naredni korak: omogućava da se program izvršava idući korak po korak kroz programski kôd Alati za kreiranje panela za vizalizaciju Korisnički interfejs sadrži i panel za vizalizaciju. Panel za vizualazaciju čini mreža uvećanih piksela koja predstavlja raster. Ova mreža može da se kreira prema zahtevima korisnika. Boja mreže piksela je fiksna i uvek je zelena. Na sredini se nalaze koordinatne ose, koje dele mrežu piksela na četiri kvadranta. Akcije korisnika koje mogu da se izvrše nad panelom su: Broj vrsta: broj redova mreže. Broj kolona: broj kolona mreže. Veličina polja: definiše uvećani piksel i predstavlja razmak između svake dve susedne horizontalne i vertikalne linije. Centar: predstavlja poziciju na mreži gde se seku koordinatne ose. Brzina crtanja: definiše vreme u milisekundama koje protekne između iscrtavanja dva piksela. Debljina linije: definiše debljinu linije izraženu u pointima. 23

25 Preteče softvera PixelByPixel Kreiraj matricu: kreira mrežu uvećanih piksela koristeći pri tome gore navedene parametre (broj vrsta, broj kolona, veličina polja, centar, brzina crtanja, debljina linije) Koriničke funkcije MrPixelMM-a Za rad u MrPixelMM-u možemo koristiti sledeće funkcije. Plot (int vrsta, int kolona) boji piksel na poziciji (vrsta, kolona). Plot (int vrsta, int kolona, int alpha, int red, int green, int blue) boji piksel na poziciji (vrsta, kolona) zadatom bojom, koristeći pri tome 4 komponente boje i to: alpha kanal - prozirnost boje, red crvena boja, green zelena boja, blue plava boja. DrawLine (int X1, int Y1, int X2, int Y2) - crta liniju od tačke (x1, y1) do tačke (x2, y2), koristeći pri tome double vrednosti. 24

26 4 Izbor tehnologija i potrebnih alata Izbor tehnologija i potrebnih alata Cilj programskog paketa PixelByPixel jeste unos i vizualizacija algoritama računarske grafike. Za te potrebe neophodan je grafički korisnički interfejs koji omogućava korisniku pisanje algoritma za vizualizaciju. Windows aplikacije razvijene u C#.NET-u pružaju korisnički interfejs i funkcionalnost za potrebe aplikacije. Za razvoj programskog paketa PixelByPixel korišćeno je integrisano razvojno okruženje kompanije Micrtosoft, MS Visual Studio, verzija 2012, i programski jezik C#.NET Za atraktivan dizajn programskog paketa PixelByPixel koristimo MetroFramework. Najvažnije postupke za korišćenje ovog framework-a opisujemo u ovoj glavi. Za kompajler koji prevodi programski kôd koji korisnik ukuca u editoru PixelByPixel - a koristimo PaxScripter. Njegove metode, osobine i događaji opisani su u ovoj glavi. 4.1 Klase C#.NET koje koristi paket PixelByPixel Klasa Graphics Klasa Graphics omogućava crtanje po bilo kojoj sistemskoj kontroli. Objekat ove klase predstavlja površinu po kojoj se crta. Znači, prvi korak je kreiranje ovog objekata, a zatim njegovo korišćenje u skladu sa slikom koja treba da se nacrta. Klasa Graphics omogućuje crtanje različitih oblika kao što su linija, pravougaonik, elipsa, popunjena elipsa, kružni luk, kriva linija na osnovu četiri tačke. Ova klasa koristi grafički koordinatni sistem opisan u poglavlju U ovom koordinatnom sistemu se koordinatni početak (X koordinata jednaka nuli i Y koordinata jednaka nuli) nalazi u gornjem levom uglu, pozitivni deo X ose ide od leve strane ka desnoj, a pozitivni deo Y ose od vrha ka dnu, kao na slici

27 Izbor tehnologija i potrebnih alata Slika 4.1. Koordinatni sistem klase Graphics Klasa Pen Objektom klase Pen definiše se boja, širina i stil pravih i krivih linija koje se crtaju. Njegove osobine su: - Color struktura tipa Color, - Width širina linije tipa float, - DashStyle stil iscrtavanja linija koji može biti Dash, DashDot, DashDotDot, Dot. Klasa za crtanje Pen nalazi se u imenskom prostoru System.Drawing. Kreiranje objekta klase Pen vrši se pozivanjem konstruktora sa parametrom boja ili sa parametrima boja i debljina linije Klasa Brush Klasa Brush koja služi za popunjavanje grafičkih površina. Za crtanje popunjenih oblika (pravougaonik, elipsa) koristi se izvedena klasa SolidBrush koja se nalazi u imenskom prostoru System.Drawin. Njena osobina Color predstavlja strukturu tipa Color. Kreirani objekti klase Brush zauzimaju odgovarajuće resurse sistema, pa je neophodno da se po završetku crtanja oni oslobode. Oslobađanje resursa se vrši korišćenjem metode Dispose () klase Graphics Klasa Color Definicije boja u.net-u realizovane su pomoću strukture System.Drawing.Color. To je tako reći omotač za četiri jednobajtne vrednosti komponenata boje: crvenu, zelenu, plavu i alfa kanal. 26

28 Color color = Color.FromArgb (red, green, blue, alpha); Izbor tehnologija i potrebnih alata Vrednosti red, green, blue i alpha su celi brojevi u opsegu od 0 do255. Za dobro poznate boje, može se iskoristiti statičko svojstvo strukture Color: Color.color = Color.White; 4.2 Višestruke forme u PixelByPixel-u Višestruke forme unutar jedne aplikacije koriste se da povežu više funkcionlanih delova. Kod višestrukih formi uvek postoji glavna forma odakle se poziva nova forma. U ovom radu višestruke forme su korišćene za kreiranje alatki: Help i Learning. Pravljenje višetruke forme vrši se na sledeći način: - U prvom koraku potrebno je postaviti dugme na željenom mestu na formi, - U drugom koraku treba izabrati File, a zatim Add New Item, - U trećem koraku treba izabrati Windows form, zatim uneti ime i potvrditi. Nova forma predstavlja klasu. U klasi na Click_Event hendler vezuje se dugme na formi, gde se kreira objekat te klase i zatim poziva metod Show(). Kada se klikne na dugme otvara se druga forma preko prve, ali ako se klikne na prvu formu, ona će prekriti drugu formu. Ovakva relacija između dve forme se zove nemodalne forme. U slučaju kada preklapanje nije dozvoljeno već korisnik mora zatvoriti drugu formu da bi se vratio na prvu formu, takve forme se zovu modalne forme. Za implementaciju modalne relacije između dve forme koristi se metoda ShowDialog(), bez argumenata. private void btnmodalnaforma_click(object sender, EventArgs e) NovaForma frmnovaforma = new NovaForma(); frmnovaforma.showdialog(); Za implementaciju nemodalne relacije između dve forme koristi se metoda Show(), takođe bez argumenata. private void btnnemodalnaforma_click(object sender, EventArgs e) NovaForma frmnovaforma = new NovaForma(); frmnovaforma.show(); 27

29 Izbor tehnologija i potrebnih alata Otvorena forma može se uvek zatvoriti na standardni način klikom na dugme x u njenom gornjem desnom uglu. Metoda koja zatvara formu je Close () bez argumenata. Poziv this.close () znači bezuslovno zatvaranje forme u kojoj se ovaj kôd nalazi. private void button1_click(object sender, EventArgs e) this.close(); 4.3 Dijalozi u PixelByPixel-u Rad sa Windows aplikacijama može da zahteva manipulisanje različitim datotekama (tekstualne datoteke, slike, itd.) u smislu čitanja i pisanja sadržaja. Manipulacija datotekama obavezno uključuje i standardne dijaloge za izbor i čuvanje sadržaja. Oni se otvaraju izborom opcija Save (snimi) i Open (otvori). U ovom radu dijalozi su korišćeni za učitavanje sadržaja fajlova, čuvanje i štampanje sadržaja Code&Text editora, podešavanje okruženja Code&Text editora, čuvanje sadržaja panela za vizualizaciju u vidu grafičkog fajla i drugo. Bez obzira na vrstu dijaloga, osnovne funkcionalnosti su iste: moguće je izabrati datoteku (prikazane su samo datoteke koje zadovoljavaju određeni kriterijum) uz mogućnost da se ručno unese njeno ime u polje FileName. Dijalozi koji se često sreću u aplikacijama deo su mogućnosti razvojnog okruženja i nude se kao gotovi objekti. Sistem za korišćenje standardnih dijaloga podrazumeva: 1. Postavljanje odgovarajuće kontrole na formu; 2. Postavljanje potrebnih svojstva kontrole (naslov, početni direktorijum, filter za ekstenzije datoteka.); 3. Otvaranje dijaloga; 4. Po zatvaranju dijaloga potrebno je proveriti da li je korisnik izabrao datoteku ili kliknuo na dugme Cancel (odustani); 5. Ako je izabrana datoteka, iz svojstva FileName potrebno je pročitati putanju i ime datoteke i dalje raditi sa njom. 1. Postavljanje odgovarajuće kontrole na formu U paleti sa alatkama, u sekciji Dialogs nalaze se svi standardni Windows dijalozi. Na glavnu formu postupkom Drag & Drop (postavi i pusti) postaviti kontrolu OpenFileDialog. 28

30 Izbor tehnologija i potrebnih alata Kontrola se prikazuje na traci ispod formulara i inicijalno dobija naziv (osobina Name) openfiledialog1. 2. Postavljanje potrebnih svojstava kontrole (naslov, početni direktorijum, filter za ektenziju datoteka ) Kada se pokrene dijalog za otvaranje datoteke, uobičajeno je da se u njemu vide samo datoteke sa određenom ekstenzijom koju naša aplikacija prepoznaje. Obično se za svaki slučaj, dodaje i opcija za prikaz svih datoteka filter *.*, odnosno opcija All files koja služi za prikaz svih datoteka. Filter Open dijaloga se postavlja pomoću istoimenog svojstva Filter. Ovo svojstvo je tipa string i zahteva specifično formatiranje. Na primer, svojstvo: Tekstualne datoteke *.txt Sve datoteke *.* označava da su napravljena dva filtra. Prvi, sa nazivom Tekstualne datoteke, koji prepoznaje sve datoteke sa ekstenzijom txt i drugi, sa nazivom Sve datoteke, koji prikazuje sve datoteke sa bilo kojom ekstenzijom. Svaki filter sastoji se iz dva dela: prvi deo je Naziv filtra i drugi - Kriterijum za prikaz datoteka. Separator je vertikalna crta. Na kraju ne treba staviti vertikalnu crtu. U ovom radu, svojstvo Filter kontrole openfiledialog1 postavljene su na: openfiledialog1.filter = "C# Files (*.cs) Text Files (*.txt) All files (*.*) *.*"; savefiledialog1.filter = "C# Files (*.cs) *.cs"; savefiledialog2.filter = "Bitmap Image (.bmp) *.bmp JPEG Image (.jpeg) *.jpeg Png Image (.png) *.png"; Postavljanje naslova dijaloga definiše se pomoću svojstva Title. Opciono može se postaviti i naziv direktorijuma čiji će sadržaj biti prikazan odmah po otvaranju dijaloga. Za prikaz korena C particije, pri otvaranju dijaloga potrebno je u svojstvu InitialDirectory upisati C:\. Na ovaj način je dijalog pripremljen za otvaranje. 3. Otvaranje dijaloga Dijalog poseduje metodu ShowDialog koja kao rezultat vraća akciju korisnika dijalogu. Postoji više akcija koje korisnik može da dobije, a dve su najbitnije: 1. DialogResult.OK korisnik je izabrao datoteku, 2. DialogResult.Cancel korisnik je zatvorio dialog bez izbora datoteke (kliknuo na Cancel dugme). Proverom ove povratne vrednosti znamo da li je datoteka izabrana i dalje nastavljamo da radimo sa njom. if (openfiledialog1.showdialog() == DialogResult.OK) this.text = openfiledialog1.filename; 29

31 Izbor tehnologija i potrebnih alata Pomoću openfiledialog.showdialog () otvaramo dijalog i odmah proveramo njegovu povratnu vrednost. Ako je ona jednaka DialogResult.OK, znači da je korisnik izabrao datoteku i kliknuo na dugme Open u dijalogu. U tom slučaju u svojstvu FileName se nalazi ime izabrane datoteke sa kompletnom putanjom. U naslov forme (this.text) upisuje se putanja i ime izabrane datoteke. Dakle, svojstvo FileName je ključno jer definiše lokaciju izabrane datoteke. 4. Prikaz sadržaja tekstualne datoteke Otvaranje dijaloga i izbor datoteke, ne otvara niti prikazuje njen sadržaj. Sledeći korak je da se prikaže sadržaj tekstualne datoteke. Za otvaranje, čitanje i pisanje po datotekama zadužen je skup klasa u imenovanom prostoru (Namespace) System.IO, pa je neophodno da se uključi (using System.IO). Za čitanje datoteke koristi se klasa StreamReader kojoj se u konstruktoru zadaje putanja do datoteke. Metodom ReadToEnd objekta StreamReader čita se kompletan sadržaj zadate datoteke. Ova metoda vraća tip string koji će biti prikazan u kontroli RichTextBox, odnosno u Editor-u kôd-a. if(openfiledialog1.showdialog() == DialogResult.OK) this.text = openfiledialog1.filename; System.IO.StreamReader sr = new StreamReader(openFileDialog1.FileName); richtextbox1.text = sr.readtoend(); sr.close(); Potrebno je inicijalizovati objekat sr tipa System.IO.StreamReader i u konstruktoru postaviti ime datoteke koju je korisnik izabrao u dijalogu. Metodom ReadToEnd () čita se kompletan sadržaj datoteke i postavlja se u svojstvo Text kontrole RichTextBox1, odnosno učitava se u Editor kôd-a. Na kraju obavezno treba zatvoriti objekat StreamReader, što se radi metodom Close (). 4.4 MetroFramework Framework, generalno, predstavlja skup klasa i biblioteka, koje sadrže funkcije za obavljanje operacija poput: rad sa stringovima, U/I operacijama, rad sa bazama podataka i sl..net predstavlja skup različitih tehnologija koje su razvijene sa ciljem pomoći prilikom razvoja aplikacija. Framework, takođe pruža i odgovarajući korisnički interfejs i funkcionalnost. Programski paket PixelByPixel nasleđuje MetroFramework koji pruža bogat 30

32 Izbor tehnologija i potrebnih alata korisnički interfejs. Glavna prednost ovog framework-a jeste bolji dizajn i atraktivnije kontrole koje se postavljaju na formu i koje omogućuju bolji izgled Windows aplikacije. U osnovi je sličan Windows aplikacijama, samo se dizajn razlikuje. Uvoz MetroFramework-a vrši se na sledeći način: 1. U SolutionExplorer-u, kliknuti desnim klikom na ime projekta. Nakon toga potrebno je izabrati ManageNuGet. Klikom na ovu opciju otvara se novi prozor. Slika 4.2. Uvoz MetroFramework-a. Prvi korak 31

33 Izbor tehnologija i potrebnih alata 2. U Search polju potrebno je ukucati MetroModernUI. Slika 4.3. Uvoz MetroFramework-a. Drugi korak 3. Nakon pretrage, izabrati Metro ModernUI Metro Framework (Metro Modern UI or MetroFramwork brings Windows 8 UI to.net Windows Forms Application). Slika 4.4. Uvoz MetroFramework-a. Treći korak 4. Kliknuti na dugme Install. 5. Kliknuti na dugme Close. 6. Kada se izvše prethodni koraci instalacije, potrebno je Rebuild-ovati projekat. Nakon instalacije Metro Modern UI Metro Framework paketa, postaje vidljiv u projektu. U odeljku References, NuGet Package Manager automatski dodaju tri stavke: MetroFramework, MetroFramework.Fonts i MetroFramework.Design. 32

34 Izbor tehnologija i potrebnih alata Slika 4.5. Instaliran MetroFramework Koracima 1-6 instaliraliran je MetroFramework. Nakon instalacije, potrebno je izvršiti ubacivanje komponenti MetroFramework-a u ToolBox. U prvom koraku uraditi: desni klik na ToolBox, a zatim izbrati: ChooseItems, kao na slici 4.6. Slika 4.6. Ubacivanje komponenti MetroFramework-a u ToolBox 33

35 Izbor tehnologija i potrebnih alata U drugom koraku potrebno je izabrati dugme Browse, naći folder gde je projekat sačuvan, zatim pronaći i izabrati MetroFramework.dll. Slika 4.7. Odabir komponente MetroFramework-a za ToolBox U trećem koraku potrebno je kliknuti na dugme Ok i sačuvati promene (CTRL+S). Sada su komponente dodate u projekat i mogu se koristiti za stavljanje na formu i za dizajniranje. Sledeći korak u kreiranju Windows Form aplikacije sa MetroFramework-om jeste omogućiti da forma koristi MetroFramework. To se radi tako što se stavi da glavna forma nasleđuje MetroFramework.Forms.Metroform. public partial class Form1 : MetroFramework.Forms.MetroForm rad. Nakon svih promena potrebno je sačuvati promene. Sada je projekat spreman za dalji 4.5 O PaxScripter-u PaxScripter je kompajler za progrmski jezik C# koji je pisan u C#-u. Slika 4.8. PaxScripter kompajler PaxScript.NET je implemtiran kao.net komponenta paxscript-net.dll koja može biti korišćena sa Microsoft Visual Studio.NET-om. Dozvoljava da se ugradi paxscript.net 34

36 Izbor tehnologija i potrebnih alata interpreter u Windows formi. U nastavku su nabrojane metode, osobine i događaji PaxScripter klase koje su korišćene u ovom radu Metode PaxScripter -a PaxScripter.AddBreakpoint PaxScripter.AddCode PaxScripter.AddCode PaxScripter.DiscardError PaxScripter.Eval PaxScripter.RemoveBreakpoint PaxScripter.Reset PaxScripter.Run Dodaje breakpoint Dodaje izvorni kod script modulu. Dodaje novi modul scripter-u. Odbacuje grešku scripter-a Ispituje izraz zadat kao argument Uklanja breakpoint. Resetuje scripter. Pokreće scripter Osobine PaxScripter -a PaxScripter.Breakpoint_List PaxScripter.CurrentLineNumber PaxScripter.Error_List PaxScripter.HasErrors PaxScripter.State Vraća kolekciju breakpoint-a. Vraća trenutni broj linije. Vraća kolekciju Vraća logičku vrednost true ako scripter sadržo grešku Vraća stanje scripter-a Događaji PaxScripter -a Događaj PaxScripter.OnChangeState aktivira se kada se promeni stanje scripter-a. None Init ReadyToCompile Compiling ReadyToRun Running Terminated Paused Error Nema izvršenja skripter ne sadrži modul sadrži module i kôd kompajlira prevodi kôd spreman za izvršenje izvršava program program je prekinut program je pauziran greška je uočena 35

37 5 Programski paket PixelByPixel Programski paket PixelByPixel U ovoj glavi opisan je korisnički interfejs i metode koje čine funkcionalnost paketa PixelByPixel. Opisane su metode za vizualizaciju piksela, metode koje korisnicima olakšavaju rad sa programskim paketom i grafičke komande paketa. 5.1 Korisnički interfejs Korisnički interfejs programskog paketa PixelByPixel sastoji se iz tri dela: palete alata, Code&Text editora i panela za vizualizaciju. Korisnički interfejs programskog paketa PixelByPixel prikazan je na sledećoj slici: Slika 5.1. Korisnički interfejs programskog paketa PixelByPixel 36

38 Programski paket PixelByPixel Panel za vizualizaciju Desni deo korisničkog interfejsa čini tzv. panel za vizualizaciju. Panel za vizualizaciju čini mreža ćelija i služi za praćenje postupka izvršenja algoritama rasterizacije računarske grafike. U programskom paketu PixelByPixel ćelija predstavlja uvećani realni piksel. Najmanja ćelija je dimenzija 2x2 piksela realne veličine, dok je najveća ćelija dimenzija 15x15 piksela. Dimenzije panela za vizualizaciju postavlja korisnik shodno svojim potrebama. Najmanja mreža je dimenzije 5x5 ćelija, a najveća 100x100 ćelija. Boja mreže može se promeniti izborom boje iz padajuće liste. Na panelu za vizualizaciju se nalaze i koordinatne ose, koje panel dele na četiri kvadranta. Pozicije koordinata korisnik može da promeni unošenjem vrednosti za horizontalnu i vertikalnu koordinatu. Takođe moguća su dva položaja koordinata i to preko mreže ćelija i preko sredine površine piksela. Ćelije na mreži mogu menjati boju klikovima miša na njegovoj površini, a mogu biti osvetljeni i programski, izvršavanjem algoritma. Na panelu za vizualizaciju se osim uvećanih piksela mogu prikazivati i drugi oblici, kao na primer, linije. Debljinu linije moguće je podesiti od 1 do 20. Programski paket takođe omogućuje brisanje i čuvanje sadržaja panela za vizualizaciju. Slika 5.2. Panel za vizualizaciju 37

39 Programski paket PixelByPixel Code&Text editor Centralni deo korisničkog interfejsa zauzima Code&Text editor. Služi za unos programskog kôd-a i prikaz sadržaja izvornih datoteka. U Code&Text editoru je moguće zapisati bilo koji tekst, ali je on prvenstveno namenjen pisanju programskih kôdova (algoritama) rasterizacije u C# jeziku, koji se potom mogu izvršiti. Programski paket PixelByPixel omogućuje brisanje, učitavanje spoljnih fajlova, čuvanje, štampanje i slanje na zadatu adresu sadržaja koji se nalazi u Code&Text editoru. Takođe, programski paket omogućuje i izvođenje operacija označavanje sadržaja, kopiranje, isecanje, umetanje delova teksta ili celog teksta. Takođe programski paket omogućuje i prilagođavanje Code&Text editora korisniku u smislu podešavanja boje pozadine, stila i boje fonta. Uz Code&Text editor nalazi se grupa od tri alata i to: Start, Step by step i Reset. Start pokreće kompajliranje sadržaja Code&Text editora. Step by step vrši testiranje i izvršavanje naredbu po naredbu programskog kôda zapisanog u Code&Text editoru, počevši od prvog reda. Reset prekida izvršavanje pokrenutog programa. U donjem delu korisničkog interfejsa nalaze se i dva polja. Prvo polje služi za ispis poruka o greškama, ukoliko se jave prilikom testiranja kôd-a, a drugo - za ispis trenutnog stanja u kome se kompajler nalazi u svakom trenutku. Slika 5.3. Poruke o greškama i stanje kompajlera Paleta alata Levi deo korisničkog interfejsa programskog paketa PixelByPixel čini paleta alata. Paleta alata sadrži grupe alata za rad sa Code&Text editorom i panelom za vizualizaciju, grupisane na panelima: Skipt, Image, Edit, Grid, Editor i Options. 38

40 5.2 Alati programskog paketa PixelByPixel-a Programski paket PixelByPixel Paleta alata Script Prva grupa alata otvara se klikom na paletu Script. Na njoj su grupisani alati koji rade sa sadržajem Code&Text editora. Izgled panela Script prikazan je na slici 5.4. Slika 5.4. Panel Script New Script pokreće novu stranicu sa neophodnim naredbama za početak pisanja algoritma. Nova stranica uvek sadrži using iskaze, Test klasu i (glavnu) Main funkciju. Open Script vrši učitavanje sadržaja fajla u Code&Text editor. File Dialog omogućuje pretragu i izbor željenog fajla. Nakon pretrage i izbora fajla, celokupan sadržaj označenog fajla biće prikazan u Code&Text editoru. Save Script snima sadržaj Code&Text editora u fajl sa zadatim imenom i tipom. Nakon otvaranja File Dialog-a potrebno je odrediti lokaciju na kojoj će ovaj sadržaj biti sačuvan. Fajl se snima u.cs formatu. Print Script štampa sadržaj Code&Text editora. Akciju za pokretanje štampanja pokreće korisnik klikom na dugme PrintScript čime se otvara sistemski dijalog za štampanje dokumenta. Send Script omogućava da se trenutni sadržaj Code&Text editora pošalje -om. Da bi se ova operacija uspešno izvela, potrebno je da se popune polja za slanje -a. To su polja za unos adrese na koju se šalje sadržaj, polje Subject (opciono), kao i i password pošiljaoca, radi autentifikacije korisnika. 39

41 Programski paket PixelByPixel Slika 5.5. Altka SendScript na panelu Script Paleta alata Image Druga grupa alata otvara se klikom na paletu alata Image. Ova paleta omogućuje rad sa panelom za vizualizaciju. Izgled palete Image prikazan je na slici 5.6. Slika 5.6. Paleta Image Save Image čuva sadržaj panela za vizualizaciju u vidu grafičkog fajla, odnosno slike izabranog formata. Preko File Dialog-a, koji se otvara nakon klika na opciju Save Image potrebno je odrediti lokaciju i format fajla u kome će sadržaj panela za vizualizaciju biti sačuvan. Paket nudi mogućnost da se sadržaj sačuva u jednom od tri ponuđena formata:.bmp,.jpg ili.png. Nakon izbora lokacije i formata potrebno je kliknuti na dugme Save. Clear Image briše trenutni sadržaj panela za vizualizaciju. 40

42 Programski paket PixelByPixel Paleta alata Edit Treća grupa alata otvara se klikom na paletu alata Edit. Na njoj su grupisani alati koji služe da olakšaju rad korisniku sa Code&Text editorom, a podržavaju sledeće operacije: Slika 5.7. Paleta Edit Undo poništava poslednju promenu. Redo vraća poslednju promenu. Select All selektuje ceo sadržaj Code&Text editora. Nakon ove operacije moguće je izvesti niz drugih akcija, kao što su npr. Cut, Copy, Paste, koje su objašnjene u nastavku. Cut vrši odsecanje selektovanog teksta, najčešće zbog umetanja u nekom drugom delu teksta ili u drugom dokumentu. Copy omogućava da se selektovani deo teksta iskopira. Nakon toga dati tekst može se nalepiti na jedno ili više mesta. Paste omogućava da se nakon izvršenih operacija Cut ili Copy, izvrši umetanje teksta na željenom mestu Paleta Grid Četvrta grupa alata otvara se klikom na paletu alata Grid. Ova paleta služi za podešavanje osobina panela za vizualizaciju. Izgled palete Grid prikazan je slici

43 Programski paket PixelByPixel Slika 5.8. Paleta Grid Broj vrsta je polje za unos broja vrsta mreže ćelija. Broj kolona je polje za unos broja kolona mreže ćelija. Veličina piksela je polje za unos veličine ćelije (uvećanog piksela). Veličina ćelije predstavlja broj piksela realne veličine između svake dve susedne horizontalne i svake dve susedne vertikalne linije. Boja mreže omogućava izbor jedne od ponuđenih boja iz padajućeg menija za mrežu ćelija. Izabrane su pastelne boje koje ne skreću previse pažnje na sebe, jer je bitno da se uvećani pikseli dobro vide. X coord predstavlja broj ćeija od leve ivice panela za vizualizaciju do pozicije vertikalne koordinatne ose. Y coord predstavlja broj ćelija od gornje ivice panela za vizualizaciju do pozicije horizontalne koordinatne ose. Koordinate služi za izbor pozicije koordinatnih osa. Moguće pozicije koordinatnih osa su: On line - koordinate idu po liniji mreže ćelija. On pixel - koordinate idu po sredini visine ćelija. Dugme Create Grid omogućava da se kreira mreža ćelija prema zadatim parametrima. 42

44 Programski paket PixelByPixel Peleta Editor Peta grupa alata otvara se klikom na paletu Editor. Na njoj su grupisani alati koji omogućuju korisniku da što bolje prilagodi Code&Text editor svojim potrebama. Izgled palete Editor prikazan je slici 5.9. Slika 5.9. Paleta Editor Font omogućava podešavanje osnovnih osobina fonta kojim se ispisuje tekst u Code&Text editoru. Klikom na alatku Font otvara se Font Dialog Box u kome je moguće izabrati font, stil i veličinu slova. Nakon izbora osobina moguće je potvrditi ili poništiti akciju. Background Color služi za podešavanje pozadine Code&Text editora. Klikom na ovu alatku otvara se Color Dialog Box. U dijaloškom prozoru koji se dobije, moguće je izabrati boju za pozadinu Code&Text editora. Nakon izbora boje moguće je potvrditi ili poništiti akciju. Font Color omogućava podešavanje boje fonta koji se pojavljuje u Code&Text editoru. Klikom na alatku Font Color otvara se Color Dialog Box. U prozoru koji se dobije, moguće je izabrati boju fonta. Nakon izbora osobine moguće je potvrditi ili poništiti akciju Paleta Options Šesta grupa alata otvara se klikom na paletu alata Options na kojoj su grupisani alati koji omogućuju korisniku da prilagodi sledeće osobine: 43

45 Programski paket PixelByPixel Slika Paleta Options Debljina linije omogućava izbor debljine linije za prikazivanje na panelu za vizualizaciju. Boja piksela. Klik miša na panelu za vizualizaciju manifestuje se bojenjem piksela. Podrazumevana boja za bojenje piksela klikom miša je crvena. Ako korisnik želi, boju može promeniti izborom boje iz padajućeg menija. Desni klik miša ima obrnuti zadatak. Bez obzira kojom je bojom obojen piksel, desni klik miša će učiniti da piksel postane neobojen. Debug view omogućuje pojavljivanje Var/Value panela. Ovaj panel služi za unos naziva promenljivih i praćenje njihovih vrednosti tokom izvršavanja programa. Naziv promenljivih unosi se u polje Var (Variable). Nakon unosa naziva promenljivih, svakim klikom na dugme Step by step vrši se vrši testiranje i izvršavanje samo jednog reda sadržaja Code&Text editora, počevši od prvog reda. Vrednost promenljive prikazuje se u polju Value. Izbor boje omogućuje da se izabere boja kojom će pikseli biti osvetljeni. Boja se bira se iz Color dijaloga koji se pojavljuje nakon klikna na trenutnu boju piksela. Brzina osvetljavanja. Omogućava korisniku da izabere brzinu kojom će se pikseli osvetljavati prilikom izvršavanja zadatih instrukcija. 44

46 Programski paket PixelByPixel Menu Pixel By Pixel Klikom na dugme Pixel By Pixel otvara se Menu programskog paketa PixelByPixel. Menu izgleda kao na slici 5.11 i nudi korisniku sledeće mogućnosti: Slika Menu Pixel By Pixel Help omogućava korisniku da pronađe objašnjenja za alate koji se nalazi u paketu i za ugrađene funkcije koje korisnik može da koristi. Slika Help programskog paketa PixelByPixel 45

47 Programski paket PixelByPixel Learning pruža korisniku mogućnost da pročita osnove programiranja u jeziku C#. Slika Learning programskog paketa PixelByPixel Language omogućava izbor jezika koji se koristi na formi. Postoji mogućnost izbora između dva jezika: Engleski i Srpski. Slika Izbor jezika Properties daje osnovne informacije o računaru na kom je paket PixelByPixel instaliran. Slika Osnovne osobine 46

48 About prikazuje informaciju o verziji paketa PixelByPixel koji se koristi. Programski paket PixelByPixel Slika Verzija programskog paketa PixelByPixel Exit omogućava izlaz, odnosno napuštanje paketa PixelByPixel Search box Polje Search box služi za unos reči za pretragu unutar Code&Text editora. Da bi se pojavio Search box potrebno je pritisnuti kombinaciju tastera CRTL + F. Tada se pojavljuju polje za unos pojma za pretragu i tri dugmeta: Search, Clear i Close, kao na slici Slika Polje za pretragu programskog paketa PixelByPixel Search. Nakon unosa pojma za pretragu, potrebno je kliknuti na ovo dugme. Ako traženi pojam postoji u Code&Text editoru, svi pojmovi biće označeni žutom bojom. Clear. Nakon pretrage, klikom na ovo dugme briše se sadržaj iz Search box-a, a prethodno označeni pojmovi više neće biti označeni. Close Search. Klikom na ovo dugme zatvara se panel za pretragu. 5.3 Korisničke funkcije PixelByPixel-a Korisničke funkcije programskog paketa PixelByPixel predstavljaju skup funkcija koje omogućuju kreiranje mreže uvećanih piksela, crtanje koordinata, bojenje uvećanih piksela, crtanje linija, krugova, elipsi itd Funkcija creategrid Za iscrtavanje mreže ćelija na panelu za vizualizaciju, koristi se funkcija creategrid (). Ova funkcija ima zadatak da na osnovu broja kolona, broja redova, širine ćelije (izražene u 47

49 Programski paket PixelByPixel pikselima realne veličine), pozicije X (horizontalne), Y (vertikalne) koordinate koordinatnog početka i zadate boje kreira mrežu ćelija (uvećanih piksela), na panelu za vizualizaciju. Kreiranje mreže ćelija vrši se iscrtavanjem horizontalnih i vertikalnih linija. Parametri koje ove funkcija koristi su: - broj kolona (numofcolumns) je broj ćelija u jednom redu rastera vizualizacije, - broj redova (numofrows) je broj ćelija u jednoj koloni rastera vizualizacije, - širina ćelije (cellwidth) je veličina uvećanog piksela (ćelije), odnosno razmak između svake dve susedne horizontalne i svake dve susedne vertikalne linije na rasteru vizualizacije. Veličina ćelije je cellwidth x cellwidth. - horizontalana pozicija centra koordinatnog sistema rastera vizualizacije (CurrentCenterWidth) označava rastojanje centra od leve stranice panela za vizualizaciju, izraženo u pikselima realne veličine (broj ćelija levo od centra x cellwidth), - vertikalna pozicija centra koordinatnog sistema (CurrentCenterHeight) označava rastojanje centra od gornje stranice panela za vizualizaciju, izraženo u pikselima realne veličine (broj ćelija iznad centra x širina ćelije cellwidth). Neki detalji implementacije. Potrebno je definisati oblast (površinu) rastera po kojoj će se crtati. Za to kreiramo objekat g klase Graphics. Selektovanjem vrednosti iz kontrole ComboBox bira se boja mreže. Da bi se mreža obojila potrebno je kreirati objekat klase Pen, što se radi na sledeći način: Iz klase Graphics (C#.NET-a) koristi se metoda DrawLine za crtanje prave linije. (Klasa Graphics sadrži metode za crtanje različtih oblika, između ostalih i metodu DrawLine za crtanje linija.) Linija koja se iscrtava spaja dve prethodne definisane tačke: početaklinije i krajlinije. Tačku početaklinije čine dve vrednosti pocetakx i pocetaky koje definišu polaznu tačku, a tačku krajlinije čine dve vrednosti krajx i krajy koje difinišu krajnju tačku linije. Nakon iscrtavanja linija, pozivom metode Dispose() oslobađaju se svi resursi zauzeti pri kreiranju objekta klase Pen. Metoda Invalidate() šalje signal za osvežavanje panela za vizualizaciju. System.Drawing.Pen mypen = new System.Drawing.Pen(System.Drawing.Color.FromName( "LightSkyBlue")); for (int i = 0; i <= numofrows; i++) g.drawline(mypen, 0, i * cellwidth, numofcolumns * cellwidth, i * cellwidth); for (int i = 0; i <= numofcolumns; i++) g.drawline(mypen, i * cellwidth, 0, i * cellwidth, numofrows * cellwidth); 48

50 Programski paket PixelByPixel Funkcija DrawAxis Zadatak funkcije DrawAxis jeste da nacrta koordinatne ose na panelu za vizualizaciju. Iscrtavanje se vrši crtanjem jedne vertikalne i jedne horizontalne linije sa strelicama na krajevima. Koordinatne ose se crtaju po zadatim linijama mreže ćelija ili po sredini odovarajućih ćelija. Potrebni koraci za realizaciju ove funkcije su: - kreiranje objekta klase Pen, - definisanje boje i širine linije, - definisanje veličine strelice, - definisanje niza tačaka tipa Point, - spajanje definisanih tačaka. Detalji implementacije Za realizaciju ove funkcije potrebno je da se prvo kreira objekat klase Pen i definišu osobine za boju i debljinu linije. Nakon toga se vrši definisanje veličine strelica, koje se nalaze na krajevima koordinatnih osa. Veličina se zadaje u pikselima realne veličine. Sledeći korak je crtanje horizontalne koordinatne ose sa strelicom na kraju. Za to je potrebno definisati pet objekta klase Point. Klasa Point ima konstruktor čiji su argumenti celobrojne koordinate X i Y izražene kao broj piksela. Slika Horizontalana koordinatna osa definisana tačkama Slika prikazuje kako se definiše horizonatalna koordinatna osa pomoću pet tačaka (objekata klase Point). Prvi Point definiše početnu tačku horizontalne koordinate, drugi krajnju tačku, dok preostale tri tačke definišu strelicu, ako na slici Na kraju se metodom DrawLines (Pen pen, Points[]) vrši spajanje definisanih tačaka u zadatom redosledu, kao što je prikazano na slici

51 Programski paket PixelByPixel Slika Redosled iscrtavanja elemenata horizontalne ose Istim postupkom se vrši crtanje vertikalne koordinatne ose. Ona se kreće od gornje ka donjoj ivici panela za vizualizaciju. Pozivanjem funkcije DrawAxis, dobija se koordinatni sistem koji deli panel za vizualizaciju na četiri kvadranta. Poziv ove funkcije se vrši na sledeći način: DrawAxis(g, currentcenterwidth, currentcenterheight); - g- predstavlja objekat klase Graphics pomoću kog se vrši iscrtavanje, - currentcenterwidth predstavlja udaljenost leve ivice panela od vertikalne koordinatne ose. Udaljenost se izražava u ćelijama (uvećanim pikselima). Vrednost se zadaje preko kontrole NumericUpDown. - currentcenterheight predstavlja udaljenost gornje ivice panela i od horizontalne koordinatne ose. Udaljenost se izražava u ćelijama (uvećanim pikselima). koji se na nalaze na panelu. Vrednost se zadaje preko kontrole NumericUpDown. Pen mypen = new Pen(Color.Black); mypen.width = 1; int arrowsize = 2; Point[] points = new Point(0, centeraxisy*cellwidth), new Point(numOfColumns*cellWidth, centeraxisy*cellwidth), new Point(numOfColumns*cellWidth - arrowsize, centeraxisy*cellwidth - arrowsize), new Point(numOfColumns*cellWidth - arrowsize, centeraxisy*cellwidth + arrowsize), new Point(numOfColumns*cellWidth, centeraxisy*cellwidth) ; g.drawlines(mypen, points); Point[] points2 = new Point(centerAxisX*cellWidth, 0), new Point(centerAxisX*cellWidth, numofrows*cellwidth), new Point(centerAxisX*cellWidth - arrowsize, numofrows*cellwidth - arrowsize), new Point(centerAxisX*cellWidth + arrowsize, numofrows*cellwidth - arrowsize), new Point(centerAxisX*cellWidth, numofrows*cellwidth) ; 50

52 Programski paket PixelByPixel g.drawlines(mypen, points2); Slika Koordinatne ose preko linija mreže Funkcija DrawHalfAxis Zadatak funkcije DrawHalfAxis jeste da nacrta koordinatne ose na panelu za vizualizaciju koje prolaze po sredini uvećanih piksela. Kao i kod funkcije DrawAxis() iscrtavanje se vrši crtanjem vertikalne i horizontalne ose sa strelicama na krajevima. Jedina razlika je u poziciji definisanja Point-a, koja se razlikuje, u odnosu na situaciju kada se crtaju po liniji, za polovinu dužine stranice uvećanog piksela. Slika Koordinatne ose preko sredine piksela 51

53 5.3.4 Funkcija Plot. Bojenje piksela podrazumevanom bojom Programski paket PixelByPixel Za bojenje uvećanog piksela na panelu za vizualizaciju koristi se funkcija Plot. Funkcija Plot (int vrsta, int kolona) ima zadatak da oboji piksel koji se nalazi na poziciji (vrsta, kolona). Bojenje se vrši crvenom, kao podrazumevanom bojom, s mogućnošću promene boje. Detalji implementacije Potrebni koraci za realizaciju ove funkcije su: - definisanje oblika (oblasti iscrtavanja), - definisanje boje za popunu oblika, - definisanje oblika koji je potrebno popuniti, - definisanje brzine bojenja, - provera unetih vrednosti. Da bi uvećani piksel na određenoj poziciji bio obojen potrebno je prvo definisati oblast iscrtavanja. Zbog toga se najpre kreira objekat klase Graphics. U narednom koraku potrebno je definisati boju kojom ce biti popunjen zadati oblik. Da bi neki oblik bio ispunjen bojom potrebno je kreirati objekat tipa SolidBrush i podesiti mu osobinu Color na željenu boju. Nakon toga, da bi definisani oblik bio ispunjen nekom bojom, koristi se funkcija za popunu tipa FillOblik. Sledeći korak jeste definisanje oblika. Uvećani piksel na panelu za vizualizaciju ima oblik kvadrata. Kvadrat se crta pozivom metode DrawRectangle čiji je oblik: DrawRectangle (Pen pen, int x, int y, int width, int height); tj. argumetni su redom: objekat klase Pen, x koordinata gornjeg levog temena, y koordinata gornjeg levog temena, širina i visina pravougaonika. S obzirom da piksel ima osobinu da ima jednake stranice potrebno je definisati kvadrat čiji argumetni širina i visina uzimaju jednake vrednosti. int waittime1 = (10-Convert.ToInt16(speedBar.Value)) * numberoftasks++; Task t = Task.Run(() => int pom = currentnumberofimage; Thread.Sleep(waitTime1); if (currentnumberofimage == pom) Graphics g = Graphics.FromImage(pikselImage); System.Drawing.SolidBrush mybrush = new System.Drawing.SolidBrush( choosecolor.backcolor); g.fillrectangle(mybrush, new Rectangle((vrsta * cellwidth)

54 Programski paket PixelByPixel + currentcenterwidth * cellwidth, (kolona * cellwidth) currentcenterheight * cellwidth, cellwidth - 1, cellwidth - 1)); image.invalidate(); ); t.wait(); Bitno je napomenuti da se funkcija Plot izvršava u deliću sekunde, dok je cilj da korisnik vidi kojim redosledom se pikseli boje ( osvetljavaju ). Zbog toga je u funkciji implementirano vreme čekanja (waittime), pre nego što se ćelija stvarno fizički oboji. Da bi se to postiglo postoji brojač koji broji koliko je puta funkcija Plot pozvana. Vrednost brojača pomnožena sa vrednošću brzine kojom korisnik želi da se program izvršava, a koja se zadaje preko komponente ComboBox-a, daje vreme čekanja. Na kraju je potrebno pozvati funkciju Invalidate() za osvežavanje panela. Poziv funkcije Plot vrši se na sledeći način: Na primer: Piksel.Plot (vrsta, kolona); Piksel.Plot(5,5); Ovom naredbom biće obojen uvećani piksel koji se nalazi na preseku 5 vrste i 5 kolone, crvenom bojom. Ako vrednosti za vrstu i kolonu prebace dozvoljeni opseg, MessageBox-om se korisnik obaveštava o grešci Funkcija Plot. Bojenje piksela zadatom bojom Zadatak funkcije Plot (int vrsta, int kolona, double alpha, double red, int green, int blue) jeste da oboji piksel koji se nalazi na poziciji (vrsta, kolona), zadatom bojom. Boje se generalno gledajući, predstavljaju sa tri koordinate koje čine crvenu, zelenu i plavu komponentu. Ovom sistemu se priključuje i providnost kao četvrta koordinata i ona pokazuje kako će izgledati boja kada prođe kroz objekat. Ako se koordinate boje predstavljaju realnim brojevima, onda se vrednosti komponenti nalaze u opsegu [0, 1], a ako se koordinate predstavljaju celobrojnim vrednostima, onda se vrednosti komponenti nalaze u opsegu [0, 255]. Ako je vrednost komponente 0.0, odnosno 0, to znači da nije prisutna odgovarajuća boja, a ako je vrednost komponente 1.0, odnosno 255 to znači da je prisutan pun intenzitet boje. Funkcija Plot koristi celobrojne vrednosti za prikazivanje boje. 53

55 Programski paket PixelByPixel Detalji implementacije Neophodni koraci u realizaciji ove funkcije su: - definisanje oblika (oblasti iscrtavanja), - definisanje boje za popunu oblika, - definisanje oblika koji je potrebno popuniti, - definisanje brzine bojenja, - provera unetih vrednosti. Implementacija ove funkcije je potpuno ista kao u slučaju funkcije Plot koja boji uvećani piksel podrazumevanom bojom, osim što su parametri boje ovde zadati parametrima. SolidBrush opaquebrush =new SolidBrush(Color.FromArgb(Convert.ToInt32(alpha), Convert.ToInt32(red), Convert.ToInt32(green), Convert.ToInt32(blue))); Graphics g = Graphics.FromImage(pikselImage); g.fillrectangle(opaquebrush, new Rectangle((vrsta * cellwidth) currentcenterwidth * cellwidth, (kolona * cellwidth) currentcenterheight * cellwidth, cellwidth - 1, cellwidth - 1)); image.invalidate(); Poziv ove funkcije vrši se na sledeći način: Na primer: Piksel.Plot (vrsta, kolona, alpha, red, green, blue); Piksel.Plot(5, 5, 255, 0, 0, 0); Ovom naredbom biće obojen piksel koji se nalazi na preseku 5 vrste i 5 kolone, neprozirnom crnom bojom Funkcija PlotColor Zadatak funkcije PlotColor (int vrsta, int kolona, string boja) jeste da oboji piksel koji se nalazi na poziciji (vrsta, kolona), zadatom bojom. Razlika u odnosu na funkciju Plot (vrsta, kolona) koja boji piksel uvek podrazumevanom bojom, jeste u tome, što se ovde vrednost za boju zadaje njenim imenom. 54

56 Programski paket PixelByPixel Detalji implementacije Definicija boja u.net-u realizovane su pomoću strukture System.Drawing.Color. Za dobro poznate boje, može se iskoristiti jedno od mnogih statičkih svojstava strukture Color: System.Drawing.Color.FromName (boja); Metod FromName kreira System.Drawing.Color strukturu boje od naznačenog imena prethodno definisane boje. Unutar funkcije PlotColor koristi se logička funkcija isacolor(), koja proverava da li je boja unapred definisana. Ova funkcija vratiće vrednost true ako boja pripada skupu imenovanih boja, u suprotnom vratiće vrednost false. Ukoliko se desi da korisnik ukuca nepoznatu vrednost za boju, poruka o nepostojećoj boji biće ispisana u MessageBox-u. int waittime = (10-Convert.ToInt16(speedBar.Value)) * numberoftasks++; Task t = Task.Run(() => int pom = currentnumberofimage; Thread.Sleep(waitTime); if (currentnumberofimage == pom) if (IsAColor(boja)) System.Drawing.SolidBrush mybrush = new ); t.wait(); System.Drawing.SolidBrush(System.Drawing.Color.FromName(boja)); Graphics g = Graphics.FromImage(pikselImage); g.fillrectangle(mybrush, new Rectangle((vrsta * cellwidth) currentcenterwidth * cellwidth, (kolona * cellwidth) currentcenterheight * cellwidth, cellwidth - 1, cellwidth - 1)); image.invalidate(); else MessageBox.Show("Nepravilan unos boje!"); Funkcija PlotEx Funkcija PlotEx (int vrsta, int kolona, int i) predstavlja varijantu funkcije Plot. Funkcija PlotEx sadrži još jedan argument, koji omogućuje da piksel bude osvetljen određenim alfa 55

57 Programski paket PixelByPixel kanalom. Alfa kanal predstavlja prozirnost, odnosno nivo osvetljenosti boje. Najmanja vrednost alfa kanala predstavlja potpunu prozirnost piksel ima boju pozadine, tj. nije obojen, a najveća vrednost alfa kanala predstavlja potpuno neprozirnu boju, odnosno, piksel ima pun intenzitet boje. Slika Pikseli obojeni različitim nivoom prozirnošću U ovom primeru piksel koji se nalazi na preseku druge vrste i druge kolone obojen je sa apsolutnom prozirnošću, pa se zbog toga njegova boja ne primećuje. Piksel koji se nalazi na preseku treće vrste i treće kolone osvetljen je vrednošći alfa kanala 125. Ta vrednost predstavlja skoro polovinu maksimalnog intenziteta boje. Piksel koji se nalazi na preseku četvrte vrste i četvrte kolone, predstavlja piksel koji je osvetljen bojom koja nije prozirna, odnosno, koja ima pun intenzitet Funkcija ison Funkcija ison (int vrsta, int kolona) služi za proveru da li je uvećani piksel na poziciji (vrsta, kolona) obojen. Ovo je logička funkcija koja vraća vrednost true, ako je piksel obojen, a ako piksel nije obojen vratiće vrednost false. Poziv funkcije ison vrši se na sledeći način: Na primer: Piksel.isOn (vrsta, kolona); Piksel.isOn (5, 5); 56

58 Programski paket PixelByPixel Ovom naredbom biće biće ispitano da li je obojen piksel koji se nalazi na preseku 5 vrste i 5 kolone. Korisnik povratnu vrednost ove funkcije neće dobiti u vidu grafičkog prikaza ili obaveštenja, već će funkciju samo izvršiti u pozadini i njenu povratnu vrednost moći će da koristi u svom programu Funkcija Invert Funkcija Invert (int vrsta, int kolona) služi za invertovanje boje uvećanih piksela. Pod pojmom invertovanja podrazumeva se promena boje piksela sa boje pozadine na boju iscrtavanja i obrnuto. Ako je piksel obojen, primenom funkcije invert() postaje neobojen i obrnuto. Detalji implementacije Point pointp = new Point((vrsta * cellwidth) currentcenterwidth * cellwidth, (kolona * cellwidth) currentcenterheight * cellwidth); Bitmap bmp = new Bitmap(image.Width, image.height); image.drawtobitmap(bmp, new Rectangle(0, 0, image.width, image.height)); Color col = bmp.getpixel(pointp.x, pointp.y); bmp.dispose(); if (col.toargb().equals(color.white.toargb())) int waittime = (10-Convert.ToInt16(speedBar.Value)) * numberoftasks++; Task t = Task.Run(() => int pom = currentnumberofimage; Thread.Sleep(waitTime); if (currentnumberofimage == pom) System.Drawing.SolidBrush mybrush = new System.Drawing.SolidBrush(chooseColor.BackColor); Graphics g = Graphics.FromImage(pikselImage); g.fillrectangle(mybrush, new Rectangle((vrsta * cellwidth) currentcenterwidth * cellwidth, (kolona * cellwidth) currentcenterheight * cellwidth, cellwidth - 1, cellwidth - 1)); image.invalidate(); ); t.wait(); Poziv funkcije Invert vrši se na sledeći način: Na primer: Piksel.Invert (vrsta, kolona); Piksel.Invert (5, 5); 57

59 Programski paket PixelByPixel Ovom naredbom biće biće ispitano da li je obojen piksel koji se nalazi na preseku 5 vrste i 5 kolone. Ako jeste, njegovo stanje biće vraćeno na početno stanje, odnosno vratiće se na boju pozadine, a ako piksel nije obojen, obojiće se Funkcija DrawLine Funkcija DrawLine (int pocetnatackax, int pocetnatackay, int krajnjatackax, int krajnjatackay) vrši crtanje linije tako što spaja dve prethodno definisane tačke: (pocetnatackax, pocetnatackay) i (krajnjatackax i krajnjatackay). Detalji implementacije Neophodni koraci u realizaciji ove funkcije su: - kreiranje objekta klase Graphics, - kreiranje objekta klase Pen, - definisanje krajnjih tačaka, koje će biti povezane metodom DrawLines, - poziv metode invalidate() koja služi za osvežavanje panela za vizualizaciju. Najpre je kreiran objekat klase Graphics. Zatim je kreiran objekat klase Pen koja definiše kako će izgledati linija kojom se crta, tj. oblik i debljina linije. Nakon toga je definisan niz koji čine dve tačke. Linija koja se iscrtava spaja dve prethodne definisane tačke: početaklinije i krajlinije. Tačku početaklinije čine dve vrednosti pocetakx i pocetaky koje definišu polaznu tačku, a tačku krajlinije čine dve vrednosti krajx i krajy koje difinišu krajnju tačku linije. Nakon iscrtavanja linija, pozivom metode Dispose() oslobađaju svi resursi zauzeti pri kreiranju objekta klase Pen. Pen mypen = new Pen(chooseColor.BackColor); int debljinalinije = Convert.ToInt16(numLineWidth.Value); mypen.width = debljinalinije; Graphics g = Graphics.FromImage(pikselImage); g.smoothingmode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias; g.smoothingmode = System.Drawing.Drawing2D.SmoothingMode.HighQuality; Point[] points = new Point(pocetnaTackaX*cellWidth +cellwidth/2 + currentcenterwidth * cellwidth, pocetnatackay*cellwidth +cellwidth/2 + currentcenterheight * cellwidth), new Point(krajnjaTackaX*cellWidth +cellwidth/2 + currentcenterwidth * cellwidth, krajnjatackay*cellwidth +cellwidth/2 + currentcenterheight * cellwidth) 58

60 Programski paket PixelByPixel ; g.drawlines(mypen, points); g.dispose(); image.invalidate(); Funkcija DrawEllipse Funkcija DrawEllipse (int xcoor, int ycoor, int width, int height), ima zadatak da nacrta elipsu sa zadatom širinom i visinom u odnosu na poziciju (xcoor, ycoor) koja predstavlja gornje levo teme zamisljenog pravougaonika unutar koga se upisuje elipsa. Ako su širina i visina zamišljenog pravougaonika jednake, dobija se kružnica. Detalji implementacije Neophodni koraci u realizaciji ove funkcije su: - kreiranje objekta klase Graphics, - kreiranje objekta klase Pen, - definisanje boje i debljine linije, - poziv metode invalidate() koja služi za osvežavanje panela za vizualizaciju. Elipsa se crta primenom metode DrawEllipse, u sledećem obliku: g.drawellipse (Pen pen, int x, int y, int width, int height) gde su argumetni redom: objekat klase Pen, i pravougaonik opisan oko elipse koje je određen X i Y koordinatom gornjeg levog temena, širinom i visinom. Pen mypen = new Pen(chooseColor.BackColor); int debljinalinije = Convert.ToInt16(numLineWidth.Value); mypen.width = debljinalinije; Graphics g = Graphics.FromImage(pikselImage); g.smoothingmode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias; g.smoothingmode = System.Drawing.Drawing2D.SmoothingMode.HighQuality; xcoor = xcoor * cellwidth + cellwidth / 2 + currentcenterwidth * cellwidth; ycoor = ycoor * cellwidth + cellwidth / 2 + currentcenterheight * cellwidth; width = width * cellwidth + cellwidth / 2; height = height * cellwidth + cellwidth / 2; g.drawellipse(mypen, xcoor, ycoor, width, height); image.invalidate(); 59

61 Programski paket PixelByPixel Bojenje piksela klikovima miša Za bojenje piksela klikovima miša korišćen je događaj MouseClik koji je vezan za panel za vizualizaciju. Ovde se razlikuju dva slučaja. Prvi slučaj predstavlja levi, a drugi desni klik miša. Levi klik miša ima zadatak da oboji piksel zadatom bojom. Boja piksela se bira iz kontrole ComboBox na paleti Options, izborom jedne od ponuđenih boja. U slučaju da boja nije izabrana, pikseli će biti bojeni podrazumevanom, crvenom bojom. Desni klik miša ima suprotni zadatak, da obojeni piksel oboji bojom pozadine. Detalji implementacije U prvom koraku je definisana površina po kojoj će se iscrtavati pikseli. Zbog toga je najpre kreiran objekat klase Graphics. U narednom koraku definisana je boja kojom će biti popunjen zadati oblik. Da bi neki oblik bio ispunjen bojom potrebno je kreirati objekat tipa SolidBrush i podesiti mu osobinu Color na željenu boju. Nakon toga da bi definisani oblik bio ispunjen nekom bojom koristi se funkcija za popunu tipa FillOblik. Sledeći korak jeste definisanje lokacije i površine koje piksel zauzima. Piksel ima oblik kvadrata. Kvadrat se crta pozivom metode DrawRectangle na izračunatoj poziciji. System.Drawing.SolidBrush mybrush = new System.Drawing.SolidBrush(System.Drawing.Color.White); Graphics g = Graphics.FromImage(pikselImage); int mod = e.x % cellwidth; int mod1 = e.y % cellwidth; g.fillrectangle(mybrush, new Rectangle(new Point(/*e.X, e.y*/e.x - mod + 1, e.y - mod1 + 1), new Size(cellWidth - 1, cellwidth - 1))); image.invalidate(); Primer koji ilustruje primenu ove operacije nalazi se u šestoj glavi. 60

62 6 Primeri vizualizacije nekih rasterskih algoritama Primeri vezualizacije U ovoj glavi kroz primere su prikazane funkcije programskog paketa PixelByPixel, način pozivanja i njihovo manifesotvanje na panelu za vizualizaciju. 6.1 Primeri vizualizacije piksela Primer 1: Prikaz funkcije Plot (vrsta, kolona); Slika 6.1. Funkcija Plot (v,k) Primer 2: Prikaz funkcije Plot (vrsta, kolona); Slika 6.2. Crtanje duži 61

63 Primeri vezualizacije Primer 3: Prikaz funkcije Plot (vrsta, kolona, alpha, red, green, blue); Slika 6.3. Funkcija Plot (v,k,a,r,g,b) Primer 4: Prikaz funkcije PlotColor (vrsta, kolona, boja); Slika 6.4. Funkcija PlotColor Primer 5: Prikaz funkcije PlotEx (vrsta, kolona, prozirnost); Slika 6.5. Funkcija PlotEx 62

64 Primeri vezualizacije Primer 6: Prikaz funkcije DrawLine (pocetnatackax, pocetnatackay, krajnjatackax, krajnjatackay); Slika 6.6. Funkcija DrawLine Primer 7: Prikaz funkcije DrawEllipse (xkoordinata, ykoordinata, sirina, visina) Slika 6.7. Funkcija DrawEllipse Primer 8: Prikaz funkcije Invert (vrsta, kolona); Slika 6.8. Finkcija Invert 63

65 Primer 9: Pikaz osvetljavanja piksela klikovima miša po panelu za vizualizaciju: Primeri vezualizacije Slika 6.9. Bojenje piksela klikovima miša 6.2 Primeri vizualizacije nekih rasterskih algoritama Postupkom rasterzacije određujemo koje piksele na rasteru treba obojiti tako da najpribližnije predstavljaju željenu liniju ili oblik. U ovom poglavlju ilustrujemo vizualizaciju rasterizacije prave i kružne linije pomoću Bresenham-ovog algoritma u programskom paketu PixelByPixel Bresenham-ov algoritam za crtanje duži Bresenham-ov algoritam za rasterizaciju duži koristi isključivo celobrojnu aritmetiku. Izračunava sledeći piksel (xi+1, yi+1) na osnovu prethodno izračunatog piksela (xi,yi). Ta tehnika daje najbolju aproksimaciju idealnih pravih linija u smislu minimizacije pojave greške (odnosno udaljenosti odabranih tačaka od idealnih linija) Bresenham-ov algoritam za prvi oktant Kada pratimo duž u prvom oktantu, x koordinata brže raste od y, pa će se x koordinata piksela povećavati za 1 u svakom koraku. Tada se y koordinata piksela ili povećava za 1 ili ostaje ista. Ideja Bresenham-ovog algoritma zasniva se na odlučivanju da li, u slučaju kada inkrementiramo vrednost koordinate x, treba inkrementirati vrednost koordinate y ili ne. 64

66 Primeri vezualizacije U algoritmu se javlja greška e. Greška e je razdaljina između tačne vrednosti y koja se nalazi na duži (realni broj) i zaokružene vrednosti y izabranog piksela (integer) za trenutnu vrednost x. U svakoj iteraciji kada se x poveća, greška će biti uvećana za vrednost nagiba, tj. za dy/dx. Na početku je vrednost Ako pređe preko vrednosti 0, y će se povećati za 1. To znači da se bira piksel gore desno i greška se smanjuje za 1. U suprotnom, y se ne menja. Primer: Nagib linije u prvom oktantu je između 0 i 1. Donju levu tačku obeležićemo sa (X0,Y0), a gornju desnu tačku sa (X1, Y1). Na slici 6.10 prethodno selektovan piksel pojavljuje se kao ispunjen kružić, a dva piksela, od kojih će jedan biti selektovan u sledećem koraku predstavljena su kao prazni kružići. U ovom primeru piksele adresiramo donjim levim temenom. Slika Bresenham-ov algoritam za crtanje duži Tačka M na slici predstavlja polovinu rastojanja između dva piksela D i GD, a tačka Q je presek originalne linije i linije x=xp + 1. U Bresenham-ovoj formulaciji računamo razliku rastojanja gornjeg desnog piksela GD i desnog piksela D od tačke Q i na osnovu znaka dobijene vrednosti određujemo koji je piksel bolja aproksimacija linije. Implementacija: using System; using System.Collections; using System.Collections.Generic; using PixelByPixel; class Test public static void Main() 65

67 Primeri vezualizacije int i, x1,x2,y1,y2,x,y,duzina; double e,dy,dx; x1 = 0; y1 = 0; x2 = 20; y2 = 10; Piksel.DrawLine(x1,y1,x2,y2); dx = (x2-x1); dy = (y2-y1); x = x1; y = y1; e = dy / dx - 0.5; for (i=1; i<=dx; i++) Piksel.Plot(x,y); if (e>0) y = y + 1; e = e - 1; x = x + 1; e = e + dy/dx; Rezultat: Slika Crtanje duži Bresenham-ovim algoritmom U sledećem koraku, vršimo transformaciju vrednosti greške e u vrednost e, da bi eliminisali deljenje. Transformacija e = dy/dx - 1/2 => 2*dx*e = 2*dy dx, upućuje da bi vrednost e trebalo da bude: e = 2*dx*e. 66

68 Primeri vezualizacije Početna vrednost za e će biti e = 2*dy dx, naredba e = e 1 se menja u e = e 2*dx, a naredba e = e + dy/dx, u e = e + 2*dy. Implementacija algoritma koji ne sadrži deljenje: using System; using System.Collections; using System.Collections.Generic; using PixelByPixel; class Tacka public int x; public int y; public Tacka(int width, int heigth) x = width; y = heigth; namespace Bresenham public class Bresenham public static int x1, x2, y1, y2, x, y, duzina, i, e, dy, dx; void run() x1 = 0; y1 = 0; x2 = 20; y2 = 12; Piksel.DrawLine(x1, y1, x2, y2); dx = (x2 - x1); dy = (y2 - y1); x = x1; y = y1; e = 2 * dy - dx; for (i = 1; i <= dx; i += 1) Piksel.Plot(x, y); if (e > 0) y = y + 1; e = e - 2 * dx; x = x + 1; e = e + 2 * dy; 67

69 Primeri vezualizacije public static void Main(string[] args) Bresenham myapp = new Bresenham(); myapp.run(); Rezultat: Slika Crtanje duži Bresenham-ovim algoritmom bez deljenja Bresenham-ov algoritam za sve oktante Kod ovog algoritma se mora voditi računa u kom oktrantu se radi. Razlikuju se dva slučaja: - vrednost x se sigurno menja, a za y je potrebno dodatno ispitivanje; - vrednost y se sigurno menja, a za x je potrebno dodatno ispitivanje. Slika Vrednosti x i y u različitim oktanatima 68

70 Primeri vezualizacije Vrednosti za x i y mogu se, takođe, povećavati ili smanjivati. Zbog toga se uvode nove promenljive. Promenljiva dok označava veću od vrednosti x2-x1 i y2-y1 i služi za izlazak iz for petlje. Promenljiva znakx vodi računa o tome da li se x povećava ili smanjuje. Promenljiva znaky vodi računa o tome da li se y povećava ili smanjuje. Implementacija: using System; using System.Collections; using System.Collections.Generic; using PixelByPixel; class Test public static void Main() int x1, x2, y1, y2, x, y, i, znakx, znaky ; Double e, dy, dx, dok; x1 = -10; y1 = -10; x2 = 15; y2 = 7; Piksel.DrawLine(x1,y1,x2,y2); dx = Math.Abs(x2-x1); dy = Math.Abs(y2-y1); x = x1; y = y1; znakx = Math.Sign(x2-x1); znaky = Math.Sign(y2-y1); if(math.abs(dx)>math.abs(dy)) e = 2*dy-dx ; else e = 2*dx-dy ; dok = Math.Abs(dx); if (Math.Abs(dy)>Math.Abs(dok)) dok = dy; for (i=1; i<= dok; i++) Piksel.Plot(x,y); if(math.abs(dx) > Math.Abs(dy)) if (e>0) y = y+znaky; e = e-2*dx; 69

71 Primeri vezualizacije Rezultat: x = x+znakx; e = e + 2*dy; else if (e>0) x = x+znakx; e = e-2*dy; y=y+znaky; e = e + 2*dx; Slika Bresenham algoritam za sve oktante Bresenham-ov algoritam za crtanje kruga Za iscrtavanje kruga Bresenham-ovim algoritmom prvo je potrebno izračunati vrednosti na ivici kruga u prvom oktantu. Ostale vrednosti se mogu dobiti simetrijom. Crta se kruga radijusa R sa centrom u (0,0). 70

72 Primeri vezualizacije Slika Korišćenje simetrije pri crtanju kruga Krug se može podeliti na osam osmina. Treba izabrati osminu u kojoj izračunavamo i crtamo vrednosti piksela, a ostalih sedam osmina iscrtavamo po simetriji. Biramo osminu kruga u kojoj se nalazi piksel (x,y) kao na slici Iscrtavanje vršimo u smeru kazaljke na satu. Ovde ćemo koristiti matematički koordinatni sistem (y osa je okrenuta na gore). Neka je (xi,yi) trenutni piksel. Sada, u odnosu na njega, naredni piksel može biti: - horizontalno od trenutnog, piksel H sa koordinatama (xi+1, yi), - vertikalno od trenutnog, piksel V sa koordinatama (xi, yi-1), - dijagonalno od trenutnog, piksel D sa koordinatama (xi+1, yi-1). Rastojanje horizontalnog, vertikalnog i dijagonalnog piksela od kruga računa se na sledeći način: mh = (xi + 1) 2 + yi 2 R 2 md = (xi + 1) 2 + (yi - 1) 2 R 2 mv = xi 2 + (yi - 1) 2 R 2 Neka je: Di = (xi + 1) 2 + (yi - 1) 2 R 2. Ako je Di = 0, piksel D je na krugu. Ako je Di < 0, onda je D unutar kruga. Ako je Di > 0, onda je D van kruga. U nastavku se razmatraju slučajevi za utvrđivanje koji je naredni piksel u odnosu na trenutni piksel od ponuđene tri mogućnosti. 1 0 ) Slučaj Di = 0 U ovom slučaju za naredni piksel bira se D. 71

73 Primeri vezualizacije 2 0 ) Slučaj Di > 0 Posmatramo δ = md - mv = 2Di - 2xi 1 Ako δ < 0 -> md < mv, onda biramo D jer je bliže Ako δ 0 -> md > mv, onda biramo V jer je bliže 3 0 ) Slučaj Di < 0 Posmatramo δ = mh - md = 2Di + 2yi 1 Ako δ 0 -> mh < md, onda biramo H Ako δ > 0 -> mh > md, onda biramo D Ako se bira D, onda: Di+1 = ((xi + 1) + 1) 2 + ((yi - 1)-1) 2 - R 2 = (xi + 1) 2 + 2(xi + 1) (yi - 1) 2 2(yi - 1) R 2 = Di + 2(xi+1 - yi+1 + 1) Ako se bira H, onda: Di+1 = ((xi + 1) + 1) 2 + (yi -1) 2 - R 2 = (xi + 1) 2 + 2(xi + 1) (yi - 1) 2 - R 2 = Di + 2xi Ako se bira V, onda: Di+1 = (xi + 1) 2 + ((yi - 1)-1) 2 - R 2 = (xi + 1) 2 + (yi - 1) 2 2(yi - 1) R 2 = Di - 2yi Implementacija: using System; using System.Collections; using System.Collections.Generic; using PixelByPixel; namespace pixel public class pixel public static int R, x, y, D, b; void run() R = 10; x = 0; 72

74 Primeri vezualizacije y = R; D = (x + 1) * (x + 1) + (y - 1) * (y - 1) - R * R; while (x <= y) Piksel.Plot(x, y); Piksel.Plot(-x,-y); Piksel.Plot(x,-y); Piksel.Plot(-x,y); Piksel.Plot(y,x); Piksel.Plot(-y,-x); Piksel.Plot(y,-x); Piksel.Plot(-y,x); if (D == 0) x = x + 1; y = y - 1; D = D + 2 * (x - y + 1); else if (D < 0) if (2 * D + 2 * y - 1 <= 0) x = x + 1; D = D + 2 * x + 1; else x = x + 1; y = y - 1; D = D + 2 * (x - y + 1); else if (2 * D - 2 * x - 1 < 0) x = x + 1; y = y - 1; D = D + 2 * (x - y + 1); else y = y - 1; D = D - 2 * y + 1; public static void Main(string[] args) pixel myapp = new pixel(); myapp.run(); 73

75 Primeri vezualizacije Rezultat: Slika Iscrtavanje kruga Bresenham-ovim algoritmom 74

Biznis scenario: sekcije pk * id_sekcije * naziv. projekti pk * id_projekta * naziv ꓳ profesor fk * id_sekcije

Biznis scenario: sekcije pk * id_sekcije * naziv. projekti pk * id_projekta * naziv ꓳ profesor fk * id_sekcije Biznis scenario: U školi postoje četiri sekcije sportska, dramska, likovna i novinarska. Svaka sekcija ima nekoliko aktuelnih projekata. Likovna ima četiri projekta. Za projekte Pikaso, Rubens i Rembrant

More information

Podešavanje za eduroam ios

Podešavanje za eduroam ios Copyright by AMRES Ovo uputstvo se odnosi na Apple mobilne uređaje: ipad, iphone, ipod Touch. Konfiguracija podrazumeva podešavanja koja se vrše na računaru i podešavanja na mobilnom uređaju. Podešavanja

More information

GUI Layout Manager-i. Bojan Tomić Branislav Vidojević

GUI Layout Manager-i. Bojan Tomić Branislav Vidojević GUI Layout Manager-i Bojan Tomić Branislav Vidojević Layout Manager-i ContentPane Centralni deo prozora Na njega se dodaju ostale komponente (dugmići, polja za unos...) To je objekat klase javax.swing.jpanel

More information

IZDAVANJE SERTIFIKATA NA WINDOWS 10 PLATFORMI

IZDAVANJE SERTIFIKATA NA WINDOWS 10 PLATFORMI IZDAVANJE SERTIFIKATA NA WINDOWS 10 PLATFORMI Za pomoć oko izdavanja sertifikata na Windows 10 operativnom sistemu možete se obratiti na e-mejl adresu esupport@eurobank.rs ili pozivom na telefonski broj

More information

Eduroam O Eduroam servisu edu roam Uputstvo za podešavanje Eduroam konekcije NAPOMENA: Microsoft Windows XP Change advanced settings

Eduroam O Eduroam servisu edu roam Uputstvo za podešavanje Eduroam konekcije NAPOMENA: Microsoft Windows XP Change advanced settings Eduroam O Eduroam servisu Eduroam - educational roaming je besplatan servis za pristup Internetu. Svojim korisnicima omogućava bezbedan, brz i jednostavan pristup Internetu širom sveta, bez potrebe za

More information

SIMPLE PAST TENSE (prosto prošlo vreme) Građenje prostog prošlog vremena zavisi od toga da li je glagol koji ga gradi pravilan ili nepravilan.

SIMPLE PAST TENSE (prosto prošlo vreme) Građenje prostog prošlog vremena zavisi od toga da li je glagol koji ga gradi pravilan ili nepravilan. SIMPLE PAST TENSE (prosto prošlo vreme) Građenje prostog prošlog vremena zavisi od toga da li je glagol koji ga gradi pravilan ili nepravilan. 1) Kod pravilnih glagola, prosto prošlo vreme se gradi tako

More information

Ulazne promenljive se nazivaju argumenti ili fiktivni parametri. Potprogram se poziva u okviru programa, kada se pri pozivu navode stvarni parametri.

Ulazne promenljive se nazivaju argumenti ili fiktivni parametri. Potprogram se poziva u okviru programa, kada se pri pozivu navode stvarni parametri. Potprogrami su delovi programa. Često se delovi koda ponavljaju u okviru nekog programa. Logično je da se ta grupa komandi izdvoji u potprogram, i da se po želji poziva u okviru programa tamo gde je potrebno.

More information

3D GRAFIKA I ANIMACIJA

3D GRAFIKA I ANIMACIJA 1 3D GRAFIKA I ANIMACIJA Uvod u Flash CS3 Šta će se raditi? 2 Upoznavanje interfejsa Osnovne osobine Definisanje osnovnih entiteta Rad sa bojama Rad sa linijama Definisanje i podešavanje ispuna Pregled

More information

Računarska grafika je oblast računarstva koja se bavi kreiranjem, obradom, prilagođavanjem slika i animacija pomoću računara.

Računarska grafika je oblast računarstva koja se bavi kreiranjem, obradom, prilagođavanjem slika i animacija pomoću računara. Računarska grafika je oblast računarstva koja se bavi kreiranjem, obradom, prilagođavanjem slika i animacija pomoću računara. Postoje dva standardna modela boja: Aditivni model RGB Suptraktivni model CMYK

More information

Otpremanje video snimka na YouTube

Otpremanje video snimka na YouTube Otpremanje video snimka na YouTube Korak br. 1 priprema snimka za otpremanje Da biste mogli da otpremite video snimak na YouTube, potrebno je da imate kreiran nalog na gmailu i da video snimak bude u nekom

More information

INSTALIRANJE SOFTVERSKOG SISTEMA SURVEY

INSTALIRANJE SOFTVERSKOG SISTEMA SURVEY INSTALIRANJE SOFTVERSKOG SISTEMA SURVEY Softverski sistem Survey za geodeziju, digitalnu topografiju i projektovanje u niskogradnji instalira se na sledeći način: 1. Instalirati grafičko okruženje pod

More information

- Vežba 1 (dodatan materijal) - Kreiranje Web šablona (template) pomoću softvera Adobe Photoshop CS

- Vežba 1 (dodatan materijal) - Kreiranje Web šablona (template) pomoću softvera Adobe Photoshop CS - Vežba 1 (dodatan materijal) - Kreiranje Web šablona (template) pomoću softvera Adobe Photoshop CS 1. Pokrenite Adobe Photoshop CS i otvorite novi dokument sa komandom File / New 2. Otvoriće se dijalog

More information

OBJEKTNO ORIJENTISANO PROGRAMIRANJE

OBJEKTNO ORIJENTISANO PROGRAMIRANJE OBJEKTNO ORIJENTISANO PROGRAMIRANJE PREDAVANJE 3 DEFINICIJA KLASE U JAVI Miloš Kovačević Đorđe Nedeljković 1 /18 OSNOVNI KONCEPTI - Polja - Konstruktori - Metode - Parametri - Povratne vrednosti - Dodela

More information

Upute za korištenje makronaredbi gml2dwg i gml2dgn

Upute za korištenje makronaredbi gml2dwg i gml2dgn SVEUČILIŠTE U ZAGREBU - GEODETSKI FAKULTET UNIVERSITY OF ZAGREB - FACULTY OF GEODESY Zavod za primijenjenu geodeziju; Katedra za upravljanje prostornim informacijama Institute of Applied Geodesy; Chair

More information

1.7 Predstavljanje negativnih brojeva u binarnom sistemu

1.7 Predstavljanje negativnih brojeva u binarnom sistemu .7 Predstavljanje negativnih brojeva u binarnom sistemu U decimalnom brojnom sistemu pozitivni brojevi se predstavljaju znakom + napisanim ispred cifara koje definišu apsolutnu vrednost broja, odnosno

More information

AMRES eduroam update, CAT alat za kreiranje instalera za korisničke uređaje. Marko Eremija Sastanak administratora, Beograd,

AMRES eduroam update, CAT alat za kreiranje instalera za korisničke uređaje. Marko Eremija Sastanak administratora, Beograd, AMRES eduroam update, CAT alat za kreiranje instalera za korisničke uređaje Marko Eremija Sastanak administratora, Beograd, 12.12.2013. Sadržaj eduroam - uvod AMRES eduroam statistika Novine u okviru eduroam

More information

Uvod u relacione baze podataka

Uvod u relacione baze podataka Uvod u relacione baze podataka 25. novembar 2011. godine 7. čas SQL skalarne funkcije, operatori ANY (SOME) i ALL 1. Za svakog studenta izdvojiti ime i prezime i broj različitih ispita koje je pao (ako

More information

SAS On Demand. Video: Upute za registraciju:

SAS On Demand. Video:  Upute za registraciju: SAS On Demand Video: http://www.sas.com/apps/webnet/video-sharing.html?bcid=3794695462001 Upute za registraciju: 1. Registracija na stranici: https://odamid.oda.sas.com/sasodaregistration/index.html U

More information

1. Instalacija programske podrške

1. Instalacija programske podrške U ovom dokumentu opisana je instalacija PBZ USB PKI uređaja na računala korisnika PBZCOM@NET internetskog bankarstva. Uputa je podijeljena na sljedeće cjeline: 1. Instalacija programske podrške 2. Promjena

More information

NIS PETROL. Uputstvo za deaktiviranje/aktiviranje stranice Veleprodajnog cenovnika na sajtu NIS Petrol-a

NIS PETROL. Uputstvo za deaktiviranje/aktiviranje stranice Veleprodajnog cenovnika na sajtu NIS Petrol-a NIS PETROL Uputstvo za deaktiviranje/aktiviranje stranice Veleprodajnog cenovnika na sajtu NIS Petrol-a Beograd, 2018. Copyright Belit Sadržaj Disable... 2 Komentar na PHP kod... 4 Prava pristupa... 6

More information

mdita Editor - Korisničko uputstvo -

mdita Editor - Korisničko uputstvo - mdita Editor - Korisničko uputstvo - Sadržaj 1. Minimalna specifikacija računara... 3 2. Uputstvo za instalaciju aplikacije... 3 3. Korisničko uputstvo... 11 3.1 Odabir File opcije iz menija... 11 3.2

More information

Programiranje za internet zimski semestar 2013/2014. Java kroz primjere (skripta je u fazi izradi)

Programiranje za internet zimski semestar 2013/2014. Java kroz primjere (skripta je u fazi izradi) Programiranje za internet zimski semestar 2013/2014 Java kroz primjere (skripta je u fazi izradi) Zadatak broj 1 Nacrtati kocku. (Zanimljiv teži problem za razmišljanje: Nacrtat kocku čije će dimenzije

More information

CJENOVNIK KABLOVSKA TV DIGITALNA TV INTERNET USLUGE

CJENOVNIK KABLOVSKA TV DIGITALNA TV INTERNET USLUGE CJENOVNIK KABLOVSKA TV Za zasnivanje pretplatničkog odnosa za korištenje usluga kablovske televizije potrebno je da je tehnički izvodljivo (mogude) priključenje na mrežu Kablovskih televizija HS i HKBnet

More information

Direktan link ka kursu:

Direktan link ka kursu: Alat Alice može da se preuzme sa sledeće adrese: www.alice.org Kratka video uputstva posvećena alatu Alice: https://youtu.be/eq120m-_4ua https://youtu.be/tkbucu71lfk Kurs (engleski) posvećen uvodu u Java

More information

PREDSTAVLJANJE INFORMACIJA

PREDSTAVLJANJE INFORMACIJA PREDSTAVLJANJE INFORMACIJA U računarima se informacija predstavlja na način koji je omogućila savremena tehnologija a to je veličina električnog signala (napona ili struje), broj električnih signala itd.

More information

IZRADA TEHNIČKE DOKUMENTACIJE

IZRADA TEHNIČKE DOKUMENTACIJE 1 Zaglavlje (JUS M.A0.040) Šta je zaglavlje? - Posebno uokvireni deo koji služi za upisivanje podataka potrebnih za označavanje, razvrstavanje i upotrebu crteža Mesto zaglavlja: donji desni ugao raspoložive

More information

Klasterizacija. NIKOLA MILIKIĆ URL:

Klasterizacija. NIKOLA MILIKIĆ   URL: Klasterizacija NIKOLA MILIKIĆ EMAIL: nikola.milikic@fon.bg.ac.rs URL: http://nikola.milikic.info Klasterizacija Klasterizacija (eng. Clustering) spada u grupu tehnika nenadgledanog učenja i omogućava grupisanje

More information

KAPACITET USB GB. Laserska gravura. po jednoj strani. Digitalna štampa, pun kolor, po jednoj strani USB GB 8 GB 16 GB.

KAPACITET USB GB. Laserska gravura. po jednoj strani. Digitalna štampa, pun kolor, po jednoj strani USB GB 8 GB 16 GB. 9.72 8.24 6.75 6.55 6.13 po 9.30 7.89 5.86 10.48 8.89 7.30 7.06 6.61 11.51 9.75 8.00 7.75 7.25 po 0.38 10.21 8.66 7.11 6.89 6.44 11.40 9.66 9.73 7.69 7.19 12.43 1 8.38 7.83 po 0.55 0.48 0.37 11.76 9.98

More information

Tutorijal za Štefice za upload slika na forum.

Tutorijal za Štefice za upload slika na forum. Tutorijal za Štefice za upload slika na forum. Postoje dvije jednostavne metode za upload slika na forum. Prva metoda: Otvoriti nova tema ili odgovori ili citiraj već prema želji. U donjem dijelu obrasca

More information

STRUČNA PRAKSA B-PRO TEMA 13

STRUČNA PRAKSA B-PRO TEMA 13 MAŠINSKI FAKULTET U BEOGRADU Katedra za proizvodno mašinstvo STRUČNA PRAKSA B-PRO TEMA 13 MONTAŽA I SISTEM KVALITETA MONTAŽA Kratak opis montže i ispitivanja gotovog proizvoda. Dati izgled i sadržaj tehnološkog

More information

Univerzitet u Novom Sadu. Fakultet tehničkih nauka. Odsek za računarsku tehniku i računarske komunikacije. Uvod u GIT

Univerzitet u Novom Sadu. Fakultet tehničkih nauka. Odsek za računarsku tehniku i računarske komunikacije. Uvod u GIT Univerzitet u Novom Sadu Fakultet tehničkih nauka Odsek za računarsku tehniku i računarske komunikacije Uvod u GIT Šta je git? Sistem za verzionisanje softvera kao i CVS, SVN, Perforce ili ClearCase Orginalno

More information

TRAJANJE AKCIJE ILI PRETHODNOG ISTEKA ZALIHA ZELENI ALAT

TRAJANJE AKCIJE ILI PRETHODNOG ISTEKA ZALIHA ZELENI ALAT TRAJANJE AKCIJE 16.01.2019-28.02.2019 ILI PRETHODNOG ISTEKA ZALIHA ZELENI ALAT Akcija sa poklonima Digitally signed by pki, pki, BOSCH, EMEA, BOSCH, EMEA, R, A, radivoje.stevanovic R, A, 2019.01.15 11:41:02

More information

Pravljenje Screenshota. 1. Korak

Pravljenje Screenshota. 1. Korak Prvo i osnovno, da biste uspesno odradili ovaj tutorijal, morate imati instaliran GOM Player. Instalacija je vrlo jednostavna, i ovaj player u sebi sadrzi sve neophodne kodeke za pustanje video zapisa,

More information

STABLA ODLUČIVANJA. Jelena Jovanovic. Web:

STABLA ODLUČIVANJA. Jelena Jovanovic.   Web: STABLA ODLUČIVANJA Jelena Jovanovic Email: jeljov@gmail.com Web: http://jelenajovanovic.net 2 Zahvalnica: Ovi slajdovi su bazirani na materijalima pripremljenim za kurs Applied Modern Statistical Learning

More information

Primer-1 Nacrtati deo lanca.

Primer-1 Nacrtati deo lanca. Primer-1 Nacrtati deo lanca. 1. Nacrtati krug sa Ellipse alatkom i sa CTRL tasterom. 2. Napraviti kopiju kruga unutar glavnog kruga (desni klik za kopiju). 3. Selektovati oba kruga pa onda ih kombinovati

More information

Tema 2: Uvod u sisteme za podršku odlučivanju (VEŽBE)

Tema 2: Uvod u sisteme za podršku odlučivanju (VEŽBE) Tema 2: Uvod u sisteme za podršku odlučivanju (VEŽBE) SISTEMI ZA PODRŠKU ODLUČIVANJU dr Vladislav Miškovic vmiskovic@singidunum.ac.rs Fakultet za računarstvo i informatiku 2013/2014 Tema 2: Uvod u sisteme

More information

Struktura indeksa: B-stablo. ls/swd/btree/btree.html

Struktura indeksa: B-stablo.   ls/swd/btree/btree.html Struktura indeksa: B-stablo http://cis.stvincent.edu/html/tutoria ls/swd/btree/btree.html Uvod ISAM (Index-Sequential Access Method, IBM sredina 60-tih godina 20. veka) Nedostaci: sekvencijalno pretraživanje

More information

Port Community System

Port Community System Port Community System Konferencija o jedinstvenom pomorskom sučelju i digitalizaciji u pomorskom prometu 17. Siječanj 2018. godine, Zagreb Darko Plećaš Voditelj Odsjeka IS-a 1 Sadržaj Razvoj lokalnog PCS

More information

Mindomo online aplikacija za izradu umnih mapa

Mindomo online aplikacija za izradu umnih mapa Mindomo online aplikacija za izradu umnih mapa Mindomo je online aplikacija za izradu umnih mapa (vrsta dijagrama specifične forme koji prikazuje ideje ili razmišljanja na svojevrstan način) koja omogućuje

More information

JEDINSTVENI PORTAL POREZNE UPRAVE. Priručnik za instalaciju Google Chrome dodatka. (Opera preglednik)

JEDINSTVENI PORTAL POREZNE UPRAVE. Priručnik za instalaciju Google Chrome dodatka. (Opera preglednik) JEDINSTVENI PORTAL POREZNE UPRAVE Priručnik za instalaciju Google Chrome dodatka (Opera preglednik) V1 OPERA PREGLEDNIK Opera preglednik s verzijom 32 na dalje ima tehnološke promjene zbog kojih nije moguće

More information

Implementacija sparsnih matrica upotrebom listi u programskom jeziku C

Implementacija sparsnih matrica upotrebom listi u programskom jeziku C INFOTEH-JAHORINA Vol. 10, Ref. E-I-15, p. 461-465, March 2011. Implementacija sparsnih matrica upotrebom listi u programskom jeziku C Đulaga Hadžić, Ministarstvo obrazovanja, nauke, kulture i sporta Tuzlanskog

More information

1. MODEL (Ulaz / Zadržavanje / Stanje)

1. MODEL (Ulaz / Zadržavanje / Stanje) 1. MODEL (Ulaz / Zadržavanje / Stanje) Potrebno je kreirati model koji će preslikavati sledeći realan sistem: Svaki dan dolazi određen broj paleta u skladište Broj paleta na nivou dana se može opisati

More information

CJENIK APLIKACIJE CERAMIC PRO PROIZVODA STAKLO PLASTIKA AUTO LAK KOŽA I TEKSTIL ALU FELGE SVJETLA

CJENIK APLIKACIJE CERAMIC PRO PROIZVODA STAKLO PLASTIKA AUTO LAK KOŽA I TEKSTIL ALU FELGE SVJETLA KOŽA I TEKSTIL ALU FELGE CJENIK APLIKACIJE CERAMIC PRO PROIZVODA Radovi prije aplikacije: Prije nanošenja Ceramic Pro premaza površina vozila na koju se nanosi mora bi dovedena u korektno stanje. Proces

More information

KatzeView Uputstvo. verzija Novi Sad Josifa Marinkovića 44. Tel: +381 (0) Fax: +381 (0) Mob: +381 (0)

KatzeView Uputstvo. verzija Novi Sad Josifa Marinkovića 44. Tel: +381 (0) Fax: +381 (0) Mob: +381 (0) KatzeView Uputstvo verzija 3.2.2 21000 Novi Sad Josifa Marinkovića 44 Tel: +381 (0)21 443-265 Fax: +381 (0)21 443-516 Mob: +381 (0)63 513-741 http://www.cardware.co.yu info@cardware.co.yu Sadržaj: 1 Sistemski

More information

SVEUČILIŠTE U ZAGREBU FAKULTET ELEKTROTEHNIKE I RAČUNARSTVA. SEMINARSKI RAD U OKVIRU PREDMETA "Računalna forenzika" 2016/2017. GIF FORMAT (.

SVEUČILIŠTE U ZAGREBU FAKULTET ELEKTROTEHNIKE I RAČUNARSTVA. SEMINARSKI RAD U OKVIRU PREDMETA Računalna forenzika 2016/2017. GIF FORMAT (. SVEUČILIŠTE U ZAGREBU FAKULTET ELEKTROTEHNIKE I RAČUNARSTVA SEMINARSKI RAD U OKVIRU PREDMETA "Računalna forenzika" 2016/2017 GIF FORMAT (.gif) Renato-Zaneto Lukež Zagreb, siječanj 2017. Sadržaj 1. Uvod...

More information

Babylon - instalacija,aktivacija i rad sa njim

Babylon - instalacija,aktivacija i rad sa njim Babylon - instalacija,aktivacija i rad sa njim Babilon je vodeći svetski prevodilac brzog online i offline rečnika sa prevođenjem u preko 75 jezika jednim jednostavnim klikom misa i koriste ga miloni privatnih

More information

VBA moduli. mr Milovan Milivojević dipl. ing. Visa Poslovno Tehnička Škola - Užice

VBA moduli. mr Milovan Milivojević dipl. ing. Visa Poslovno Tehnička Škola - Užice VBA moduli mr Milovan Milivojević dipl. ing. Visa Poslovno Tehnička Škola - Užice Moduli (modules) ponašanje modula Ponašanje modula može se prilagoditi na 4 načina: Option Explicit Option Private Module

More information

za STB GO4TV in alliance with GSS media

za STB GO4TV in alliance with GSS media za STB Dugme za uključivanje i isključivanje STB uređaja Browser Glavni meni Osnovni meni Vrsta liste kanala / omiljeni kanali / kraći meni / organizacija kanala / ponovno pokretanje uređaja / ponovno

More information

Pokretanje (startovanje) programa Microsoft Word

Pokretanje (startovanje) programa Microsoft Word Šta je Microsoft Word? Microsoft Word je korisnički (aplikativni) program - tekst procesor, za unos, promenu, uređenje, skladištenje (čuvanje, arhiviranje) i štampanje dokumenta. Word je sastavni deo programskog

More information

Posmatrani i objekti posmatraci

Posmatrani i objekti posmatraci Posmatrani i objekti posmatraci Nekada je potrebno da jedan objekat odreaguje na promene drugog. Npr. kada se promeni centar pravougaonika, treba da se promeni i centar njegovog opisanog kruga, dok promena

More information

DIGITALIZACIJA SLIKOVNIH PODATAKA. 1. Digitalizacija. Digitalizacija slika

DIGITALIZACIJA SLIKOVNIH PODATAKA. 1. Digitalizacija. Digitalizacija slika Vesna Vučković, (Matematički fakultet, Beograd) DIGITALIZACIJA SLIKOVNIH PODATAKA Da bi se slika predstavila na računaru, mora se digitalizovati - predstaviti u obliku matrice piksela. Pri tome se, u skladu

More information

Uputstvo za pravljenje i korišdenje biblioteka sa dinamičkim povezivanjem (.dll)

Uputstvo za pravljenje i korišdenje biblioteka sa dinamičkim povezivanjem (.dll) Uputstvo za pravljenje i korišdenje biblioteka sa dinamičkim povezivanjem (.dll) pomodu razvojnog okruženja Microsoft Visual Studio 2010 Autor: dipl.ing. Nemanja Kojić, asistent Decembar 2013. Korak 1

More information

- Vežba 2 - OPTIMIZACIJA GRAFIKE ZA WEB UPOTREBA ALATKE SLICE TOOL IZRADA WEB GALERIJE

- Vežba 2 - OPTIMIZACIJA GRAFIKE ZA WEB UPOTREBA ALATKE SLICE TOOL IZRADA WEB GALERIJE - Vežba 2 - OPTIMIZACIJA GRAFIKE ZA WEB UPOTREBA ALATKE SLICE TOOL IZRADA WEB GALERIJE OPTIMIZACIJA GRAFIKE ZA WEB Upotreba slika za dizajn web sajta je uobičajena praksa. Pomoću slika definišemo izgled

More information

Idejno rješenje: Dubrovnik Vizualni identitet kandidature Dubrovnika za Europsku prijestolnicu kulture 2020.

Idejno rješenje: Dubrovnik Vizualni identitet kandidature Dubrovnika za Europsku prijestolnicu kulture 2020. Idejno rješenje: Dubrovnik 2020. Vizualni identitet kandidature Dubrovnika za Europsku prijestolnicu kulture 2020. vizualni identitet kandidature dubrovnika za europsku prijestolnicu kulture 2020. visual

More information

Nejednakosti s faktorijelima

Nejednakosti s faktorijelima Osječki matematički list 7007, 8 87 8 Nejedakosti s faktorijelima Ilija Ilišević Sažetak Opisae su tehike kako se mogu dokazati ejedakosti koje sadrže faktorijele Spomeute tehike su ilustrirae a izu zaimljivih

More information

4.1 Korišćenje aplikacije Ćelije Rukovanje radnim listovima... 32

4.1 Korišćenje aplikacije Ćelije Rukovanje radnim listovima... 32 S A D R Ž A J 4 Tabelarni proračuni... 4 4.1 Korišćenje aplikacije... 4 4.1.1 Rad sa radnim sveskama... 4 4.1.1.1 Pokretanje i zatvaranje aplikacije za tabelarne proračune. Otvaranje i zatvaranje radnih

More information

KONFIGURACIJA MODEMA. ZyXEL Prestige 660RU

KONFIGURACIJA MODEMA. ZyXEL Prestige 660RU KONFIGURACIJA MODEMA ZyXEL Prestige 660RU Sadržaj Funkcionalnost lampica... 3 Priključci na stražnjoj strani modema... 4 Proces konfiguracije... 5 Vraćanje modema na tvorničke postavke... 5 Konfiguracija

More information

LabVIEW-ZADACI. 1. Napisati program u LabVIEW-u koji računa zbir dva broja.

LabVIEW-ZADACI. 1. Napisati program u LabVIEW-u koji računa zbir dva broja. LabVIEW-ZADACI 1. Napisati program u LabVIEW-u koji računa zbir dva broja. Startovati LabVIEW Birati New VI U okviru Controls Pallete birati numerički kontroler tipa Numerical Control, i postaviti ga na

More information

INFORMATIKA II AutoCAD 9. deo. Rudarsko-geološki fakultet Rudarski odsek

INFORMATIKA II AutoCAD 9. deo. Rudarsko-geološki fakultet Rudarski odsek INFORMATIKA II AutoCAD 9. deo Rudarsko-geološki fakultet Rudarski odsek Raspoređivanje i štampanje crteža Štampanje iz AutoCAD-a je komplikovanije nego iz drugih programa zašta postoje i sasvim određeni

More information

IMPLEMENTACIJA PODLOGE ZA SARADNJU KROKI ALATA SA ALATIMA ZA UML MODELOVANJE OPŠTE NAMENE

IMPLEMENTACIJA PODLOGE ZA SARADNJU KROKI ALATA SA ALATIMA ZA UML MODELOVANJE OPŠTE NAMENE IMPLEMENTACIJA PODLOGE ZA SARADNJU KROKI ALATA SA ALATIMA ZA UML MODELOVANJE OPŠTE NAMENE IMPLEMENTATION OF BASIS FOR COOPERATION BETWEEN KROKI TOOL AND UML MODELING TOOLS Željko Ivković, Renata Vaderna,

More information

Bušilice nove generacije. ImpactDrill

Bušilice nove generacije. ImpactDrill NOVITET Bušilice nove generacije ImpactDrill Nove udarne bušilice od Bosch-a EasyImpact 550 EasyImpact 570 UniversalImpact 700 UniversalImpact 800 AdvancedImpact 900 Dostupna od 01.05.2017 2 Logika iza

More information

UVOD. Uvod. Ključna pitanja: Koji objekti postoje u Toolbox-u? Koje metode Toolbox objekata postoje?

UVOD. Uvod. Ključna pitanja: Koji objekti postoje u Toolbox-u? Koje metode Toolbox objekata postoje? Objekti u Toolbox-u UVOD Uvod Pomoću dot net okvira.net Framework, jezik Visual C# omogućuje širok opseg predefinisanih objekata koji se mogu koristiti da se kreira neka Windows aplikacija. Ovi objekti

More information

PROJEKTNI PRORAČUN 1

PROJEKTNI PRORAČUN 1 PROJEKTNI PRORAČUN 1 Programski period 2014. 2020. Kategorije troškova Pojednostavlj ene opcije troškova (flat rate, lump sum) Radni paketi Pripremni troškovi, troškovi zatvaranja projekta Stope financiranja

More information

SKRIPTA ZA VEŽBE IZ PREDMETA ELEKTRONSKO POSLOVANJE

SKRIPTA ZA VEŽBE IZ PREDMETA ELEKTRONSKO POSLOVANJE SKRIPTA ZA VEŽBE IZ PREDMETA ELEKTRONSKO POSLOVANJE KompoZer 0.77 Laboratorija za elektronsko poslovanje Beograd 2008. Sadržaj SADRŽAJ...2 1 O KOMPOZER-U...4 2 RADNO OKRUŽENJE KOMPOZER-A...6 3 RAD SA DOKUMENTIMA...13

More information

ENR 1.4 OPIS I KLASIFIKACIJA VAZDUŠNOG PROSTORA U KOME SE PRUŽAJU ATS USLUGE ENR 1.4 ATS AIRSPACE CLASSIFICATION AND DESCRIPTION

ENR 1.4 OPIS I KLASIFIKACIJA VAZDUŠNOG PROSTORA U KOME SE PRUŽAJU ATS USLUGE ENR 1.4 ATS AIRSPACE CLASSIFICATION AND DESCRIPTION VFR AIP Srbija / Crna Gora ENR 1.4 1 ENR 1.4 OPIS I KLASIFIKACIJA VAZDUŠNOG PROSTORA U KOME SE PRUŽAJU ATS USLUGE ENR 1.4 ATS AIRSPACE CLASSIFICATION AND DESCRIPTION 1. KLASIFIKACIJA VAZDUŠNOG PROSTORA

More information

OSNOVI PRIMENE RAČUNARA RASPORED U LETNJEM SEMESTRU Nedelja Datum Tema Prvi čas - Uvod

OSNOVI PRIMENE RAČUNARA RASPORED U LETNJEM SEMESTRU Nedelja Datum Tema Prvi čas - Uvod OSNOVI PRIMENE RAČUNARA RASPORED U LETNJEM SEMESTRU 2014-2015. Nedelja Datum Tema Prvi čas - Uvod 1. 2. 02.03. (pon) 03.03. (uto) 04.03. (sre) 05.03. (čet) 06.03. (pet) 09.03. (pon) 10.03. (uto) 11.03.

More information

Da bi se napravio izvještaj u Accessu potrebno je na izborniku Create odabrati karticu naredbi Reports.

Da bi se napravio izvještaj u Accessu potrebno je na izborniku Create odabrati karticu naredbi Reports. IZVJEŠTAJI U MICROSOFT ACCESS-u (eng. reports) su dijelovi baze podataka koji omogućavaju definiranje i opisivanje načina ispisa podataka iz baze podataka na papir (ili PDF dokument). Način izrade identičan

More information

OSNOVI PRIMENE RAČUNARA PROGRAM NASTAVE U LETNJEM SEMESTRU

OSNOVI PRIMENE RAČUNARA PROGRAM NASTAVE U LETNJEM SEMESTRU 1. 2. 27.02. (pon) 28.02. (uto) 01.03. (sre) 02.03. (čet) 03.03. (pet) 06.03. (pon) 07.03. (uto) 08.03. (sre) 09.03. (čet) 10.03. (pet) OSNOVI PRIMENE RAČUNARA PROGRAM NASTAVE U LETNJEM SEMESTRU 2016-17.

More information

PowerPoint deo Umetanje oblika (shapes)

PowerPoint deo Umetanje oblika (shapes) PowerPoint 2010 2. deo Umetanje oblika (shapes) Vrši se preko Insert menija: Insert Illustrations Shapes. Bira se jedan od ponuđenih oblika, kliknemo na mesto gde želimo da ga stavimo i vučemo dok se ne

More information

Visoka škola strukovnih studija za informacione i komunikacione tehnologije. SMS Gateway. Dr Nenad Kojić

Visoka škola strukovnih studija za informacione i komunikacione tehnologije. SMS Gateway. Dr Nenad Kojić Visoka škola strukovnih studija za informacione i komunikacione tehnologije SMS Gateway Dr Nenad Kojić Uvod SMS Gateway-i najčešće predstavljaju desktop aplikacije koji treba da omoguće korisničkim aplikacijama

More information

Priprema podataka. NIKOLA MILIKIĆ URL:

Priprema podataka. NIKOLA MILIKIĆ   URL: Priprema podataka NIKOLA MILIKIĆ EMAIL: nikola.milikic@fon.bg.ac.rs URL: http://nikola.milikic.info Normalizacija Normalizacija je svođenje vrednosti na neki opseg (obično 0-1) FishersIrisDataset.arff

More information

- Vežba 3 - UVOD U FLASH ANIMACIJA FRAME-BY-FRAME SHAPE TWEEN MOTION TWEEN

- Vežba 3 - UVOD U FLASH ANIMACIJA FRAME-BY-FRAME SHAPE TWEEN MOTION TWEEN - Vežba 3 - UVOD U FLASH ANIMACIJA FRAME-BY-FRAME SHAPE TWEEN MOTION TWEEN UVOD U FLASH Dizajneri Web strana najčešće koriste slike da bi privukli pažnju posetilaca Web lokacija. Priznaćete da slika može

More information

DEFINISANJE TURISTIČKE TRAŽNJE

DEFINISANJE TURISTIČKE TRAŽNJE DEFINISANJE TURISTIČKE TRAŽNJE Tražnja se može definisati kao spremnost kupaca da pri različitom nivou cena kupuju različite količine jedne robe na određenom tržištu i u određenom vremenu (Veselinović

More information

KABUPLAST, AGROPLAST, AGROSIL 2500

KABUPLAST, AGROPLAST, AGROSIL 2500 KABUPLAST, AGROPLAST, AGROSIL 2500 kabuplast - dvoslojne rebraste cijevi iz polietilena visoke gustoće (PEHD) za kabelsku zaštitu - proizvedene u skladu sa ÖVE/ÖNORM EN 61386-24:2011 - stijenka izvana

More information

Kako instalirati Apache/PHP/MySQL na lokalnom kompjuteru pod Windowsima

Kako instalirati Apache/PHP/MySQL na lokalnom kompjuteru pod Windowsima Kako instalirati Apache/PHP/MySQL na lokalnom kompjuteru pod Windowsima 1. Uvod 2. Preuzimanje programa i stvaranje mapa 3. Instalacija Apachea 4. Konfiguracija Apachea 5. Instalacija PHP-a 6. Konfiguracija

More information

MRS. MRSLab03 Metodologija Razvoja Softvera Vežba 03 LAB Dijagram aktivnosti

MRS. MRSLab03 Metodologija Razvoja Softvera Vežba 03 LAB Dijagram aktivnosti MRS LAB 03 MRSLab03 Metodologija Razvoja Softvera Vežba 03 Dijagrami aktivnosti 1. Dijagram aktivnosti Dijagram aktivnosti je UML dijagram koji modeluje dinamičke aspekte sistema. On predstavlja pojednostavljenje

More information

PROGRAMSKI PAKET ZA 3D PREDSTAVU TERENA Simić Mirko, Radovanović Slobodan ELEKTROTEHNIČKI FAKULTET U BEOGRADU

PROGRAMSKI PAKET ZA 3D PREDSTAVU TERENA Simić Mirko, Radovanović Slobodan ELEKTROTEHNIČKI FAKULTET U BEOGRADU PROGRAMSKI PAKET ZA 3D PREDSTAVU TERENA Simić Mirko, Radovanović Slobodan ELEKTROTEHNIČKI FAKULTET U BEOGRADU I UVOD U procesu projektovanja radio komunikacionih sistema potrebno je poznavati geografske

More information

Desna strana menija sadrži spisak nedavno otvaranih dokumenata.

Desna strana menija sadrži spisak nedavno otvaranih dokumenata. Radno okruženje Informatička pismenost Obrada teksta Ikone za brz pristup alatima Dugme Office Radna površina Traka sa alatima Statusna linija Dugme Office Desna strana menija sadrži spisak nedavno otvaranih

More information

Simulacija rada PIC mikrokontrolera

Simulacija rada PIC mikrokontrolera INFOTEH-JAHORINA Vol. 11, March 2012. Simulacija rada PIC mikrokontrolera Željko Gavrić, Stefan Tešanović studenti prvog ciklusa studija Fakultet za informacione tehnologije, Slobomir P Univerzitet Doboj,

More information

UPUTSTVO. za ruter TP-LINK TD-854W/ TD-W8951NB

UPUTSTVO. za ruter TP-LINK TD-854W/ TD-W8951NB UPUTSTVO za ruter TP-LINK TD-854W/ TD-W8951NB Uputstvo za ruter TP-Link TD-854W / TD-W8951NB 2 PRAVILNO POVEZIVANJE ADSL RUTERA...4 PODEŠAVANJE KONEKCIJE PREKO MREŽNE KARTE ETHERNET-a...5 PODEŠAVANJE INTERNET

More information

Advertising on the Web

Advertising on the Web Advertising on the Web On-line algoritmi Off-line algoritam: ulazni podaci su dostupni na početku, algoritam može pristupati podacima u bilo kom redosljedu, na kraju se saopštava rezultat obrade On-line

More information

Uputstva za upotrebu štampača CITIZEN S310II

Uputstva za upotrebu štampača CITIZEN S310II Upravljanje sistemom COBISS Uputstva za upotrebu štampača CITIZEN S310II V1.0 VIF-NA-27-XX IZUM, 2015. COBISS, COMARC, COBIB, COLIB, IZUM su zaštićeni znaci u posedu javnog zavoda IZUM. SADRŽAJ 1 Uvod...

More information

Office 365, upute za korištenje elektroničke pošte

Office 365, upute za korištenje elektroničke pošte Office 365, upute za korištenje elektroničke pošte Naša ustanova koristi uslugu elektroničke pošte u oblaku, u sklopu usluge Office 365. To znači da elektronička pošta više nije pohranjena na našem serveru

More information

Programiranje III razred

Programiranje III razred Tehnička škola 9. maj Bačka Palanka Programiranje III razred Istorijat programskih jezika Programski jezici Programski jezici su veštački jezici koji se mogu koristiti za kontrolu ponašanja mašine, naročito

More information

TEHNOLOGIJA, INFORMATIKA I OBRAZOVANJE ZA DRUŠTVO UČENJA I ZNANJA 6. Međunarodni Simpozijum, Tehnički fakultet Čačak, 3 5. jun 2011.

TEHNOLOGIJA, INFORMATIKA I OBRAZOVANJE ZA DRUŠTVO UČENJA I ZNANJA 6. Međunarodni Simpozijum, Tehnički fakultet Čačak, 3 5. jun 2011. TEHNOLOGIJA, INFORMATIKA I OBRAZOVANJE ZA DRUŠTVO UČENJA I ZNANJA 6. Međunarodni Simpozijum, Tehnički fakultet Čačak, 3 5. jun 2011. TECHNOLOGY, INFORMATICS AND EDUCATION FOR LEARNING AND KNOWLEDGE SOCIETY

More information

Aplikacija za podršku transferu tehnologija

Aplikacija za podršku transferu tehnologija Aplikacija za podršku transferu tehnologija uputstvo za instalaciju i administraciju sistema Doc. dr Vladimir Ćirić dipl. inž. Darko Tasić septembar 2012. 2 Sadržaj Uputstvo za instalaciju i administraciju

More information

Ikone za brz pristup alatima. Slovne oznake kolona. ime. Traka sa alatima. Dugme Office Brojčane oznake redova

Ikone za brz pristup alatima. Slovne oznake kolona. ime. Traka sa alatima. Dugme Office Brojčane oznake redova Radno okruženje Informatička pismenost Tabelarni proračuni Polje za ime Dugme Office Brojčane oznake redova Polje za formule Ikone za brz pristup alatima Kartice (jezičci) radnih listova Traka sa alatima

More information

JavaScript podrska u radu sa greskama

JavaScript podrska u radu sa greskama JavaScript podrska u radu sa greskama Svaki od pregledaca ima svoj podrazumevani naci reagovanja na greske, Firefox i Chrome upisuju greske u log datoteku, dok recimo Internet Explorer i Opera generisu

More information

Jedine besplatne novine koje uz organizovanu distribuciju nude mogućnost da svakome budu dostupne

Jedine besplatne novine koje uz organizovanu distribuciju nude mogućnost da svakome budu dostupne DNEVNE NOVINE Jedine besplatne novine koje uz organizovanu distribuciju nude mogućnost da svakome budu dostupne O NAMA SKYMUSIC CORPORATION Sky Corporation Int. predstavlja grupu kompanija, Skymusic Corporation,

More information

Windows Easy Transfer

Windows Easy Transfer čet, 2014-04-17 12:21 - Goran Šljivić U članku o skorom isteku Windows XP podrške [1] koja prestaje 8. travnja 2014. spomenuli smo PCmover Express i PCmover Professional kao rješenja za preseljenje korisničkih

More information

Svojstva olovke x (0,0)

Svojstva olovke x (0,0) Kornjačina grafika O modulu turtle Sadrži funkcije za crtanje Izvođenjem naredbi otvara se grafički prozor veličine 600x600 piksela Olovka (pokazivač) je postavljena u središtu prozora i usmjerena udesno

More information

VEŽBA 4 TOOLS - RAD SA ALATIMA

VEŽBA 4 TOOLS - RAD SA ALATIMA VEŽBA 4 TOOLS - RAD SA ALATIMA Tools (opis i rad sa alatima) Alati (Tools) Ovde ćemo objasniti alate koji se upotrebljavaju u Premiere Pro programu: Tool Bar - Alati 1: (V na tastaturi) Selection (strelica)

More information

BENCHMARKING HOSTELA

BENCHMARKING HOSTELA BENCHMARKING HOSTELA IZVJEŠTAJ ZA SVIBANJ. BENCHMARKING HOSTELA 1. DEFINIRANJE UZORKA Tablica 1. Struktura uzorka 1 BROJ HOSTELA BROJ KREVETA Ukupno 1016 643 1971 Regije Istra 2 227 Kvarner 4 5 245 991

More information

10.1 Grafika za veb. Poglavlje 10 Interfejs Canvas

10.1 Grafika za veb. Poglavlje 10 Interfejs Canvas Poglavlje 10 Interfejs Canvas 10.1 Grafika za veb Na početku knjige pomenuli smo da HTML5 zamenjuje ranije dodatne programe, kao što su Flash ili Java apleti. Da bi veb postao nezavisan od tehnologija

More information

MikroC biblioteka za PDU format SMS poruke

MikroC biblioteka za PDU format SMS poruke INFOTEH-JAHORINA Vol. 12, March 2013. MikroC biblioteka za PDU format SMS poruke Saša Vučičević Student prvog ciklusa studija Elektrotehnički fakultet Istočno Sarajevo, Republika Srpska, Bosna i Hercegovina

More information

AUDIO-VIZUELNA SREDSTVA

AUDIO-VIZUELNA SREDSTVA AUDIO-VIZUELNA SREDSTVA UPUTSTVO ZA PRIPREMU PREDISPITNE OBAVEZE Sremska Mitrovica, 2017. SADRŽAJ 1. Predispitna obaveza... 3 2. Tema predispitne obaveze... 3 3. Parametri video snimka... 4 4. Struktura

More information

Struktura i organizacija baza podataka

Struktura i organizacija baza podataka Fakultet tehničkih nauka, DRA, Novi Sad Predmet: Struktura i organizacija baza podataka Dr Slavica Aleksić, Milanka Bjelica, Nikola Obrenović Primer radnik({mbr, Ime, Prz, Sef, Plt, God, Pre}, {Mbr}),

More information

Trening: Obzor financijsko izvještavanje i osnovne ugovorne obveze

Trening: Obzor financijsko izvještavanje i osnovne ugovorne obveze Trening: Obzor 2020. - financijsko izvještavanje i osnovne ugovorne obveze Ana Ključarić, Obzor 2020. nacionalna osoba za kontakt za financijska pitanja PROGRAM DOGAĐANJA (9:30-15:00) 9:30 10:00 Registracija

More information

MRS MRSLab09 Metodologija Razvoja Softvera Vežba 09

MRS MRSLab09 Metodologija Razvoja Softvera Vežba 09 MRS MRSLab09 Metodologija Razvoja Softvera Vežba 09 LAB 09 Fizički model podatka 1. Fizički model podataka Fizički model podataka omogućava da se definiše struktura baze podataka sa stanovišta fizičke

More information

P R O J E K T N I R A D

P R O J E K T N I R A D Elektrotehnički fakultet Banja Luka P R O J E K T N I R A D iz predmeta: M U L T I M E D I J A L N I S I S T E M I zadatak: Virtuelna multimedijalna biblioteka Studenti: Vladimir Javorina, 80/02 Milan

More information