Canvas: <canvas id="tutorial" width="150" height="150"></canvas> Canvas WYMAGA domykajacego taga.
|
|
|
- Stanisława Wysocka
- 9 lat temu
- Przeglądów:
Transkrypt
1 Canvas: <canvas id="tutorial" width="150" height="150"></canvas> Canvas WYMAGA domykajacego taga. Kompatybilność wsteczna: <canvas id="stockgraph" width="150" height="150"> current stock price: $ </canvas> <canvas id="clock" width="150" height="150"> <img src="images/clock.png" width="150" height="150" alt=""/> </canvas> Szkielet: <html> <head> <title>canvas tutorial</title> <script type="text/javascript"> function draw(){ var canvas = document.getelementbyid('tutorial'); if (canvas.getcontext){ canvas.getcontext('2d'); </script> <style type="text/css"> canvas { border: 1px solid black; </style> </head> <body onload="draw();"> <canvas id="tutorial" width="150" height="150"></canvas> </body> </html> Przykład: <html> <head> <script type="application/javascript"> var canvas = document.getelementbyid("canvas"); if (canvas.getcontext) {
2 canvas.getcontext("2d"); ctx.fillstyle = "rgb(200,0,0)"; ctx.fillrect (10, 10, 55, 50); ctx.fillstyle = "rgba(0, 0, 200, 0.5)"; ctx.fillrect (30, 30, 55, 50); </script> </head> <body onload="draw();"> <canvas id="canvas" width="150" height="150"></canvas> </body> </html> Prostokąty: fillrect(x, y, width, height) - wypełniony prostokąt strokerect(x, y, width, height) - obrys prostokątu clearrect(x, y, width, height) - czyści obszar o danym obszarze. rect(x, y, width, height) - generuje ścieżkę w kształcie prostokąta Przykład: var canvas = document.getelementbyid('canvas'); if (canvas.getcontext) { canvas.getcontext('2d'); ctx.fillrect(25,25,100,100); ctx.clearrect(45,45,60,60); ctx.strokerect(50,50,50,50); Ścieżki: beginpath() - rozpoczyna nową ścieżkę, kolejne komendy rysujące są przekazywane w ścieżke. closepath() - kończy rysowanie ścieżki, kolejne polecenia są kierowane do kontekstu stroke() - rysuje krawędź fill() - rysuje wypełnienie moveto działa jak oderwanie długopisa od kartki papieru, rysuje niewidzialną
3 linie: lineto - rysuje linie między obecną pozycją a x,y arc(x, y, promień, kąt poczatkowy, kąt końcowy, odwrotnie do wskazówek zegara) - rysuje odpowiedni łuk, kąty mierzone sa w radianach, radian = (Math.PI/180)*stopnie Przykłady: var canvas = document.getelementbyid('canvas'); if (canvas.getcontext){ canvas.getcontext('2d'); ctx.moveto(75,50); ctx.lineto(100,75); ctx.lineto(100,25); ctx.fill(); var canvas = document.getelementbyid('canvas'); if (canvas.getcontext){ canvas.getcontext('2d'); ctx.arc(75,75,50,0,math.pi*2,true); // Outer circle ctx.moveto(110,75); ctx.arc(75,75,35,0,math.pi,false); // Mouth (clockwise) ctx.moveto(65,65); ctx.arc(60,65,5,0,math.pi*2,true); // Left eye ctx.moveto(95,65); ctx.arc(90,65,5,0,math.pi*2,true); // Right eye
4 var canvas = document.getelementbyid('canvas'); if (canvas.getcontext){ canvas.getcontext('2d'); // Filled triangle ctx.moveto(25,25); ctx.lineto(105,25); ctx.lineto(25,105); ctx.fill(); // Stroked triangle ctx.moveto(125,125); ctx.lineto(125,45); ctx.lineto(45,125); ctx.closepath(); Krzywe: quadraticcurveto(cp1x, cp1y, x, y) - rysuje krzywą między x, y, z punktem kontrolnym cpl1x, cpl1y beziercurveto(cp1x, cp1y, cp2x, cp2y, x, y) - podobnie jak powyżej, ale 2 punkty kontrolne Przykłady: var canvas = document.getelementbyid('canvas'); if (canvas.getcontext) { canvas.getcontext('2d'); // Quadratric curves example ctx.moveto(75,25); ctx.quadraticcurveto(25,25,25,62.5); ctx.quadraticcurveto(25,100,50,100); ctx.quadraticcurveto(50,120,30,125); ctx.quadraticcurveto(60,120,65,100); ctx.quadraticcurveto(125,100,125,62.5);
5 ctx.quadraticcurveto(125,25,75,25); Przykłady: var canvas = document.getelementbyid('canvas'); if (canvas.getcontext){ canvas.getcontext('2d'); // Quadratric curves example ctx.moveto(75,40); ctx.beziercurveto(75,37,70,25,50,25); ctx.beziercurveto(20,25,20,62.5,20,62.5); ctx.beziercurveto(20,80,40,102,75,120); ctx.beziercurveto(110,102,130,80,130,62.5); ctx.beziercurveto(130,62.5,130,25,100,25); ctx.beziercurveto(85,25,75,37,75,40); ctx.fill(); Obrazy: Obrazy możemy brać, z : HTMLImageElement - wykorzystując konstruktor Image() oraz dowolny <img> HTMLVideoElement - dowolna klatka z filmu wstawionego za pomocą <video> HTMLCanvasElement - grafika z innego <canvas> ImageBitmap - z bitmapy Wgrywając obraz musimy mieć pewność, że próbujemy go wyświetlić kiedy się już wgrał, w innym przypadku nie otrzymamy nic, albo wyjątek. var img = new Image(); // Create new img element img.addeventlistener("load", function() { // execute drawimage statements here, false); img.src = 'myimage.png'; // Set source path Przykład:
6 var img = new Image(); img.onload = function(){ ctx.drawimage(img,0,0); ctx.moveto(30,96); ctx.lineto(70,66); ctx.lineto(103,76); ctx.lineto(170,15); ; img.src = ' Style Tworząc obiekty, możemy nadwać im style określające sposób wypełnienia oraz krawędzi: fillstyle = color - styl wypełnienia strokestyle = color - styl linii Kolory możemy podać w kilku postaciach: ctx.fillstyle = "orange"; ctx.fillstyle = "#FFA500"; ctx.fillstyle = "rgb(255,165,0)"; ctx.fillstyle = "rgba(255,165,0,1)"; strokestyle globalalpha - ustawia przeźroczystość dla wszystkich obiektów linestyle: linewidth - grubość linii linecap - zakończenie linii, możliwe wartości to butt(domyślny), round, square. linejoin - połączenie dwóch segmentów (linii, łuków, krzywych), możliwe opcje to round, bevel, miter. miterlimit Przykłady: for (var i=0;i<6;i++){
7 for (var j=0;j<6;j++){ ctx.fillstyle = 'rgb(' + Math.floor( *i) + ',' + Math.floor( *j) + ',0)'; ctx.fillrect(j*25,i*25,25,25);
8 for (var i=0;i<6;i++){ for (var j=0;j<6;j++){ ctx.strokestyle = 'rgb(0,' + Math.floor( *i) + ',' + Math.floor( *j) + ')'; ctx.arc(12.5+j*25,12.5+i*25,10,0,math.pi*2,true); var linecap = ['butt','round','square']; // Draw guides ctx.strokestyle = '#09f'; ctx.moveto(10,10); ctx.lineto(140,10); ctx.moveto(10,140); ctx.lineto(140,140); // Draw lines ctx.strokestyle = 'black'; for (var i=0;i<linecap.length;i++){ ctx.linewidth = 15; ctx.linecap = linecap[i]; ctx.moveto(25+i*50,10); ctx.lineto(25+i*50,140);
9 var linejoin = ['round','bevel','miter']; ctx.linewidth = 10; for (var i=0;i<linejoin.length;i++){ ctx.linejoin = linejoin[i]; ctx.moveto(-5,5+i*40); ctx.lineto(35,45+i*40); ctx.lineto(75,5+i*40); ctx.lineto(115,45+i*40); ctx.lineto(155,5+i*40); miterlimit - jak daleko mają być 'przesuwane' końce kształtów aż się spotkają. // Clear canvas ctx.clearrect(0,0,150,150); // Draw guides ctx.strokestyle = '#09f'; ctx.linewidth = 2; ctx.strokerect(-5,50,160,50); // Set line styles ctx.strokestyle = '#000'; ctx.linewidth = 10; // check input if (document.getelementbyid('miterlimit').value.match(/\d+ (\.\d+)?/)) { ctx.miterlimit = parsefloat(document.getelementbyid('miterlimit').value); else { alert('value must be a positive number'); // Draw lines
10 ctx.moveto(0,100); for (i=0;i<24;i++){ var dy = i%2==0? 25 : -25 ; ctx.lineto(math.pow(i,1.5)*2,75+dy); return false;
11 Gradienty: W gradiencie liniowym, najpierw określamy rozmiar gradientu (punkty x1, y1, x2, y2) a następnie za pomocą ColorStopów wartości kolorów w poszczególnych miejscach: // Create gradients var lingrad = ctx.createlineargradient(0,0,0,150); lingrad.addcolorstop(0, '#00ABEB'); lingrad.addcolorstop(0.5, '#fff'); lingrad.addcolorstop(0.5, '#26C000'); lingrad.addcolorstop(1, '#fff'); var lingrad2 = ctx.createlineargradient(0,50,0,95); lingrad2.addcolorstop(0.5, '#000'); lingrad2.addcolorstop(1, 'rgba(0,0,0,0)'); // assign gradients to fill and stroke styles ctx.fillstyle = lingrad; ctx.strokestyle = lingrad2; // draw shapes ctx.fillrect(10,10,130,130); ctx.strokerect(50,50,50,50); W gradiencie radialnym, parametry reprezentują dwa koła - o środku w punkcie x1,y1 i promieniu r1, oraz drugim odpowiednio w miejscu x2, y2 i promieniu r2: createradialgradient(x1, y1, r1, x2, y2, r2). // Create gradients var radgrad = ctx.createradialgradient(45,45,10,52,50,30); radgrad.addcolorstop(0, '#A7D30C'); radgrad.addcolorstop(0.9, '#019F62');
12 radgrad.addcolorstop(1, 'rgba(1,159,98,0)'); var radgrad2 = ctx.createradialgradient(105,105,20,112,120,50); radgrad2.addcolorstop(0, '#FF5F98'); radgrad2.addcolorstop(0.75, '#FF0188'); radgrad2.addcolorstop(1, 'rgba(255,1,136,0)'); var radgrad3 = ctx.createradialgradient(95,15,15,102,20,40); radgrad3.addcolorstop(0, '#00C9FF'); radgrad3.addcolorstop(0.8, '#00B5E2'); radgrad3.addcolorstop(1, 'rgba(0,201,255,0)'); var radgrad4 = ctx.createradialgradient(0,150,50,0,140,90); radgrad4.addcolorstop(0, '#F4F201'); radgrad4.addcolorstop(0.8, '#E4C700'); radgrad4.addcolorstop(1, 'rgba(228,199,0,0)'); // draw shapes ctx.fillstyle = radgrad4; ctx.fillrect(0,0,150,150); ctx.fillstyle = radgrad3; ctx.fillrect(0,0,150,150); ctx.fillstyle = radgrad2; ctx.fillrect(0,0,150,150); ctx.fillstyle = radgrad; ctx.fillrect(0,0,150,150); Transformacje: Zmiany w stanie canvas zapisywane są na stosie. Aby dodać do stosu aktualny stan wywołujemy na kontekście polecenie save(), aby powrócić do zapisanego stanu, używamy restore(). Przykład: ctx.fillrect(0,0,150,150); default settings ctx.save(); // Draw a rectangle with // Save the default state
13 ctx.fillstyle = '#09F' // Make changes to the settings ctx.fillrect(15,15,120,120); // Draw a rectangle with new settings ctx.save(); ctx.fillstyle = '#FFF' settings ctx.globalalpha = 0.5; ctx.fillrect(30,30,90,90); new settings ctx.fillrect(45,45,60,60); restored settings ctx.fillrect(60,60,30,30); restored settings // Save the current state // Make changes to the // Draw a rectangle with // Restore previous state // Draw a rectangle with // Restore original state // Draw a rectangle with Przesunięcie: translate(x,y) - przesuwa układ współrzędnych o x, y. ctx.fillrect(0,0,300,300); for (var i=0;i<3;i++) { for (var j=0;j<3;j++) { ctx.save(); ctx.strokestyle = "#9CFF00"; ctx.translate(50+j*100,50+i*100); drawspirograph(ctx,20*(j+2)/(j+1),-8*(i+3)/ (i+1),10); function drawspirograph(ctx,r,r,o){ var x1 = R-O; var y1 = 0;
14 var i = 1; ctx.moveto(x1,y1); do { if (i>20000) break; var x2 = (R+r)*Math.cos(i*Math.PI/72) - (r+o)*math.cos(((r+r)/r)*(i*math.pi/72)) var y2 = (R+r)*Math.sin(i*Math.PI/72) - (r+o)*math.sin(((r+r)/r)*(i*math.pi/72)) ctx.lineto(x2,y2); x1 = x2; y1 = y2; i++; while (x2!= R-O && y2!= 0 );
15 Obrót: rotate(kąt) - obraca układ współrzędnych o kąt (w radianach). ctx.translate(75,75); for (var i=1;i<6;i++){ // Loop through rings (from inside to out) ctx.save(); ctx.fillstyle = 'rgb('+(51*i)+','+(255-51*i)+',255)'; for (var j=0;j<i*6;j++){ // draw individual dots ctx.rotate(math.pi*2/(i*6)); ctx.arc(0,i*12.5,5,0,math.pi*2,true); ctx.fill(); Skalowanie: scale(x, y) - skaluje obraz o x, y. ctx.strokestyle = "#fc0"; ctx.linewidth = 1.5; ctx.fillrect(0,0,300,300); // Uniform scaling ctx.save() ctx.translate(50,50); drawspirograph(ctx,22,6,5); ctx.translate(100,0); ctx.scale(0.75,0.75); drawspirograph(ctx,22,6,5); ctx.translate( ,0);
16 ctx.scale(0.75,0.75); drawspirograph(ctx,22,6,5); // Non uniform scaling (y direction) ctx.strokestyle = "#0cf"; ctx.save() ctx.translate(50,150); ctx.scale(1,0.75); drawspirograph(ctx,22,6,5); ctx.translate(100,0); ctx.scale(1,0.75); drawspirograph(ctx,22,6,5); ctx.translate(100,0); ctx.scale(1,0.75); drawspirograph(ctx,22,6,5); // Non uniform scaling (x direction) ctx.strokestyle = "#cf0"; ctx.save() ctx.translate(50,250); ctx.scale(0.75,1); drawspirograph(ctx,22,6,5); ctx.translate( ,0); ctx.scale(0.75,1); drawspirograph(ctx,22,6,5); ctx.translate( ,0); ctx.scale(0.75,1); drawspirograph(ctx,22,6,5); function drawspirograph(ctx,r,r,o){ var x1 = R-O; var y1 = 0; var i = 1; ctx.moveto(x1,y1); do {
17 if (i>20000) break; var x2 = (R+r)*Math.cos(i*Math.PI/72) - (r+o)*math.cos(((r+r)/r)*(i*math.pi/72)) var y2 = (R+r)*Math.sin(i*Math.PI/72) - (r+o)*math.sin(((r+r)/r)*(i*math.pi/72)) ctx.lineto(x2,y2); x1 = x2; y1 = y2; i++; while (x2!= R-O && y2!= 0 ); Kompozycja Domyślnie scena rysowana jest za pomocą source-over, oznacza to, że nowe kształty rysowane są na starych. Za pomocą globalcompositeoperation = typ możemy ustalić nowe zachowanie sceny: source-over (domyślne) - nowe rysowane na starym source-in - rysowana jest część wspólna nowego i starego source-out - rysujemy elementy nie mające wspólnych punktów source-atop - nowy kształt rysowany jest tam, gdzie oba kształty się przecinają lighter - jeżeli dwa kształty się przecinają to ich część wspólna jest sumą ich kolorów destination-over - nowe kształty rysowane są poniżej starych destination-in - istniejące kształty są zachowane tylko w miejscach przecięcia z nowym destination-out - istniejące kształty są zachowane tylko tam, gdzie się nie przecinają z nowym destination-atop - istniejący kształt jest rysowany tam, gdzie przecinaja się z nowym. Nowy kształt rysowany jest pod spodem. darker - tam gdzie przecinają się kształty, mają one kolor równy różnicy ich wartości. (Nie używana już) xor - kształty są rysowane jako przeźroczyste tam gdzie się przecinają, rysowane są normalnie w pozostałych miejscach. copy - rysuje tylko nowy kształt i usuwa stary. Ścieżki ucinające: Pozwalają ustawić maskę dla canvasu. Obiekty rysowane po clip() są ucięte do kształtu maski:
18 ctx.fillrect(0,0,150,150); ctx.translate(75,75); // Create a circular clipping path ctx.arc(0,0,60,0,math.pi*2,true); ctx.clip(); // draw background var lingrad = ctx.createlineargradient(0,-75,0,75); lingrad.addcolorstop(0, '#232256'); lingrad.addcolorstop(1, '#143778'); ctx.fillstyle = lingrad; ctx.fillrect(-75,-75,150,150); // draw stars for (var j=1;j<50;j++){ ctx.save(); ctx.fillstyle = '#fff'; ctx.translate(75-math.floor(math.random()*150), 75-Math.floor(Math.random()*150)); drawstar(ctx,math.floor(math.random()*4)+2); function drawstar(ctx,r){ ctx.save(); ctx.beginpath() ctx.moveto(r,0); for (var i=0;i<9;i++){ ctx.rotate(math.pi/5); if(i%2 == 0) { ctx.lineto((r/ )* ,0); else { ctx.lineto(r,0); ctx.closepath(); ctx.fill();
19 Podstawowa animacja: Aby móc stworzyć animowaną scenę, należy zastosować się do kilku kroków: Najpierw czyścimy canvas. Zapisujemy stan kanwy jeśli to potrzebne. Rysujemy scenę Przywracamy stan kanwy. setinterval(function, delay) - uruchamia funkcję function (podawaną jako string) co delay milisekund. var sun = new Image(); var moon = new Image(); var earth = new Image(); function init(){ sun.src = ' moon.src = ' ; earth.src = ' '; setinterval(draw,100); ctx.globalcompositeoperation = 'destination-over'; ctx.clearrect(0,0,300,300); // clear canvas ctx.fillstyle = 'rgba(0,0,0,0.4)'; ctx.strokestyle = 'rgba(0,153,255,0.4)'; ctx.save(); ctx.translate(150,150); // Earth var time = new Date(); ctx.rotate( ((2*Math.PI)/60)*time.getSeconds() +
20 ((2*Math.PI)/60000)*time.getMilliseconds() ); ctx.translate(105,0); ctx.fillrect(0,-12,50,24); // Shadow ctx.drawimage(earth,-12,-12); // Moon ctx.save(); ctx.rotate( ((2*Math.PI)/6)*time.getSeconds() + ((2*Math.PI)/6000)*time.getMilliseconds() ); ctx.translate(0,28.5); ctx.drawimage(moon,-3.5,-3.5); ctx.arc(150,150,105,0,math.pi*2,false); // Earth orbit ctx.drawimage(sun,0,0,300,300);
Multimedia i interfejsy. Ćwiczenie 5 HTML5
Multimedia i interfejsy Ćwiczenie 5 HTML5 Celem ćwiczenia jest poznanie nowych elementów wprowadzonych w HTML 5, do których należą m.in. video oraz canvas. Poniższy opis przedstawia sposób użycia tych
Mazakiem po WWW czyli kilka słów o obiekcie «canvas»
Mazakiem po WWW czyli kilka słów o obiekcie «canvas» Robert BoBsoN Partyka Streszczenie: Rozwój informatyki to ciągły bieg za nowymi technologiami. Tendencja ta nie omija także globalnej pajęczyny stron
WIZUALIZACJA INFORMACJI TEKSTOWEJ WSTĘP DO HTML 5 CANVAS
WIZUALIZACJA INFORMACJI TEKSTOWEJ WSTĘP DO HTML 5 CANVAS Autor prezentacji: Michał Kołkowski Promotor: prof dr. hb. Włodzisław Duch SPIS TREŚCI 1. Ogólnie o Canvasie 2. Utworzenie szablonu do pracy z Canvas
Element CANVAS. Grafika rastrowa w HTML5. Rysowanie na kanwie. Rysowanie napisów. Teksty Obrazy Animacje Interakcja Ramka formatowana za pomocą CSS
Element CANVAS Grafika rastrowa w HTML5 Teksty Obrazy Animacje Interakcja Ramka formatowana za pomocą CSS
4. Rysowanie krzywych
1. Operator plot y x \begin{tikzpicture} \draw[->] (-0.2,0) -- (4.2,0) node[right] {$x$}; \draw[->] (0,-1.2) -- (0,4.2) node[above] {$y$}; \draw (3,4) -- (3,3) plot coordinates{(2,3) (3,0) (4,3)}; \end{tikzpicture}
Aplikacje internetowe
Aplikacje internetowe Podstawy programowania w języku JavaScript Roman Simiński roman.siminski@us.edu.pl www.siminskionline.pl Programowanie z wykorzystaniem elementu Wprowadzenie Element
Poprzednia wersja HTML, HTML 4.01, pochodzi z 1999. Sieć od tego czasu zmieniła się znacznie.
Co to jest HTML5? HTML5 będzie nowym standardem dla HTML. Poprzednia wersja HTML, HTML 4.01, pochodzi z 1999. Sieć od tego czasu zmieniła się znacznie. HTML5 jest ciągle w stadium tworzenia i konkretyzacji.
Zajęcia nr 15 JavaScript wprowadzenie do JavaScript
Zajęcia nr 15 JavaScript wprowadzenie do JavaScript Prowadzący: Andrzej Gąsienica-Samek, strona kółka www.atinea.pl/kolko Wprowadzenie do jsfiddle.net Uruchom Chrome i wejdź na stronę http://jsfiddle.net.
Defilada - przykład wykorzystujący animowane modele Copperlicht. Andrzej P.Urbański Politechnika Poznańska
Defilada - przykład wykorzystujący animowane modele Copperlicht Andrzej P.Urbański Politechnika Poznańska Czego potrzebujemy? Animowane postacie potrafiące wykonywać różne ruchy cząstkowe np.: chodzić,
PyX jest pakietem Pythona do grafiki wektorowej. Pozawala zatem tworzyd pliki EPS oraz PDF.
PyX jest pakietem Pythona do grafiki wektorowej. Pozawala zatem tworzyd pliki EPS oraz PDF. Aby go zainstalowad należy rozpakowad pakiet o nazwie PyX-0.10 do odpowiedniego katalogu. Będzie on dostępny
Alfabetyczna lista stylów
Tematy: Kaskadowe arkusze stylów Alfabetyczna lista stylów Uwaga: wiele stylów CSS3 nie jest ciągle interpretowanych przez przeglądarki Styl Znaczen CSS1 CSS2 CSS3 IE FF A animation Zbiorcza definicja
Wizualne systemy programowania. Wykład 11 Grafika. dr Artur Bartoszewski -Wizualne systemy programowania, sem. III- WYKŁAD
Wizualne systemy programowania Wykład 11 Grafika 1 dr Artur Bartoszewski -Wizualne systemy programowania, sem. III- WYKŁAD Grafika GDI+ GDI+ - Graphics Device Interface jeden z trzech podstawowych komponentów
Pascal - grafika. Uruchomienie trybu graficznego. Moduł graph. Domyślny tryb graficzny
Moduł graph Pascal - grafika Pascal zawiera standardowy moduł do tworzenia obiektów graficznych linii, punktów, figur geometrycznych itp. Chcąc go użyć należy w programie (w nagłówku) wstawić deklarację:
Inkscape. Narzędzia informatyki
Inkscape Narzędzia informatyki Inkscape Narzędzie do tworzenia grafiki wektorowej kompatybilnej z formatem SVG Rozwijane od 2003 r. Dostępne dla Windows, Mac OS X i Linux a Dostępne na licencji GNU www.inkscape.org
Grafika Komputerowa Materiały Laboratoryjne
Grafika Komputerowa Materiały Laboratoryjne Laboratorium 6 Processing c.d. Wstęp Laboratorium 6 poszerza zagadnienie generowania i przetwarzania obrazów z wykorzystaniem języka Processing 2, dedykowanego
Aplikacje internetowe laboratorium HTML 5
Aplikacje internetowe laboratorium Jednym z głównych założeń twórców jest kompatybilność wsteczna. Z grubsza oznacza to, że wprowadzenie tej wersji standardu nie może spowodować, że 99,9% stron internetowych
HTML. Tim Berners-Lee
HTML5 - początek HTML 1991 pojawia się pierwsza publicznie dostępna publikacja HTML Tags. 1993 - publikacja pierwszej propozycji specyfikacji języka"hypertext Markup Language (HTML)" Internet-Draft. 1995
Druga aplikacja Prymitywy, alpha blending, obracanie bitmap oraz mały zestaw przydatnych funkcji wyświetlających własnej roboty.
Przyszedł czas na rysowanie własnych figur, czyli prymitywy, obracanie bitmap, oraz alpha blending-czyli półprzezroczystość. Będę opisywał tylko rzeczy nowe-nie ma potrzeby abym się powtarzał. Zaczynajmny
APLIKACJE INTERNETOWE 1 HTML - STRUKTURA STRONY INTERNETOWEJ
APLIKACJE INTERNETOWE 1 HTML - STRUKTURA STRONY INTERNETOWEJ PLAN PREZENTACJI Wprowadzenie do HTML Struktura dokumentu HTML Komentarze Znaczniki Nagłówki (tytuły) Akapit Znacznik końca wiersza Linia pozioma
Ćwiczenie 2 Warstwy i kształty podstawowe
Ćwiczenie 2 Warstwy i kształty podstawowe Poznamy podstawy pracy z nowym obrazkiem w Adobe Photoshop: - zapisywanie własnego ustawienia nowo tworzonego pliku - wybór kolorów, tworzenie własnych próbek
GIMP Grafika rastrowa (Ćwiczenia cz. 2)
Zjazd 1 GIMP Grafika rastrowa (Ćwiczenia cz. 2) Zaznaczenia Aby zacząć profesjonalnie rysować w programie GIMP należy opanować tematykę zaznaczeń. Zaznaczenia (inaczej maski) służą do zaznaczania obszarów
Jarosław Kuchta Podstawy Programowania Obiektowego. Podstawy grafiki obiektowej
Jarosław Kuchta Podstawy Programowania Obiektowego Podstawy grafiki obiektowej Zagadnienia Grafika proceduralna grafika obiektowa Grafika WPF dualizm XAML C# Właściwości obiektów graficznych edycja właściwości
Tik Z wiadomości wstępne
Tik Z wiadomości wstępne Zofia Walczak 17 lutego 2014 1 Co należy wiedzieć na początku Aby rozpocząć pracę z TikZ -em należy w preambule dokumentu wczytać pakiet używając polecenia \usepackage{tikz}. Tik
I. Wstawianie rysunków
I. Wstawianie rysunków Wstawiane rysunku Bez parametrów: Tekst alternatywny Tytuł obrazka
Podstawy Processingu. Diana Domańska. Uniwersytet Śląski
Podstawy Processingu Diana Domańska Uniwersytet Śląski Processing jest językiem programowania opartym na języku Java. Jest on nastawiony na aplikacje związane z grafiką, animacją. Projekt został zainicjowany
Test z przedmiotu. Witryny i aplikacje internetowe
Test z przedmiotu Witryny i aplikacje internetowe Tylko jedna odpowiedź jest poprawna!!! Zadanie 1 Kod języka HTML przedstawi tabelę składającą się z dwóch
Utworzyliśmy właśnie fragment elementów, które będą imitować fotomanipulację kobietycyborga. W taki sposób prezentuje się nasz efekt:
Cyborg Otwieramy nasz render z dziewczyną. Tworzymy nową przezroczystą warstwę i wypełniany ją białym kolorem, a następnie za pomocą przezroczystego pędzla o kolorze [e9e9e9] malujemy mniej więcej na środku
Szybkie tworzenie grafiki w GcIde
Szybkie tworzenie grafiki w GcIde Opracował: Ryszard Olchawa Poniższy opis dotyczy aplikacji okienkowej w systemie Windows lub Linux bazującej na obiektowej bibliotece rofrm stworzonej w środowisku GcIde.
Programowanie obiektowe i zdarzeniowe wykład 8 grafika i animacja
Programowanie obiektowe i zdarzeniowe wykład 8 grafika i animacja Grafika Kształty Najprostszy sposób rysowania własnej zawartości w WPF, to wykorzystanie kształtów. Shapes klasy reprezentujące linie,
ZAZNACZENIA. Zaznaczenia (inaczej maski) służą do zaznaczania obszarów rysunku.
1 z 5 ZAZNACZENIA Zaznaczenia (inaczej maski) służą do zaznaczania obszarów rysunku. WAŻ E: Jeżeli obraz posiada zaznaczenie, to wszystkie przekształcenia obrazu (lub warstwy) są wykonywane w ramach. Rodzaje
DOM i JavaScript DOM W3C
DOM W3C DOM (ang. Document Object Model, obiektowy model dokumentu) to API dla dokumentów HTML i XML. Wprowadza strukturalne odwzorowanie dokumentu, pozwalając modyfikować jego zawartość i warstwę prezentacji
Animacje cz. 2. Rysujemy koło zębate
Animacje cz. 2 1. Do wykonania poniższej animacji będziemy potrzebować dodatkowego desenia. Znajduje się on w folderze z instrukcją, żeby program Gimp mógł z niego skorzystać musimy wskazać mu ścieżkę
narzędzie Linia. 2. W polu koloru kliknij kolor, którego chcesz użyć. 3. Aby coś narysować, przeciągnij wskaźnikiem w obszarze rysowania.
Elementy programu Paint Aby otworzyć program Paint, należy kliknąć przycisk Start i Paint., Wszystkie programy, Akcesoria Po uruchomieniu programu Paint jest wyświetlane okno, które jest w większej części
Technologie Informacyjne Mechatronika 2012/2013 Turtle
Technologie Informacyjne Mechatronika 2012/2013 Turtle 1. Cel laboratorium Celem laboratorium jest zapoznanie się z modułem Turtle i wykonanie w nim prostej grafiki 2. Zadania do wykonania Napisać program
Podłączanie bibliotek Zapis danych do pliku graficznego Generowanie promienia pierwotnego Import sceny z pliku Algorytm ray tracingu
Ray Tracer cz.1 Michał Chwesiuk Zachodniopomorski Uniwersytet Technologiczny w Szczecinie Wydział Informatyki 4 Kwiecień 2017 Michał Chwesiuk Ray Tracer cz.1 4 Kwiecień 2017 1/21 Plan zajęć laboratoryjnych
Tło CSS 3. Gabriela Panuś
Tło CSS 3 Gabriela Panuś body { background-color: kolor; TŁO - CSS } TŁO OBRAZKOWE background-image: url(tlo.jpg); /* podajemy ścieżkę do tła */ body { } background: #6495ed url(image/obrazek.png); Właściwości
Copyright Packt Publishing 2011. First published in the English language under the title HTML5 Canvas Cookbook.
Tytuł oryginału: HTML5 Canvas Cookbook Tłumaczenie: Piotr Rajca ISBN: 978-83-246-5075-0 Helion 2013. All rights reserved. Copyright Packt Publishing 2011. First published in the English language under
Sieciowe Technologie Mobilne. Laboratorium 2
Sieciowe Technologie Mobilne Laboratorium 2 Tworzenie wieloplatformowych aplikacji mobilnych przy użyciu biblioteki PhoneGap. Łukasz Kamiński Laboratorium 2 Na dzisiejszym laboratorium skupimy się na implementacji
Adobe InDesign rysowanie obiektów wektorowych- przygotowanie pracy
Adobe InDesign rysowanie obiektów wektorowych- przygotowanie pracy Narzędzia: (Window>Tools) Pathfinder: (Window>Objects & Layout>Pathfinder) Obrys: (Window>Stroke) Próbki koloru: (Window>Swatches) Kolor:
LIVE Gra w życie. LIVE w JavaScript krok po kroku. ANIMACJA Rozpoczynamy od podstawowego schematu stosowanego w animacji
LIVE Gra w życie Live jest jednym z pierwszych i najbardziej znanych tzw. automatów komórkowych. Został wymyślony w 1970 roku przez brytyjskiego matematyka Johna Conwaya. Co to takiego automat komórkowy?
Wykład VII PASCAL - grafika;
Podstawy programowania Wykład VII PASCAL - grafika; 1 Procedura InitGraph() InitGraph ( var sterownik,tryb:integer; katalog:string ); biblioteka: GRAPH Służy do włączenia trybu graficznego. Możliwe sterowniki
Z CSS3 szybciej i przyjemniej
1 Z CSS3 szybciej i przyjemniej Marta Piasecka, 2 Zaokraglone--narozniki - 3 lub 4 elementy rysują tło - więcej kodu html - obrazki z narożnikami lub częściami tła - użytkownik widzi stronę bez tła dopóki
Ćwiczenie 1 Automatyczna animacja ruchu
Automatyczna animacja ruchu Celem ćwiczenia jest poznanie procesu tworzenia automatycznej animacji ruchu, która jest podstawą większości projektów we Flashu. Ze względu na swoją wszechstronność omawiana
Podczas tej lekcji przyjrzymy się, jak wykonać poniższy rysunek przy pomocy programu BobCAD-CAM
Rysowanie Części 2D Lekcja Pierwsza Podczas tej lekcji przyjrzymy się, jak wykonać poniższy rysunek przy pomocy programu BobCAD-CAM Na wstępie należy zmienić ustawienia domyślne programu jednostek miary
Wprowadzenie do języka HTML
Radosław Rudnicki (joix@mat.umk.pl) 05.09.2009 r. Wprowadzenie do języka HTML Do tworzenia stron internetowych wystarczy użyd zwykłego Notatnika oferowanego przez system Windows, czy dowolny inny system
4.3 WITRAś. 1. UŜywając polecenia Linia (_Line) narysować odcinek, podając jako punkt początkowy współrzędną 90,-300 i punkt końcowy 90,55.
4.3 WITRAś 1. UŜywając polecenia Linia (_Line) narysować odcinek, podając jako punkt początkowy współrzędną 90,-300 i punkt końcowy 90,55. 2. Narysować głowicę słupa, rozpoczynając od narysowania górnego
1 Zrozumieć Flasha... 1 Co można zrobić za pomocą Flasha?... 2 Tworzenie obrazków do strony 3 Animowanie witryny 4 Tworzenie filmów
1 Zrozumieć Flasha... 1 Co można zrobić za pomocą Flasha?... 2 Tworzenie obrazków do strony WWW... 3 Animowanie witryny WWW... 4 Tworzenie filmów interaktywnych... 6 Wyświetlanie przycisków... 7 Transformacja
Grafika Komputerowa Materiały Laboratoryjne
Grafika Komputerowa Materiały Laboratoryjne Laboratorium 5 Processing Wstęp Laboratorium 1 obejmuje zagadnienie generowania i przetwarzania obrazów z wykorzystaniem języka Processing 2, dedykowanego do
Kurs Adobe Photoshop Elements 11
Kurs Adobe Photoshop Elements 11 Gladiatorx1 Kształty, kształty własne 2015-01- 01 Spis treści Wstęp... 2 Kształty... 2 Opcje narzędzia... 2 Rysujemy kształty... 5 Opcje dodawania, odejmowania obszaru
Wprowadzenie do rysowania w 3D. Praca w środowisku 3D
Wprowadzenie do rysowania w 3D 13 Praca w środowisku 3D Pierwszym krokiem niezbędnym do rozpoczęcia pracy w środowisku 3D programu AutoCad 2010 jest wybór odpowiedniego obszaru roboczego. Można tego dokonać
Grafika PHP dla początkujących
Instrukcja numer 03 Grafika PHP dla początkujących Zaawansowane techniki tworzenie stron WWW Dynamiczne tworzenie obrazków w PHP zadanie_10.php
Krok 2 Następnie kliknij raz na obszar roboczy za pomocą narzędzia Elipsa (L). Ustaw szerokość i wysokość tak, jak szerokość zaokrąglonego prostokąta.
Krok 1 Użyj narzędzia Zaokrąglony prostokąt i narysuj prostokąt, który jest nieco ponad dwukrotnie większy niż jest szeroki. Możesz to zrobić na dwa sposoby: kliknij raz na obszar roboczy i wprowadź wartości
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 4 HTML 5 i CSS 3.0 Agenda Co nowego w HTML 5? Nowe elementy HTML 5 Nowe elementy w formularzach HTML
Algorytm SAT. Marek Zając 2012. Zabrania się rozpowszechniania całości lub fragmentów niniejszego tekstu bez podania nazwiska jego autora.
Marek Zając 2012 Zabrania się rozpowszechniania całości lub fragmentów niniejszego tekstu bez podania nazwiska jego autora. Spis treści 1. Wprowadzenie... 3 1.1 Czym jest SAT?... 3 1.2 Figury wypukłe...
Tytuł oryginału: The Essential Guide to HTML5: Using Games to learn HTML5 and JavaScript
Tytuł oryginału: The Essential Guide to HTML5: Using Games to learn HTML5 and JavaScript Tłumaczenie: Marek Pętlicki ISBN: 978-83-246-4107-9 Original edition copyright 2010 by Jeanine Meyer. All rights
SterBox. Przygotowanie Strony Użytkownika
Przygotowanie Strony Użytkownika Sterbox od wersji 2.1.1 obsługuje dwie strony użytkownika umożliwiające sterowanie z kontrolą stanów. Rozpoczynając tworzenie strony potrzebujemy programu do tworzenia
Znaczniki języka HTML
www.math.uni.lodz.pl/ radmat Elementy inline ... Elementy inline ... ... Elementy inline ... ... ... Elementy inline
WSTĘP; NARZĘDZIA DO RYSOWANIA
1 z 5 Link do instalacji Gimpa Gimp WSTĘP; NARZĘDZIA DO RYSOWANIA Menu w Gimpie znajduje się w oknie głównym Gimpa i w oknie obrazu. Dostępne jest również po kliknięciu prawym klawiszem myszy na obraz.
1. OPEN OFFICE RYSUNKI
1. 1 1. OPEN OFFICE RYSUNKI 1.1 Wiadomości podstawowe Po uruchomieniu programu Draw okno aplikacji wygląda jak na poniższym rysunku. Składa się ono z głównego okna, w którym edytuje się rysunek oraz czterech
Powtórzenie materiału: CSS3 Spis treści
Powtórzenie materiału: CSS3 Spis treści Kolory...2 Jednostki...3 Czcionka...3 Elementy blokowe...3 Cienie...5 Gradient...5 Zgodność z przeglądarkami...6 Kolory Wartości kolorów w CSS podawać można na 4
Kod źródłowy programu: program Grafika1; uses crt, graph; (1) var sterownik, tryb:smallint; (2)
Grafika w Pascalu. Do tej pory, tworząc programy w Pascalu, wykorzystywaliśmy jedynie tryb tekstowy. Jednak Pascal, tak jak i inne języki programowania, umoŝliwia korzystanie równieŝ z trybu graficznego.
Lekcja 11 Gra komputerowa LASER
Lekcja 11 Gra komputerowa LASER http://www.crunchzilla.com/game-maven Na środku ekranu kręci się laserowa baza (trzy obrócone kwadraty), z której (klikając myszką) możemy wypuszczać laserowe strzały. Z
Dodatek A. Palety. QuarkXPress 4.1. Projekty praktyczne. Podstawowe palety
Dodatek A. Palety Podstawowe palety Paleta Tools, czyli paleta narzędziowa. Jest to typowa paleta pływająca, w której zostały umieszczone podstawowe narzędzia. Rysunek A 1. Paleta Tools Item narzędzie
Obsługa grafiki w Delphi, rysowanie na płótnie, obsługa myszki, zapisywanie obrazków do plików, bitmapy pozaekranowe.
Programowanie Wizualno-Obiektowe (studia zaoczne - inżynieria komputerowa) Zajęcia z Delphi 5, program 1 Temat: Zadanie: Obsługa grafiki w Delphi, rysowanie na płótnie, obsługa myszki, zapisywanie obrazków
Dokument hipertekstowy
Dokument hipertekstowy Laboratorium 5 Box model i layouty mgr inż. Krzysztof Wróbel Katedra Lingwistyki Komputerowej Wysokość i szerokość domyślna szerokość elementu inline jest związana z jego zawartością
Systemy wirtualnej rzeczywistości. Komponenty i serwisy
Uniwersytet Zielonogórski Instytut Sterowania i Systemów Informatycznych Systemy wirtualnej rzeczywistości Laboratorium Komponenty i serwisy Wstęp: W trzeciej części przedstawione zostaną podstawowe techniki
Artykuł pochodzi z czasopisma PHP Solutions. Do ściągnięcia bezpłatnie ze strony: www.phpsolmag.org
Artykuł pochodzi z czasopisma PHP Solutions. Do ściągnięcia bezpłatnie ze strony: www.phpsolmag.org Bezpłatne kopiowanie i rozpowszechanie artykułu dozwolone pod warunkiem zachowania jego obecnej formy
Systemy multimedialne 2015
Systemy multimedialne 2015 Nazwa nowej warstwy nie ma znaczenia pod względem funkcjonalnym. Warto jednak ją nadać, łatwiej możemy się wtedy poruszać po bardziej rozbudowanym projekcie. Domyślny rozmiar
DOM i JavaScript DOM W3C
DOM W3C DOM (ang. Document Object Model, obiektowy model dokumentu) to API dla dokumentów HTML i XML. Wprowadza strukturalne odwzorowanie dokumentu, pozwalając modyfikować jego zawartość i warstwę prezentacji
Adobe InDesign lab. 3 Jacek Wiślicki,
Spis treści 1. Zaawansowane techniki pracy...2 1.1. Tekst z wypełnieniem...2 1.2. Stosowanie przeźroczystości i oblewania tekstem...5 strona 1 z 8 1. Zaawansowane techniki pracy 1 W poprzednich instrukcjach
Unity 3D - własny ekran startowy i menu gry
www.math.uni.lodz.pl/ radmat Cel ćwiczeń Celem bieżących ćwiczeń jest stworzenie własnego ekranu startowego oraz menu gry. Własny ekran startowy Tworzymy nowy, pusty obiekt GameObject Create Empty i nadajemy
Rysowanie prostych obiektów graficznych przy użyciu biblioteki AWT (Abstract Window Toolkit)
Rysowanie prostych obiektów graficznych przy użyciu biblioteki AWT (Abstract Window Toolkit) Biblioteka Abstrakcyjnych Narzędzi Okienkowych AWT (Abstract Window Toolkit) jako historycznie pierwsza w JDK
Krok 1: Stylizowanie plakatu
HTML & CSS 1 Wanted! Każdy Klub Kodowania musi być zarejestrowany. Zarejestrowane kluby można zobaczyć na mapie na stronie codeclubworld.org - jeżeli nie ma tam twojego klubu sprawdź na stronie jumpto.cc/18cplpy
Interakcje wizualno-muzyczne. Processing. w programowaniu obrazu. Piotr Welk
Interakcje wizualno-muzyczne Processing w programowaniu obrazu Piotr Welk 18 20 marca 2011 Processing jest środowiskiem programowania dla ludzi tworzących obrazy, animacje, wizualne i interaktywne eksperymenty.
Ćwiczenie 4 - Podstawy materiałów i tekstur. Renderowanie obrazu i animacji
Ćwiczenie 4 - Podstawy materiałów i tekstur. Renderowanie obrazu i animacji Materiał jest zbiorem informacji o właściwościach powierzchni. Składa się na niego kolor, sposób odbijania światła i sposób nakładania
Wstęp 5 Rozdział 1. Przygotowanie do pracy 7. Rozdział 2. Rysowanie 19. Rozdział 3. Sceny, warstwy i obiekty 57. Rozdział 4.
Wstęp 5 Rozdział 1. Przygotowanie do pracy 7 Operacje na plikach 7 Interfejs Flasha 14 Rozdział 2. Rysowanie 19 Wektorowe kształty 20 Właściwości wypełnień 27 Właściwości linii 34 Transformacje 40 Tekst
INSTRUKCJA OBSŁUGI Iron - 2013
INSTRUKCJA OBSŁUGI Iron - 2013 Fun With Art Oryginalny tekst: Bajtek tylko o atari 2 - Marek Zachar MENU Po uruchomieniu programu na ekranie pojawia się rysunkowe menu. Opcje wybierane są z niego joystickiem
Górnicki Mateusz 17681
Streszczenie referatu pt.: Obróbka i montaż wideo w programie Sony Vegas -ścieżki audio/wideo, przejścia, filtry, rendering i inne Tytuł streszczenia: Maskowanie i animacja w programie Sony Vegas Pro Data
Edytor tekstu MS Word 2010 PL: grafika. Edytor tekstu MS Word umożliwia wstawianie do dokumentów grafiki.
Edytor tekstu MS Word 2010 PL: grafika. Edytor tekstu MS Word umożliwia wstawianie do dokumentów grafiki. Edytor tekstu MS Word 2010 PL: kształty. Do każdego dokumentu można wstawić tzw. kształty. Aby
www.fwrl.pl/szkolenie
STRONA www.fwrl.pl/szkolenie MS WORD HTML HTML i dostarczają informację dla silnika przeglądarki o tym jak ma być zbudowana i wyświetlona strona HTML HTML HTML (warstwa logiczna co i gdzie ma być) (wastwa
TWORZENIE TORU KOLEJOWEGO DLA LOKOMOTYWY - ZABAWKI. W tym przewodniku stworzymy tor kolejowy pasujący do zabawki.
TWORZENIE TORU KOLEJOWEGO DLA LOKOMOTYWY - ZABAWKI W tym przewodniku stworzymy tor kolejowy pasujący do zabawki. Wymiary twojej zabawki mogą być inne niż ta, więc musisz zacząć od zmierzenia jej wymiarów.
Adobe InDesign lab. 3 Jacek Wiślicki, Paweł Kośla
Spis treści 1. Zaawansowane techniki pracy... 2 1.1. Tekst z wypełnieniem... 2 1.2. Stosowanie przeźroczystości i oblewania tekstem... 6 strona 1 z 9 1. Zaawansowane techniki pracy 1 W poprzednich instrukcjach
GNUPLOT Wprowadzenie. dr inż. Marzena Tefelska martef@if.pw.edu.pl Wydział Fizyki Politechnika Warszawska 2015
GNUPLOT Wprowadzenie dr inż. Marzena Tefelska martef@if.pw.edu.pl Wydział Fizyki Politechnika Warszawska 2015 http://www.gnuplot.info/ Program Gnuplot Rysuje wykresy w 2D lub 3D zdefiniowanych funkcji
6 Grafika 2D. 6.1 Obiekty 2D
6 Grafika 2D. J a c e k Ta r a s i u k 6.1 Obiekty 2D W wektorowej grafice dwuwymiarowej obraz opisuje się jako zbiór prostych obiektów geometrycznych takich jak: odcinki, elipsy, prostokąty itp 1. Każdy
Doskonalimy Rysowanie Kartka Bożonarodzeniowa
Doskonalimy Rysowanie Kartka Bożonarodzeniowa CREATED BY: DAMIAN KUPCZYK OPIEKUN: dr Barbara Kołodziejczak 1. Zamiana obszaru roboczego (naszej kartki) na poziom. Naciskamy przycisk plik a następnie wybieramy
Krzysztof Sendor Słowa kluczowe Tworzenie schodów
Program Intericad T5 Wersja polska Przygotował: Krzysztof Sendor Słowa kluczowe Tworzenie schodów Tworzenie schodów Istnie ją 4 sposoby tworzenie schodów w programie Intericad. W zależności od rodzaju
Zasoby. Musimy zaimportować zasoby dla gry z Asset Store
Gra 2D w Unity Tworzymy projekt Pusty projekt Zasoby Musimy zaimportować zasoby dla gry z Asset Store Potwierdzamy import Zasoby Scena Zapisujemy naszą na razie pustą scenę, najlepiej w podkatalogu Assets/Scenes
Kurs programowania. Wykład 6. Wojciech Macyna. 7 kwietnia 2016
Wykład 6 7 kwietnia 2016 Klasa java.applet.applet Aplety w języku Java Aplety sa specyficznymi programami które moga być wyświetlane w oknach większości przegladarek internetowych. Klasa Applet rozszerza
Programowanie w Sieci Internet. Python: Wątki. Kraków, 12 grudnia 2014 r. mgr Piotr Rytko Wydział Matematyki i Informatyki
Programowanie w Sieci Internet Python: Wątki Kraków, 12 grudnia 2014 r. mgr Piotr Rytko Wydział Matematyki i Informatyki Wątki akt pierwszy, kilka przydatnych funkcji Lib/threading.py modół pozwalający
9. Wymiarowanie. 9.1 Wstęp. 9.2 Opis funkcje wymiarowania. Auto CAD 14 9-1
Auto CAD 14 9-1 9. Wymiarowanie. 9.1 Wstęp Wymiarowanie elementów jest ważnym etapem tworzenia rysunku. Dzięki wymiarom wielkość elementów znajdujących się na rysunku zostaje jednoznacznie określona. 9.2
Artykuł pochodzi ze strony Daniela Łysiaka do odwiedzenia której oczywiście zapraszam. Publikacja za zgodą Autora.
Artykuł pochodzi ze strony Daniela Łysiaka http://vm-rexor.pl, do odwiedzenia której oczywiście zapraszam. Publikacja za zgodą Autora. Tym razem nie będzie rewelacyjnych efektów specjalnych, niemniej jednak
I. Menu oparte o listę
I. Menu oparte o listę We wcześniejszych przykładach założyliśmy, że menu posiada tylko jeden poziom nawigacji. Czasem jednak jeden poziom nie wystarczy za pomocą list elementów oraz kaskadowych arkuszy
Ćwiczenie 14 Dmuchawce
Dmuchawce Celem ćwiczenia jest wykorzystanie właściwości programu Flash do generowania animacji o charakterze losowym. Prezentowany efekt można wykorzystać do wielu różnych celów np. spadające liście,
Opis Edytora postaci Logomocji
Opis Edytora postaci Logomocji Przyciski na pasku narzędzi Przyciski Wygląd Opis W Edytorze postaci można otwierać pliki o rozszerzeniach: Otwórz plik postaci lgf (plik Edytora postaci), imp (plik projektu
Umieszczanie grafiki w dokumencie
Umieszczanie grafiki w dokumencie Najczęstszym sposobem wstawiania grafiki do dokumentu jest wybranie z górnego menu polecenia Wstaw-->Obraz--Z pliku W tym oknie podajemy lokalizacje pliku, który zostanie
Polecenie ŚWIATPUNKT - ŚWIATŁO PUNKTOWE
Polecenie ŚWIATPUNKT - ŚWIATŁO PUNKTOWE Tworzy światło punktowe emitujące światło we wszystkich kierunkach. Lista monitów Wyświetlane są następujące monity. Określ położenie źródłowe : Podaj wartości
Wyprowadzanie znaku logo
Wyprowadzanie znaku logo Przegląd narzędzi programu Adobe Illustrator CS2 1. Umieść mapę bitową w dokumencie Illustratora: File > Place. 2. Na rolecie warstw wstaw ikonę kłódki, by zablokować warstwę z
Rysowanie Części 2D. Lekcja Druga. Podczas tej lekcji przyjrzymy się jak wykonać poniższy rysunek przy pomocy programu BobCAD-CAM.
Rysowanie Części 2D Lekcja Druga Podczas tej lekcji przyjrzymy się jak wykonać poniższy rysunek przy pomocy programu BobCAD-CAM. Musimy zdecydować najpierw jak rozpoczniemy rysowanie projektu. Rysunek
Sieciowe Technologie Mobilne. Laboratorium 4
Sieciowe Technologie Mobilne Laboratorium 4 Tworzenie wieloplatformowych aplikacji mobilnych przy użyciu biblioteki PhoneGap. Łukasz Kamiński Laboratorium 4 Urozmaicone zostaną animacje potworów, aby odpowiadały
Cover sheet. WinCC (TIA Portal) FAQ Listopad 2012
Cover sheet W jaki sposób migrować projekt zintegrowany ze STEP 7 z WinCC flexible do WinCC (TIA Portal)? WinCC (TIA Portal) FAQ Listopad 2012 Service & Support Answers for industry. Pytanie Dokument ten