Εργαστήριο #12. Βήμα 1 ο. Βήμα 2 ο. Βήμα 3 ο. Βήμα 4 ο.
|
|
|
- Τρυφωσα Κόρακας
- 8 χρόνια πριν
- Προβολές:
Transcript
1 Εργαστήριο #12 Από τα προηγούμενα εργαστήρια: Το εργαστήριο αυτό είναι ανεξάρτητο από τα προηγούμενα επειδή όμως ασχολείται με τη γλώσσα JavaScript, βεβαιωθείτε ότι έχετε διαβάσει το εισαγωγικό Παράρτημα Γ του 11 ου εργαστηρίου. Οδηγίες Στο σημερινό εργαστήριο θα εξασκηθείτε στη χρήση της Javascript για τον προγραμματισμό στην πλευρά του browser του νέου στοιχείου HTML που ονομάζεται canvas. Το στοιχείο αυτό μας επιτρέπει να ζωγραφίσουμε σχήματα και άλλα στοιχεία δύο διαστάσεων (2D) μέσα στην ιστοσελίδα η προσθήκη σχημάτων γίνεται αποκλειστικά μέσω JavaScript. Ακολουθήστε τα παρακάτω βήματα: Βήμα 1 ο. Στο σημερινό εργαστήριο θα χρησιμοποιήσετε δύο αρχεία: ένα αρχείο html (κατάληξη.html) ένα αρχείο Javascript (με κατάληξη.js) Ξεκινήστε από ένα φρέσκο αρχείο HTML μπορείτε να χρησιμοποιήσετε το υπόδειγμα από το site του εργαστηρίου. Δημιουργήστε ένα νέο (κενό προς το παρόν) αρχείο κειμένου για τον κώδικα JavaScript. Διαβάστε στο Παράρτημα Α.1 πώς θα συνδέσετε τα δύο αρχεία, χρησιμοποιώντας το στοιχείο <script> της HTML. Βήμα 2 ο. Διαβάστε το Παράρτημα B.1 και εισάγετε ένα στοιχείο <canvas> με διαστάσεις 600x400 pixels στο <body> της ιστοσελίδας. Μην παραξενευτείτε που δεν βλέπετε τίποτα στον browser! Το στοιχείο <canvas> είναι αρχικά κενό και διαφανές! Βήμα 3 ο. Πριν αρχίσετε να αλληλεπιδράτε μέσω της JavaScript με τα στοιχεία HTML της ιστοσελίδας, θα πρέπει η ιστοσελίδα να έχει φορτωθεί πλήρως και να έχουν σχηματιστεί όλα τα στοιχεία της. Διαβάστε το Παράρτημα Α.2 και προσθέστε μια συνάρτηση για τον χειρισμό του γεγονότος onload της ιστοσελίδας. Βήμα 4 ο. Προσθέστε μια φόρμα για να μπορεί ο χρήστης να αλληλεπιδρά με την εφαρμογή σας. Το ζητούμενο είναι: (Ε12) 1
2 1. Να μπορεί ο χρήστης να επιλέξει από μια drop-down λίστα μεταξύ 3 σχημάτων (square, circle, text). 2. Να υπάρχει επίσης drop-down λίστα για επιλογή 3 χρωμάτων (red, green, blue). 3. Να υπάρχει ένα πλαίσιο για την εισαγωγή κειμένου, όταν ο χρήστης επιλέξει στη drop-down λίστα το text. 4. Τέλος, να υπάρχει ένα κουμπί για την εκτέλεση της επιλογής του χρήστη. Η φόρμα αυτή δεν θα στέλνει τίποτα στον web server (προορίζεται μόνο για αλληλεπίδραση με τον χρήστη) και πρέπει να τη χειριστείτε μέσω JavaScript. Διαβάστε το Παράρτημα Γ.1 για να δείτε πώς θα το επιτύχετε. Βήμα 5 ο. Προσθέστε στο αρχείο JavaScript μια συνάρτηση χειρισμού για το γεγονός onclick του κουμπιού της φόρμας. Προς το παρόν η συνάρτηση αυτή θα είναι κενή. Δείτε πώς θα το κάνετε στο Παράρτημα Γ.2. Βήμα 6 ο. Διαβάστε το Παράρτημα B.2 για να μάθετε πώς να σχεδιάζετε πάνω στην επιφάνεια του στοιχείου <canvas>. Βήμα 7 ο. Διαβάστε το Παράρτημα Γ.3 για να μάθετε πώς μπορείτε μέσω JavaScript να ανακτήσετε τις τιμές των στοιχείων εισόδου της φόρμας. Στη συνέχεια, προσθέστε κώδικα στη συνάρτηση χειρισμού onclick του κουμπιού, έτσι ώστε να σχεδιάζετε σε κάθε πάτημα ανάλογα με την επιλογή του χρήστη. Το μέγεθος και η θέση κάθε σχήματος θα υπολογίζονται δυναμικά με τη βοήθεια των εξής συναρτήσεων της JavaScript: Math.random() επιστρέφει έναν float ψευδοτυχαίο αριθμό r, 0 r<1 Math.floor(f) επιστρέφει τον μέγιστο ακέραιο αριθμό μικρότερο ή ίσο με τον float f Για να βρείτε έναν ψευδοτυχαίο ακέραιο αριθμό μεταξύ mink και maxk, γράφετε: Math.floor(Math.random()*(maxk-mink+1))+min Επίσης: για να βρείτε τα μέγιστα όρια, μπορείτε να χρησιμοποιήσετε τις ιδιότητες canvas.width και canvas.height του αντικειμένου Javascript που αντιπροσωπεύει το στοιχείο <canvas>. Βήμα 8 ο (προαιρετικό). Διαβάστε στο Παράρτημα B.3 πώς θα αποθηκεύσετε το περιεχόμενο του <canvas> σε ένα αρχείο. Προσθέστε ένα δεύτερο κουμπί στη φόρμα, καθώς και τον κατάλληλο κώδικα για να μπορεί ο χρήστης να αποθηκεύει το αποτέλεσμα της σχεδίασης. (Ε12) 2
3 Παράρτημα Α: JavaScript στον browser Στη συνέχεια δίνονται ορισμένα στοιχεία για τη σχέση της JavaScript με τον προγραμματισμό του browser. Το παρόν δεν είναι μια αναλυτική περιγραφή της Javascript για την ίδια τη γλώσσα θα δοθούν κατά περίπτωση ορισμένα στοιχεία, όπου αυτό είναι αναγκαίο. Αρκεί να γνωρίζετε ότι η σύνταξη είναι όμοια με της C (στις εντολές διακλάδωσης και επανάληψης, τα block εντολών, τα σχόλια, τον τερματισμό κάθε εντολής με το ;). Η σύνταξη στη χρήση των μεταβλητών είναι επίσης παρόμοια με της C. Υπάρχουν όμως σημαντικές διαφορές στον τύπο και τη δήλωση των μεταβλητών: Οι μεταβλητές μπορούν να αλλάζουν δυναμικά τύπο κατά τη διάρκεια της εκτέλεσης. Π.χ. ενώ μια μεταβλητή έχει περιεχόμενο integer, μπορεί αργότερα να αντιπροσωπεύει ένα string. Οι μεταβλητές δηλώνονται, χωρίς όμως προσδιορισμό τύπου, μέσω της λέξηςκλειδιού var. Μπορείτε να έχετε δήλωση και αρχικοποίηση μαζί: // δήλωση μεταβλητής η τιμή της είναι undefined var i; // δήλωση και αρχικοποίηση μεταβλητής var str = 'some text'; // μπορείτε να χρησιμοποιήσετε και " Η εμβέλεια των μεταβλητών είναι είτε σφαιρική (global), είτε τοπική σε συναρτήσεις (local). Δεν υπάρχει εμβέλεια block όπως στη C. Α.1. Πού θα προσθέσετε τον κώδικα JavaScript. Ο κώδικας Javascript μπορεί να προστεθεί: είτε μέσα στη δήλωση ενός στοιχείου HTML, ως κώδικας χειρισμού γεγονότος (βλ. 11 ο εργαστήριο) είτε μέσα στην ιστοσελίδα, μέσα σε ένα στοιχείο <script> είτε τέλος σε ξεχωριστό αρχείο, όπως και οι οδηγίες CSS, πάλι με τη χρήση του στοιχείου <script>. Ο τελευταίος τρόπος είναι και ο πλέον πρότυπος και θα τον ακολουθήσετε στο εργαστήριο. Μέσα στο στοιχείο <head> εισάγετε το εξής: <script src="code.js"></script> υποθέτοντας φυσικά ότι το αρχείο JavaScript ονομάζεται code.js και βρίσκεται στον ίδιο φάκελο με την ιστοσελίδα. Παρατηρήστε ότι υπάρχει και η ετικέτα τέλους </script>, παρόλο που δεν υπάρχει περιεχόμενο. (Ε12) 3
4 Α.2. Το αντικείμενο window μιας ιστοσελίδας. Από το 11 ο εργαστήριο γνωρίζετε ήδη το αντικείμενο document. Το αντικείμενο αυτό μας επιτρέπει την πρόσβαση στα στοιχεία HTML της ιστοσελίδας. Υπάρχει όμως ένα κεντρικό αντικείμενο, πατέρας όλων των αντικειμένων της ιστοσελίδας το περιβάλλον εκτέλεσης του κώδικα Javascript της ιστοσελίδας το οποίο ονομάζεται window (η ονομασία είναι κληρονομιά μιας εποχής όπου ένας browser είχε μόνο ένα παράθυρο και απεικόνιζε μία και μοναδική ιστοσελίδα). Το αντικείμενο window παρέχει το χώρο όπου ορίζονται όλα τα άλλα αντικείμενα της JavaScript για τη συγκεκριμένη ιστοσελίδα. Ένα από αυτά το γνωρίζετε ήδη: το document είναι παιδί του αντικειμένου window: window.document επειδή το window είναι το πρωταρχικό αντικείμενο, μπορούμε να περιγράψουμε τα παιδιά του χωρίς τη λέξη window. Έτσι λέμε απλά: document Ιδιότητες του αντικειμένου window που θα χρησιμοποιήσετε. window.onload Εάν οριστεί, παρέχει τη συνάρτηση που θα εκτελεστεί όταν η ιστοσελίδα και όλα τα αντικείμενα που περιέχει φορτωθούν πλήρως. Μόνο τότε έχει σχηματιστεί το δέντρο DOM των στοιχείων της ιστοσελίδας! Η συνάρτηση που θα δώσετε κάνει συνήθως τις αρχικοποιήσεις και συνδέει τα στοιχεία HTML με τον κώδικα χειρισμού των γεγονότων τους. Εισάγετε τη συνάρτηση αυτή στο αρχείο JavaScript ως εξής: window.onload = function() { }; //...ο κώδικας της συνάρτησης εδώ... Σας παραξενεύει ο παραπάνω κώδικας; Στην JavaScript οι συναρτήσεις είναι αντικείμενα, όπως οτιδήποτε άλλο. Έτσι, μπορείτε να δημιουργήσετε μια (ανώνυμη) συνάρτηση όπως στο παράδειγμα και να την αναθέσετε σε μια άλλη μεταβλητή. Φυσικά μπορείτε να ορίσετε μια συνάρτηση κατά τον παραδοσιακό τρόπο, όπως θα δείτε αργότερα. window.location Περιέχει πληροφορίες διεύθυνσης (URL) της ιστοσελίδας που είναι φορτωμένη στον browser: (Ε12) 4
5 // διαβάζοντας το αντικείμενο location παίρνετε το URL // της τρέχουσας ιστοσελίδας var currenturl = window.location; // γράφοντας στο location οδηγείτε τον browser σε νέα // ιστοσελίδα window.location = " "; (Ε12) 5
6 Παράρτημα Β: Το στοιχείο <canvas> της HTML5! Το νέο στοιχείο <canvas> επιτρέπει τη σχεδίαση γραφικών σε μια ιστοσελίδα. Η σχεδίαση αυτή γίνεται μέσω JavaScript, με τη χρήση μεθόδων που παρέχει το προγραμματιστικό αντικείμενο του στοιχείου <canvas>. Όταν εισάγετε γραφικά σε ένα στοιχείο <canvas>, τα πάντα μετατρέπονται σε pixels. Αυτό σημαίνει ότι δεν μπορείτε αργότερα να πείτε π.χ. εκείνη η γραμμή (που πρόσθεσα προηγουμένως) να αλλάξει χρώμα ή θέση. Απλούστατα, εκείνη η γραμμή δεν υπάρχει ως ξεχωριστό αντικείμενο! Αν θέλετε παρόμοια λειτουργικότητα, υπάρχει η αντίστοιχη τεχνολογία: ονομάζεται SVG αλλά δεν θα καλυφθεί στο εργαστήριο. Β.1. Πώς εισάγεται ένα στοιχείο <canvas> στην ιστοσελίδα. Ακολουθήστε το παράδειγμα, το οποίο εισάγει ένα στοιχείο <canvas> με διαστάσεις 320x200 pixels ζωγραφικής : <canvas id="testcanvas" width="320" height="200"> Canvas not supported... </canvas> Η ιδιότητα id δίνει ένα αναγνωριστικό όνομα στο στοιχείο <canvas>. Το όνομα αυτό θα χρησιμοποιηθεί αργότερα από την JavaScript. Το περιεχόμενο του στοιχείου θα φανεί μόνο στην περίπτωση που ο browser δεν υποστηρίζει το στοιχείο <canvas>! Β.2. Σχεδιάζοντας πάνω σε ένα στοιχείο <canvas>. Πριν κάνετε οτιδήποτε άλλο, πρέπει να προσπελάσετε το context σχεδίασης (δύο διαστάσεων 2D) του στοιχείου <canvas>: // επιλέγουμε το αντικείμενο του στοιχείου canvas var canvas = document.getelementbyid("testcanvas"); // ανάκτηση του context για σχεδίαση var context = canvas.getcontext("2d"); Στη συνέχεια, μπορείτε να σχεδιάσετε ένα γεμάτο (filled) ορθογώνιο παραλληλόγραμμο ως εξής: (Ε12) 6
7 // χρώμα γεμίσματος για τις επόμενες ενέργειες, // έστω ότι η μεταβλητή drawcolor περιέχει ένα string // με την πειργραφή του χρώματος, π.χ. red context.fillstyle = drawcolor; // δημιουργία παραλληλογράμμου, έστω ότι οι μεταβλητές // startx, starty, width, height περιέχουν ακέραιες τιμές context.fillrect(startx,starty,width,height); Η σχεδίαση ενός κύκλου είναι λίγο πιο περίπλοκη: πρέπει πρώτα να δημιουργήσετε ένα καμπύλο μονοπάτι (path) και στη συνέχεια να ζητήσετε την εμφάνισή του με γέμισμα: // χρώμα γεμίσματος για τις επόμενες ενέργειες context.fillstyle = drawcolor; // έναρξη path context.beginpath(); // προσθήκη στο path καμπύλης με κέντρο τα tx,ty (ακέραιοι), // ακτίνα radius (ακέραια τιμή), αρχική γωνία από τον άξονα x, // τελική γωνία (σε ακτίνια, στο παράδειγμα 2π). // Η τελευταία παράμετρος δείχνει αν η καμπύλη θα διαγραφεί // στη φορά των δεικτών του ρολογιού (false) ή // αντίστροφα (true). context.arc(tx,ty,radius,0,2*math.pi,true); // τέλος path context.closepath(); // εμφάνιση και γέμισμα path context.fill(); Τέλος, για να σχεδιάσετε κείμενο: // χρώμα γεμίσματος για τις επόμενες ενέργειες context.fillstyle = drawcolor; // font για σχεδίαση context.font = "bold 5em sans-serif"; // εμφάνιση κειμένου με γέμισμα, text είναι ένα string context.filltext(text,tx,ty); (Ε12) 7
8 Β.3. Αποθήκευση περιεχομένου στοιχείου <canvas>. Μπορείτε να μετατρέψετε σε εικόνα, να δείτε στον browser και στη συνέχεια να αποθηκεύσετε το περιεχόμενο του στοιχείου <canvas> ως εξής: // ανάκτηση canvas var canvas = document.getelementbyid("testcanvas"); // μετατροπή σε εικόνα (data URL) var imgdata = canvas.todataurl("image/png"); // μετάβαση στην εικόνα window.location = imgdata; (Ε12) 8
9 Παράρτημα Γ: Φόρμες HTML και JavaScript Στο σημερινό εργαστήριο θα δουλέψετε με μια φόρμα HTML μέσω της JavaScript και μόνο. Γ.1. Φόρμα HTML χωρίς αποστολή δεδομένων στον web-server. Εισάγετε τη φόρμα (form) και τα στοιχεία της (select, input κλπ) όπως γνωρίζετε από τα προηγούμενα εργαστήρια. Οι διαφορές είναι οι εξής: Δεν θα βάλετε τις ιδιότητες method και action στην ετικέτα του form (εφόσον δεν στέλνετε δεδομένα). Φροντίστε κάθε στοιχείο εισόδου (select, input κλπ) να έχει ένα ξεχωριστό όνομα, μέσω τις ιδιότητας id. Το id αυτό θα χρησιμοποιηθεί στην JavaScript για να επιλέξετε το συγκεκριμένο στοιχείο. Για να υλοποιήσετε το κουμπί της φόρμας, χρησιμοποιήστε το στοιχείο button, όπως στο εξής παράδειγμα: <input id="drawbutton" type="button" value="draw!"> Δηλώνοντας type="button" παίρνετε ένα κουμπί που δεν κάνει τίποτα (εκτός κι αν φροντίσετε διαφορετικά μέσω JavaScript!). Γ.2. Συναρτήσεις χειρισμού γεγονότων (event handlers). Κάθε στοιχείο εισόδου της φόρμας δημιουργεί διάφορα γεγονότα, ανάλογα με το αν ο χρήστης το επιλέγει, αλλάζει το περιεχόμενό του ή πιέζει το ποντίκι πάνω του. Στο σημερινό εργαστήριο θα χρειαστείτε το εξής: button στοιχείο εισόδου γεγονός (event) onclick όταν ο χρήστης πιέζει το κουμπί Θα πρέπει να εισάγετε μια συνάρτηση χειρισμού γεγονότος, π.χ.: function drawbuttonhandler() { // εδώ γράφετε τις λειτουργίες που θέλετε να γίνουν // μόλις συμβεί το γεγονός } και στη συνέχεια, μέσα στην αρχικοποίηση του window.onload να συνδέσετε το στοιχείο εισόδου που θέλετε με τη συνάρτηση αυτή, π.χ.: (Ε12) 9
10 window.onload = function() { // επιλέγουμε πρώτα το στοιχείο εισόδου, μέσω του id του var drawbutton = document.getelementbyid("drawbutton"); // στη συνέχεια συνδέουμε τη συνάρτηση χειρισμού στο γεγονός // onclick drawbutton.onclick = drawbuttonhandler; }; Στο προηγούμενο παράδειγμα, παρατηρήστε την πολύ σημαντική μέθοδο getelementbyid() του αντικειμένου document. Η μέθοδος αυτή δέχεται ως όρισμα το όνομα (id) ενός στοιχείου HTML και επιστρέφει το αντίστοιχο αντικείμενο της JavaScript που το αντιπροσωπεύει. Γ.3. Ανάκτηση τιμών από στοιχεία εισόδου φόρμας HTML. Ανάκτηση τιμής από στοιχείο select Παράδειγμα: // ανάκτηση αντικειμένου Javascript του στοιχείου var drawcolorselect = document.getelementbyid("drawcolor"); // ανάκτηση του αριθμού (index) της τρέχουσας επιλογής var sel = drawcolorselect.selectedindex // ανάκτηση της τιμής της τρέχουσας επιλογής var drawcolor = drawcolorselect[sel].value; Ανάκτηση τιμής από πλαίσιο κειμένου Παράδειγμα: // ανάκτηση αντικειμένου Javascript του στοιχείου var drawtextbox = document.getelementbyid("drawtext"); // ανάκτηση του τρέχοντος κειμένου var text = drawtextbox.value; (Ε12) 10
Παράρτημα A: PHP, HTML φόρμες και το πρωτόκολλο HTTP.
Εργαστήριο #5 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Θα πρέπει να ξέρετε να εισάγετε ένα βασικό πρόγραμμα PHP μέσα σε μια ιστοσελίδα, τη χρήση της echo και τον χειρισμό απλών μεταβλητών
Παιχνίδια σε Javascript
Παιχνίδια σε Javascript Μάθημα 1ο Μια Γρήγορη Εισαγωγή στη Γλώσσα Τα Εργαλεία Την Javascript μπορούμε (όπως και την HTML) να τη γράψουμε σε ένα απλό συντάκτη κειμένου, ή σε ένα περιβάλλον όπως το Bluefish
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διαβάστε στο Παράρτημα Α.1 πώς θα γράψετε ένα πρόγραμμα PHP για την παροχή δεδομένων σε μορφή διαφορετική από την HTML.
Εργαστήριο #13 Από τα προηγούμενα εργαστήρια: Θα πρέπει να έχετε ολοκληρώσει το 11 ο (προσπέλαση βάσης δεδομένων μέσω PHP και 12 ο εργαστήριο (βασικές τεχνικές JavaScript στον browser). Οδηγίες Στο τελευταίο
1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα
1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα 1. Σύστημα Συντεταγμένων Το σύστημα συντεταγμένων που έχουμε συνηθίσει από το σχολείο τοποθετούσε το σημείο (0,0) στο σημείο τομής των δυο αξόνων Χ και Υ.
4 ο Εργαστήριο Τυχαίοι Αριθμοί, Μεταβλητές Συστήματος
4 ο Εργαστήριο Τυχαίοι Αριθμοί, Μεταβλητές Συστήματος Μεταβλητές Συστήματος Η Processing χρησιμοποιεί κάποιες μεταβλητές συστήματος, όπως τις ονομάζουμε, για να μπορούμε να παίρνουμε πληροφορίες από το
Javascript events. part 01
Javascript events part 01 Οδηγούμενη από γεγονότα (event-driven) Οδηγούμενες από γεγονότα ονομάζονται οι γλώσσες προγραμματισμού που η ροή του προγράμματος μπορεί να αλλάξει από γεγονότα. Η javascript
Δυναμικές Ιστοσελίδες Εισαγωγή στην Javascript για προγραμματισμό στην πλευρά του client
ΕΣΔ 516 Τεχνολογίες Διαδικτύου Δυναμικές Ιστοσελίδες Εισαγωγή στην Javascript για προγραμματισμό στην πλευρά του client Περιεχόμενα Περιεχόμενα Javascript και HTML Βασική σύνταξη Μεταβλητές Τελεστές Συναρτήσεις
JAVASCRIPT EVENTS. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
JAVASCRIPT EVENTS Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες
Οδηγίες Ακολουθήστε τα παρακάτω βήματα. Βεβαιωθείτε ότι το πρόγραμμά σας δουλεύει σωστά σε κάθε βήμα, πριν προχωρήσετε στο επόμενο.
Εργαστήριο #11 Από τα προηγούμενα εργαστήρια: Το εργαστήριο αυτό είναι συνέχεια του 10 ου, το οποίο θα πρέπει να έχετε ολοκληρώσει (τουλάχιστον χωρίς τη μορφοποίηση!). Θα χρειαστείτε επίσης ορισμένες από
Σημειώσεις D3. Προφανώς εάν προσθέταμε μία ή περισσότερες παραγράφους, πριν το script, θα άλλαζε το text στην πρώτη.
Σημειώσεις D3 Είδαμε ότι το D3 είναι μία JavaScript βιβλιοθήκη που μας επιτρέπει να επεξεργαζόμαστε δυναμικά στοιχεία του DOM. Το D3 δίνει την δυνατότητα στον προγραμματιστή να επιλέγει πολλά στοιχεία
SVG Εργαστήριο 1. Εισαγωγή στα διανυσματικά γραφικά SVG
SVG Εργαστήριο 1. Εισαγωγή στα διανυσματικά γραφικά SVG Χρήση SVG Τα SVG γραφικά, Scalable Vector Graphics, αναφέρονται σε διανυσματικά γραφικά που μένουν αναλοίωτα σε οποιαδήποτε αλλαγή των διαστάσεών
21. ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ 4 - ΔΗΜΙΟΥΡΓΩΝΤΑΣ ΜΕ ΤΟ BYOB BYOB. Αλγόριθμος Διαδικασία Παράμετροι
21. ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ 4 - ΔΗΜΙΟΥΡΓΩΝΤΑΣ ΜΕ ΤΟ BYOB BYOB Αλγόριθμος Διαδικασία Παράμετροι Τι είναι Αλγόριθμος; Οι οδηγίες που δίνουμε με λογική σειρά, ώστε να εκτελέσουμε μια διαδικασία ή να επιλύσουμε ένα
Γραφικά υπολογιστών Εργαστήριο 10 Εισαγωγή στα Sprites
Γραφικά υπολογιστών Εργαστήριο 10 Εισαγωγή στα Sprites Σκοπός της 10ης άσκησης είναι να μάθουμε να χρησιμοποιούμε sprites και να φτιάξουμε ένα παιχνίδι που χρησιμοποιεί συγκρούσεις. Θα δούμε επίσης μερικά
> μεγαλύτερο <= μικρότερο ή ίσο < μικρότερο == ισότητα >= μεγαλύτερο ή ίσο!= διαφορετικό
5 ο Εργαστήριο Λογικοί Τελεστές, Δομές Ελέγχου Λογικοί Τελεστές > μεγαλύτερο = μεγαλύτερο ή ίσο!= διαφορετικό Οι λογικοί τελεστές χρησιμοποιούνται για να ελέγξουμε
3 ο Εργαστήριο Μεταβλητές, Τελεστές
3 ο Εργαστήριο Μεταβλητές, Τελεστές Μια μεταβλητή έχει ένα όνομα και ουσιαστικά είναι ένας δείκτης σε μια συγκεκριμένη θέση στη μνήμη του υπολογιστή. Στη θέση μνήμης στην οποία δείχνει μια μεταβλητή αποθηκεύονται
Συνοπτικό εγχειρίδιο χρήσης του Microsoft Visual Studio 2010
Τμήμα Πληροφορικής & Επικοινωνιών Τομέας Υπολογιστικών Τεχνικών & Συστημάτων Συνοπτικό εγχειρίδιο χρήσης του Microsoft Visual Studio 2010 Ιωάννης Γεωργουδάκης - Πάρις Μαστοροκώστας Σεπτέμβριος 2011 ΠΕΡΙΕΧΟΜΕΝΑ
Εργαστήριο #10 (Ε10) 1
Εργαστήριο #10 Από τα προηγούμενα εργαστήρια......θα χρειαστείτε ορισμένες από τις οδηγίες μορφοποίησης CSS (ανατρέξτε στις εκφωνήσεις του 8 ου και 9 ου εργαστηρίου).! Οδηγίες Στη δυναμική δημιουργία ιστοσελίδων
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου Ενότητα: ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ Νο 11 Δρ. Μηνάς Δασυγένης mdasyg@ieee.org Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Εργαστήριο Ψηφιακών Συστημάτων και
Δημιουργώντας μια εφαρμογή ζωγραφικής. 2 η Εργασία
Δημιουργώντας μια εφαρμογή ζωγραφικής 2 η Εργασία Απαιτήσεις 1. Σύνδεση στο Διαδίκτυο (διότι οι εφαρμογές δημιουργούνται online) 2. Εγκατεστημένος ο Browser Google Chrome 3. Υπαρκτός λογαριασμός Gmail
Γ3.3.Μ7 ΕΠΑΝΆΛΗΨΗ ΜΈΡΟΣ Α: ΈΝΝΟΙΕΣ ΤΙ ΕΊΝΑΙ Η VISUAL BASIC ΤΙ ΜΠΟΡΟΎΜΕ ΝΑ ΚΆΝΟΥΜΕ ΜΕ ΤΗ VISUAL BASIC ΑΝΤΙΚΕΊΜΕΝΑ: ΦΌΡΜΑ ΚΑΙ ΧΕΙΡΙΣΤΉΡΙΑ ΕΤΙΚΈΤΑ LABEL
Γ3.3.Μ7 ΕΠΑΝΆΛΗΨΗ ΜΈΡΟΣ Α: ΈΝΝΟΙΕΣ ΤΙ ΕΊΝΑΙ Η VISUAL BASIC Η Visual Basic είναι μια γλώσσα προγραμματισμού οδηγούμενη από συμβάντα που έχει ένα ολοκληρωμένο περιβάλλον ανάπτυξης Έχει δημιουργηθεί από τη
TO ΥΠΟΠΡΟΓΡΑΜΜΑ ΣΥΝΑΡΤΗΣΗ
Μάθημα 7 - Υποπρογράμματα Εργαστήριο 11 Ο TO ΥΠΟΠΡΟΓΡΑΜΜΑ ΣΥΝΑΡΤΗΣΗ Βασικές Έννοιες: Υποπρόγραμμα, Ανάλυση προβλήματος, top down σχεδίαση, Συνάρτηση, Διαδικασία, Παράμετρος, Κλήση συνάρτησης, Μετάβαση
ΠΛΗΡΟΦΟΡΙΚΗ Ι Εργαστήριο 1 MATLAB ΠΛΗΡΟΦΟΡΙΚΗ Ι ΕΡΓΑΣΤΗΡΙΟ 1. Θέμα εργαστηρίου: Εισαγωγή στο MATLAB και στο Octave
ΠΛΗΡΟΦΟΡΙΚΗ Ι ΕΡΓΑΣΤΗΡΙΟ 1 Θέμα εργαστηρίου: Εισαγωγή στο MATLAB και στο Octave Περιεχόμενο εργαστηρίου: - Το περιβάλλον ανάπτυξης προγραμμάτων Octave - Διαδικασία ανάπτυξης προγραμμάτων MATLAB - Απλά
Εισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην Python
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην Python Β Μέρος Δομή Ελέγχου if-elif-else Επαναληπτική Δομή Ελέγχου while Επαναληπτική Δομή Ελέγχου for Αλληλεπίδραση χρήστη-προγράμματος Συναρτήσεις Η δομή
Το σκηνικό μας είναι πλέον έτοιμο για εισάγουμε τα υπόλοιπα αντικείμενα του έργου μας.
Εισαγωγή έτοιμου σκηνικού Όπως είδαμε και στο προηγούμενο κεφάλαιο, το Scratch παρέχει επίσης μία πληθώρα από έτοιμα σκηνικά. Για να εισάγουμε ένα έτοιμο σκηνικό, πηγαίνουμε στην καρτέλα Υπόβαθρα του σκηνικού
Περιεχόμενα. Πρόλογος...11
Περιεχόμενα Πρόλογος...11 Κεφάλαιο 1: Εισαγωγή...13 Η ιστορία της JavaScript...13 Τι είναι η JavaScript...15 Διαφορά μεταξύ σεναρίου και προγράμματος...16 Δυνατότητες και περιορισμοί της JavaScript...16
Β. Εισαγωγή στον Προγραμματισμό Η/Υ με την JavaScript
Β. Εισαγωγή στον Προγραμματισμό Η/Υ με την JavaScript Β.1 Τύποι Δεδομένων Όλες οι γλώσσες προγραμματισμού (πρέπει να) υποστηρίζουν πέντε (5) πρωταρχικούς τύπους δεδομένων: char (character) int (integer)
JAVASCRIPT 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
JAVASCRIPT 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες
Πρακτική εφαρμογή στην ειδικότητα: Λογισμικό για τη δημιουργία εργασίας εξαμήνου
Στο σύντομο αυτό εγχειρίδιο, θα μάθουμε πώς μπορούμε να χειριστούμε δυναμικά στοιχεία (dynamic components) και να χρησιμοποιήσουμε το εργαλείο Follow στο περιβάλλον Google SketchUp. Ας ξεκινήσουμε λοιπόν!
1. Απαιτήσεις εργασίας
ΠΑΝΕΠΙΣΤΗΜΙΟ ΑΙΓΑΙΟΥ Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 2 η Εργασία στο μάθημα «Δικτυακά Πολυμέσα Ι»: «Δημιουργία φόρμας για καταχώρηση στοιχείων με HTML - Javascript» Ημερομηνία παράδοσης:
Εισαγωγή στην PHP. ΕΣΔ 516 Τεχνολογίες Διαδικτύου. Περιεχόμενα. Περιεχόμενα. ΕΣ 516: Τεχνολογίες ιαδικτύου. ΕΣ 516: Τεχνολογίες ιαδικτύου
ΕΣΔ 516 Τεχνολογίες Διαδικτύου Εισαγωγή στην PHP Περιεχόμενα Περιεχόμενα PHP και HTML Βασική σύνταξη Μεταβλητές Τελεστές Συναρτήσεις Παράδειγματα 1 Βιβλιογραφία Ενότητας Βιβλιογραφία [Lane 2004]: Chapter
Στοιχεία Προγραμματισμού Σε Γραφικό Περιβάλλον Φύλλο εργασίας 1 ο
Τετάρτη, 30 Οκτωβρίου 2013 Στοιχεία Προγραμματισμού Σε Γραφικό Περιβάλλον Φύλλο εργασίας 1 ο Λύστε στο Visual Basic Express 2010 τις παρακάτω ασκήσεις: 1. Να δημιουργήσετε ένα νέο Project του είδους Console
Master Mind εφαρμογή στη γλώσσα προγραμματισμού C
Master Mind εφαρμογή στη γλώσσα προγραμματισμού C Φεβρουάριος/Μάρτιος 2013 v. 0.1 Master-mind: κανόνες παιχνιδιού Στο master mind χρειάζεται να παράγονται κάθε φορά 4 τυχαία σύμβολα από ένα πλήθος 6 διαφορετικών
App Inventor 3ο Μάθημα (Ζάρια - επέκταση)
App Inventor 3ο Μάθημα (Ζάρια - επέκταση) Μεταβλητές Δομή επιλογής If then Λογικές συνθήκες Στο μάθημα αυτό θα επεκτείνουμε την εφαρμογή ζάρια που αναπτύξαμε στο πρώτο μάθημα ώστε να εμφανίζει μήνυμα επιτυχίας
Εργαστήριο Δομημένος Προγραμματισμός (C#) Τμήμα Μηχανολογίας Νικόλαος Ζ. Ζάχαρης Καθηγητής Εφαρμογών
Εργαστήριο Δομημένος Προγραμματισμός (C#) Τμήμα Μηχανολογίας Νικόλαος Ζ. Ζάχαρης Καθηγητής Εφαρμογών Σκοπός Να καταλάβουν την διαφορά ανάμεσα σε τοπικές και καθολικές μεταβλητές. Nα κάνουν αποσφαλμάτωση
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading
Προγραμματισμός Υπολογιστών & Εφαρμογές Python. Κ.Π. Γιαλούρης
Προγραμματισμός Υπολογιστών & Κ.Π. Γιαλούρης Στόχοι του σημερινού μαθήματος Εξοικείωση με τα περιβάλλοντα της Python Κατανόηση βασικών εννοιών & τεχνικών Τύπος δεδομένων Μεταβλητή Εντολή ανάθεση τιμής
Οδηγίες για το CABRI - GEOMETRY II Μωυσιάδης Πολυχρόνης - Δόρτσιος Κώστας
Οδηγίες για το CABRI - GEOMETRY II Μωυσιάδης Πολυχρόνης - Δόρτσιος Κώστας Εκτελώντας το πρόγραμμα παίρνουμε ένα παράθυρο εργασίας Γεωμετρικών εφαρμογών. Τα βασικά κουμπιά και τα μενού έχουν την παρακάτω
Δραστηριότητα 1. Προγραμματίζω τον υπολογιστή (10 ώρες).
Προγραμματίζω τον υπολογιστή (10 ώρες). Δραστηριότητα 1 Στόχος της δραστηριότητας είναι να δημιουργήσουμε μια απλή εφαρμογή η οποία θα περιέχει ένα κουμπί και μια εικόνα μιας γάτας. Όταν ο μαθητής πατήσει
Vodafone Business Connect
Vodafone Business Connect Vodafone Business WebHosting Αναλυτικός Οδηγός Χρήσης MySQL Manager Αναλυτικός οδηγός χρήσης: MySQL Manager Vodafone Business Connect - Υπηρεσίες φιλοξενίας εταιρικού e-mail &
ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ A.7.M21 Προγραμματίζοντας με το App Inventor Εισαγωγή
ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ A.7.M21 Προγραμματίζοντας με το App Inventor Εισαγωγή Τι θα μάθουμε σήμερα: Το περιβάλλον εργασίας του App Inventor Να χρησιμοποιούμε τα χειριστήρια (γραφικά αντικείμενα) button, label και
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία
Εργαστήριο 1-1 η Άσκηση - Ανάλυση
Εργαστήριο 1-1 η Άσκηση - Ανάλυση Εκφώνηση: Δημιουργείστε εφαρμογή σε Java Swing με χρήση του IDE NetBeans όπου θα παρουσιάζεται ποιο κουμπί πατήθηκε. Η εφαρμογή θα μοιάζει ως εξής: Πρώτο Βήμα: Αρχική
<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.
HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των
Δημοσίευση στο Διαδίκτυο
ΕΣΔ200 Δημιουργία Περιεχομένου ΙI Δημοσίευση στο Διαδίκτυο Περιεχόμενα - Βιβλιογραφία Ενότητας Περιεχόμενα Εισαγωγή Δημοσίευση μιας ταινίας στο παγκόσμιο ιστό Βασικά στοιχεία HTML Τεχνικές δημιουργίας
Εργαστήριο 2 - Άσκηση - Ανάλυση
Εργαστήριο 2 - Άσκηση - Ανάλυση Εκφώνηση: Δημιουργείστε την εφαρμογή Αριθμήτηριο σε Java Swing με χρήση NetBeans ακολουθώντας τις παρακάτω οδηγίες. 1. Η εφαρμογή θα σχεδιασθεί σε ένα εξωτερικό υποδοχέα
ΜΕΡΟΣ ΠΡΩΤΟ: Θεωρητική Προσέγγιση...15
ΠΕΡΙΕΧΟΜΕΝΑ Πρόλογος του συγγραφέα...11 Πρόλογος του καθηγητή Γεωργίου Δουκίδη...13 ΜΕΡΟΣ ΠΡΩΤΟ: Θεωρητική Προσέγγιση...15 ΚΕΦΑΛΑΙΟ 1. Η ΕΠΙΧΕΙΡΗΣΗ...17 Ορισμός της έννοιας της επιχείρησης και οι μορφές
Άσκηση 5 -Δηµιουργία ιστοσελίδων µε HTML µέρος 5 ο
Άσκηση 5 -Δηµιουργία ιστοσελίδων µε HTML µέρος 5 ο HTML Φόρµες Για να δηµιουργήσουµε µια φόρµα στην οποία θα γράφουν σχόλια ή παρατηρήσεις οι επισκέπτες των σελίδων µας, χρειαζόµαστε την ετικέτα .
ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΙΑΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ
ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΙΑΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ ΑΝΑΠΤΥΞΗ ΚΑΙ ΣΧΕΔΙΑΣΗ ΛΟΓΙΣΜΙΚΟΥ Η γλώσσα προγραμματισμού C ΕΡΓΑΣΤΗΡΙΟ 2: Εκφράσεις, πίνακες και βρόχοι 14 Απριλίου 2016 Το σημερινό εργαστήριο
Πρόσθεση + Αφαίρεση - Πολλαπλασιασμός * Διαίρεση / Πηλίκο \ Υπόλοιπο Δύναμη
Σαχπατζίδης Αβραάμ Καθηγητής Πληροφορικής Π.Ε 20 Master of Arts (M.A) in "Gender, New Forms of Education, New Forms of Employment and New Technologies in the Information Age". Μαθηματικές Πράξεις στην
ΠΑΝΕΠΙΣΤΗΜΙΟ AΙΓΑIΟΥ & ΑΕΙ ΠΕΙΡΑΙΑ Τ.Τ. Τμήματα Ναυτιλίας και Επιχειρηματικών Υπηρεσιών & Μηχ. Αυτοματισμού ΤΕ. Εισαγωγή στη Python
ΠΑΝΕΠΙΣΤΗΜΙΟ AΙΓΑIΟΥ & ΑΕΙ ΠΕΙΡΑΙΑ Τ.Τ. Τμήματα Ναυτιλίας και Επιχειρηματικών Υπηρεσιών & Μηχ. Αυτοματισμού ΤΕ ΠΛΗΡΟΦΟΡΙΚΗ ΤΕΧΝΟΛΟΓΙΑ ΚΑΙ ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ Η/Υ Εισαγωγή στη Python Νικόλαος Ζ. Ζάχαρης Αναπληρωτής
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:
ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΙΑΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ
ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΙΑΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ ΑΝΑΠΤΥΞΗ ΚΑΙ ΣΧΕΔΙΑΣΗ ΛΟΓΙΣΜΙΚΟΥ Η γλώσσα προγραμματισμού C ΕΡΓΑΣΤΗΡΙΟ 3: Πίνακες, βρόχοι, συναρτήσεις 1 Ιουνίου 2017 Το σημερινό εργαστήριο
Σενάριο 18: Ραβδογράμματα Πληθυσμού
Σενάριο 18: Ραβδογράμματα Πληθυσμού Φύλλο Εργασίας Τίτλος: Ραβδογράμματα Πληθυσμού Γνωστικό Αντικείμενο: Εφαρμογές Πληροφορικής-Υπολογιστών Διδακτική Ενότητα: Διερευνώ - Δημιουργώ Ανακαλύπτω, Συνθετικές
DOM. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
DOM Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative
Δικτυακά Πολυμέσα Ι: 2 η Εργασία. Να δημιουργήσετε μια HTML σελίδα η οποία να περιέχει μία φόρμα που να μοιάζει με αυτή της παρακάτω εικόνας:
2 η ΕΡΓΑΣΙΑ: ΥΠΟΛΟΓΙΣΜΟΣ ΧΙΛΙΟΜΕΤΡΙΚΩΝ ΑΠΟΣΤΑΣΕΩΝ ΜΕ JAVASCRIPT Ημερομηνία Παράδοσης: Παρασκευή 15/1/2010 (Η εργασία θα γίνει σε ομάδες των 2 ατόμων!!) 1. Απαιτήσεις εργασίας Να δημιουργήσετε μια HTML
«Αβάκιο» Οδηγός χρήσης Μικρόκοσμου που αποτελείται από τις ψηφίδες Καμβάς, Χελώνα, Γλώσσα, Μεταβολέας, Χρώματα.
«Αβάκιο» Οδηγός χρήσης Μικρόκοσμου που αποτελείται από τις ψηφίδες Καμβάς, Χελώνα, Γλώσσα, Μεταβολέας, Χρώματα. Πώς θα δουλέψεις με το Χελωνόκοσμο την πρώτη φορά 1. Θα χρησιμοποιήσεις το αριστερό πλήκτρο
Ας μετονομάσουμε τη γάτα που εμφανίζεται μόλις ανοίγουμε το Scratch. Επιλέγουμε το εικονίδιο Μορφή1 που βρίσκεται στη λίστα αντικειμένων.
Σχεδιάζοντας αντικείμενα Εισαγωγή στο περιβάλλον των αντικειμένων Όπως συζητήσαμε και στο προηγούμενο κεφάλαιο, τα αντικείμενα στο Scratch αποτελούν τους πρωταγωνιστές των έργων μας. Το πρώτο βήμα κατά
Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).
Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Εφαρμοσμένη Πληροφορική ΙΙ (Θ) Είσοδος/Έξοδος Μεταβλητές Τύποι Μεταβλητών Τελεστές και Προτεραιότητα Μετατροπές Μεταξύ Τύπων
Εφαρμοσμένη Πληροφορική ΙΙ (Θ) Είσοδος/Έξοδος Μεταβλητές Τύποι Μεταβλητών Τελεστές και Προτεραιότητα Μετατροπές Μεταξύ Τύπων 1 Είσοδος/Έξοδος Είσοδος/Έξοδος ανάλογα με τον τύπο του προγράμματος Πρόγραμμα
Περιεχόμενα. Λίγα λόγια από το συγγραφέα... 7
Περιεχόμενα Λίγα λόγια από το συγγραφέα... 7 Μέρος 1 1 Βασικοί όροι... 11 2 Βασική δομή κώδικα HTML... 25 3 Μορφοποίηση κειμένου... 39 4 Μορφοποίηση παραγράφων... 51 5 Εισαγωγή εικόνας... 63 6 Λίστες με
Εργαστήριο 8. Προγραμματιστικές Εφαρμογές στο Διαδίκτυο
Εργαστήριο 8 Προγραμματιστικές Εφαρμογές στο Διαδίκτυο Στόχος Στόχος του εργαστηρίου είναι η εκμάθηση των βασικών προγραμματιστικών δομών της γλώσσας PHP και η δημιουργία φορμών για την επεξεργασία υποβαλλόμενων
App Inventor 5ο Μάθημα (Κορώνα γράμματα - επέκταση)
App Inventor 5ο Μάθημα (Κορώνα γράμματα - επέκταση) Λογικός τελεστής not Δομή επιλογής If then else Λογικές μεταβλητές Animation Θα επεκτείνουμε την εφαρμογή Κορώνα Γράμματα που δόθηκε σαν δραστηριότητα
Στην τεχνολογία των CSS, οι κανόνες στυλ (style
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ
App Inventor. Εφαρμογή 7 η. Υπολογισμός Μέσου όρου μαθημάτων
App Inventor Εφαρμογή 7 η Υπολογισμός Μέσου όρου μαθημάτων Εφαρμογή «Υπολογισμός Μέσου όρου μαθημάτων»: Ακολουθώντας τα βήματα αυτού του φύλλου εργασίας, θα αναπτύξουμε σταδιακά μια απλή εφαρμογή για το
Αυτόνομοι Πράκτορες. ΝΑΟ Μουσικός
Αυτόνομοι Πράκτορες ΝΑΟ Μουσικός Καρατζαφέρης Ευστάθιος Αλέξανδρος 2007 030 046 Πολυτεχνείο Κρήτης Σύντομη Περιγραφή Στόχος της εργασίας μας είναι η υλοποίηση της συμπεριφοράς αλλα και της λειτουργικότητας
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε
Create Sprite at Runtime
Create Sprite at Runtime (with ActionScript 3.0) Free Flash Demos Tested on Adobe CS4 Το σενάριο: Να φτιάξεις ένα sprite (που στον «μουσαμά» του να υπάρχει μια ζωγραφιά, π.χ. ένα τετράγωνο). Αυτό να το
Γραφικά υπολογιστών Εργαστήριο 4 Εισαγωγή στις λίστες
Γραφικά υπολογιστών Εργαστήριο 4 Εισαγωγή στις λίστες Σκοπός της 3ης άσκησης είναι να μάθουμε να φτιάχνουμε και να προσπελαύνουμε λίστες, να δούμε τι διαφορά έχουν από τα tuples και επίσης πώς μπορούμε
Αντικειμενοστρεφής Προγραμματισμός -Python. Κ.Π. Γιαλούρης
Κ.Π. Γιαλούρης Στόχοι του σημερινού μαθήματος Εξοικείωση με τα περιβάλλοντα της Python Κατανόηση βασικών εννοιών & τεχνικών Τύπος δεδομένων Μεταβλητή Εντολή ανάθεση τιμής / εντολή αντικατάστασης Εισαγωγή
A7.2 Δημιουργία Απλής Γραφικής Εφαρμογής σε Περιβάλλον Scratch
A7.2 Δημιουργία Απλής Γραφικής Εφαρμογής σε Περιβάλλον Scratch Τι θα μάθουμε σήμερα: Να ενεργοποιούμε το λογισμικό Scratch Να αναγνωρίζουμε τα κύρια μέρη του περιβάλλοντος του Scratch Να δημιουργούμε/εισάγουμε/τροποποιούμε
6 ο Εργαστήριο Σχεδιάζοντας σχήματα από σημεία κορυφών, Θόρυβος-Τυχαίοι Αριθμοί (συνέχεια)
6 ο Εργαστήριο Σχεδιάζοντας σχήματα από σημεία κορυφών, Θόρυβος-Τυχαίοι Αριθμοί (συνέχεια) Σχεδιάζοντας σχήματα από σημεία κορυφών Με nofill() δηλώνουμε ότι το σχήμα δεν θα έχει γέμισμα με χρώμα Η beginshape()
Λίγα λόγια από το συγγραφέα Κεφάλαιο 1: Βάσεις δεδομένων και Microsoft Access Κεφάλαιο 2: Microsoft Access
Περιεχόμενα Λίγα λόγια από το συγγραφέα... 7 Κεφάλαιο 1: Βάσεις δεδομένων και Microsoft Access... 9 Κεφάλαιο 2: Microsoft Access 2002... 20 Κεφάλαιο 3: Το σύστημα Βοήθειας του Microsoft Office ΧΡ... 36
ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ Η/Υ Ακαδημαϊκό έτος 2001-2002 ΤΕΤΡΑΔΙΟ ΕΡΓΑΣΤΗΡΙΟΥ #4
ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ Η/Υ Ακαδημαϊκό έτος 2001-2002 ΤΕΤΡΑΔΙΟ ΕΡΓΑΣΤΗΡΙΟΥ #4 «Προγραμματισμός Η/Υ» - Τετράδιο Εργαστηρίου #4 2 Γενικά Στο Τετράδιο #4 του Εργαστηρίου θα αναφερθούμε σε θέματα διαχείρισης πινάκων
ΠΡΟΣΟΧΗ: Οι απαντήσεις πολλαπλής επιλογής µόνο πάνω στο ΦΥΛΛΟ ΑΠΑΝΤΗΣΕΩΝ
ΤΕΙ Σερρών Σχολή Τεχνολογικών Εφαρμογών, Τμήμα Πληροφορικής και Επικοινωνιών Προγραμματιστικές Εφαρμογές στο Διαδίκτυο (Θ) Τελική Εξέταση Διδάσκων: Δ. Κοτζίνος Όνοµα: Α.Μ. : Εξάµηνο : Αίθουσα Έδωσα Project
Λίγα λόγια από το συγγραφέα Κεφάλαιο 1: PowerPoint Κεφάλαιο 2: Εκκίνηση του PowerPoint... 13
Περιεχόμενα Λίγα λόγια από το συγγραφέα... 7 Κεφάλαιο 1: PowerPoint... 9 Κεφάλαιο 2: Εκκίνηση του PowerPoint... 13 Κεφάλαιο 3: Δημιουργία νέας παρουσίασης... 27 Κεφάλαιο 4: Μορφοποίηση κειμένου παρουσίασης...
Βασικές Εντολές MicroWorlds Pro.
Βασικές Εντολές MicroWorlds Pro. 1. μπροστά (μπ) αριθμός Μετακινεί τη χελώνα προς τα εμπρός. π.χ. μπροστά 100 2. πίσω (πι) αριθμός Μετακινεί τη χελώνα προς τα πίσω. π.χ. πι 30 3. δεξιά (δε) αριθμός Στρέφει
Εγχειρίδιο χρήσης Print2PDF σελ. 1 από 32
Πρόγραμμα Print2PDF (Εκτύπωση κειμένου και εικόνων σε αρχεία PDF) Πρόλογος Η εφαρμογή Print2PDF (Print to PDF Εκτύπωση σε αρχεία PDF) σας επιτρέπει να εκτυπώσετε το δικό σας κείμενο πάνω σε ένα έντυπο
Εμφανίζονται 3 επιλογές με 3 εικονίδια, η «ζωγραφική», η «εισαγωγή» και η «κάμερα».
Σχεδιάζοντας ένα σκηνικό Το σκηνικό είναι στην ουσία το φόντο που βρίσκεται στην σκηνή μας το οποίο είναι αρχικά λευκό. Το Scratch μας δίνει τη δυνατότητα να εισάγουμε είτε ένα έτοιμο σκηνικό είτε να ζωγραφίσουμε
Εισαγωγή στην Αριθμητική Ανάλυση
Εισαγωγή στην Αριθμητική Ανάλυση Εισαγωγή στη MATLAB ΔΙΔΑΣΚΩΝ: ΓΕΩΡΓΙΟΣ ΑΚΡΙΒΗΣ ΒΟΗΘΟΙ: ΔΗΜΗΤΡΙΑΔΗΣ ΣΩΚΡΑΤΗΣ, ΣΚΟΡΔΑ ΕΛΕΝΗ E-MAIL: SDIMITRIADIS@CS.UOI.GR, ESKORDA@CS.UOI.GR Τι είναι Matlab Είναι ένα περιβάλλον
TEC510 Ανάπτυξη Δικτυακών Τόπων (Ε εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Γιώργος Μηλιώτης
TEC510 Ανάπτυξη Δικτυακών Τόπων (Ε εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Γιώργος Μηλιώτης Χειμερινό εξάμηνο 2011-2012 Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό
XAMPP Apache MySQL PHP javascript xampp
XAMPP Το xampp είναι ένα δωρεάν πρόγραμμα με το οποίο μπορούμε να κάνουμε εγκατάσταση τον Apache, τη MySQL και την PHP. Apache. Ο Apache είναι ένας Web Server. Είναι δηλαδή πρόγραμμα το οποίο τρέχει μόνιμα
<HTML> <HEAD> <TITLE> <BODY>
ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες
1 η Εργαστηριακή Άσκηση MATLAB Εισαγωγή
ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΗΠΕΙΡΟΥ ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ Τ.Ε. Εργαστήριο Επεξεργασία Εικόνας & Βίντεο 1 η Εργαστηριακή Άσκηση MATLAB Εισαγωγή Νικόλαος Γιαννακέας Άρτα 2018 1 Εισαγωγή Το Matlab
Ετικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον
Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη
Μεθόδων Επίλυσης Προβλημάτων
ΕΠΛ 032.3: 3: Προγραμματισμός Μεθόδων Επίλυσης Προβλημάτων Αχιλλέας Αχιλλέως, Τμήμα Πληροφορικής, Πανεπιστήμιο Κύπρου Email: achilleas@cs.ucy.ac.cy Κεφάλαιο 9 Συναρτήσεις Μέρος II Θέματα ιάλεξης Μη- ομημένος
Λίστες στο Scratch 2.0.
Λίστες στο Scratch 2.0. Σε αρκετές δραστηριότητες μέχρι τώρα χρησιμοποιήσαμε μεταβλητές. Οι μεταβλητές είναι συμβολικά ονόματα που αντιστοιχούν σε θέσεις μνήμης του υπολογιστή. Οι μεταβλητές χρησιμοποιούνται
Δημιουργία και επεξεργασία διανυσματικών επιπέδων στο QGIS
Δημιουργία και επεξεργασία διανυσματικών επιπέδων στο QGIS Δημιουργία επιπέδου σχεδίασης 1. Από το Menu Layer Create Layer New Shapefile Layer δημιουργούμε νέο επίπεδο. Στο παράθυρο που ανοίγει (Εικ. 1)
Εισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην Python
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην Python Python scripts Ένα πρόγραμμα στην Python (συχνά αποκαλείται script) αποτελείται από μία ακολουθία ορισμών και εντολών. H ακολουθία των ορισμών και
1. Απαιτήσεις εργασίας
ΠΑΝΕΠΙΣΤΗΜΙΟ ΑΙΓΑΙΟΥ Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 2 η Εργασία στο μάθημα «Δικτυακά Πολυμέσα Ι»: «Δημιουργία φόρμας για online αίτηση εργασίας με HTML - Javascript» Ημερομηνία παράδοσης:
Εργαστήριο Γραφικών. Βοηθητικό Υλικό για την εκπόνηση των εργασιών Αφορά την 1 η Εργαστηριακή Άσκηση
1 Εργαστήριο Γραφικών Βοηθητικό Υλικό για την εκπόνηση των εργασιών Αφορά την 1 η Εργαστηριακή Άσκηση Μέρος B Σπύρος Συρμακέσης Καθηγητής syrma@teimes.gr Εύη Φαλιάγκα Δρ. Μηχανικός Η/Υ efaliaga@teimes.gr
Εισαγωγή στην PHP. ΕΣΔ 232 Διαχείριση Δεδομένων στη Κοινωνία της Πληροφορίας. Περιεχόμενα. Περιεχόμενα
ΕΣΔ 232 Διαχείριση Δεδομένων στη Κοινωνία της Πληροφορίας Εισαγωγή στην PHP Περιεχόμενα Περιεχόμενα PHP και HTML Βασική σύνταξη Μεταβλητές Τελεστές Συναρτήσεις Παράδειγματα 1 Βιβλιογραφία Ενότητας Βιβλιογραφία
Σχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table.
DreamWeaver - Άσκηση 4η Πίνακες Παρακάτω θα δούμε πως μπορούμε να δημιουργούμε και να επεξεργαζόμαστε πίνακες, μια πολύ βασική δομή. Θα δούμε πως γίνεται εισαγωγή πίνακα, ένωση κελιών του πίνακα, προσθήκη
Ελέγξτε την ταινία σας
Ελέγξτε την ταινία σας Σε αυτές τις ασκήσεις, θα κάνετε εισαγωγή μιας ταινίας και θα χρησιμοποιήσετε τις επιλογές που παρουσιάστηκαν στο μάθημα. Άσκηση 1: Εισαγωγή αρχείου ταινίας 1. Κάντε κλικ στη μικρογραφία
Εργαστήριο Δομημένος Προγραμματισμός (C#) Τμήμα Μηχανολογίας Νικόλαος Ζ. Ζάχαρης Καθηγητής Εφαρμογών
Εργαστήριο Δομημένος Προγραμματισμός (C#) Τμήμα Μηχανολογίας Νικόλαος Ζ. Ζάχαρης Καθηγητής Εφαρμογών Σκοπός Nα κατασκευάσουν πίνακες από δεδομένα. Να κατασκευάσουν συναρτήσεις με πίνακες. Να κάνουν χρήση
ΦΤΙΑΞΕ ΜΟΝΟΣ ΣΟΥ ΤΗ ΔΙΚΗ ΣΟΥ ΙΣΤΟΣΕΛΙΔΑ ΔΩΡΕΑΝ
ΦΤΙΑΞΕ ΜΟΝΟΣ ΣΟΥ ΤΗ ΔΙΚΗ ΣΟΥ ΙΣΤΟΣΕΛΙΔΑ ΔΩΡΕΑΝ Φτιάξε το Site σου σε 5 βήματα!!! Φτιάξτε τώρα μια σύγχρονη ιστοσελίδα με δυνατότητα να την ανανεώνετε μόνοι σας...με τον πιο γρήγορο και εύκολο τρόπο!!!
Mεταγλωττιστές. 4 ο εργαστηριακό μάθημα Λεξική ανάλυση και flex. Θεωρία
Mεταγλωττιστές 4 ο εργαστηριακό μάθημα Λεξική ανάλυση και flex Σκοπός: Το μάθημα αυτό αναφέρεται: στις κανονικές εκφράσεις στην δομή και το περιεχόμενο του αρχείου-εισόδου του flex Γενικά Θεωρία Κατά την
Θέματα Προγραμματισμού Διαδικτύου ~ PHP ~
Θέματα Προγραμματισμού Διαδικτύου ~ PHP ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Server-side programming
Ψευδοκώδικας. November 7, 2011
Ψευδοκώδικας November 7, 2011 Οι γλώσσες τύπου ψευδοκώδικα είναι ένας τρόπος περιγραφής αλγορίθμων. Δεν υπάρχει κανένας τυπικός ορισμός της έννοιας του ψευδοκώδικα όμως είναι κοινός τόπος ότι οποιαδήποτε
5 ο Εργαστήριο Δομές Επανάληψης (συνέχεια)
5 ο Εργαστήριο Δομές Επανάληψης (συνέχεια) Κύκλος 270 ο 3*(π/2) rad (3*HALF_PI) 180 ο π rad (PI) 0 ο 0 rad 360 ο 2π rad (TWO_PI) hyp x opp adj 90 ο π/2 rad (HALF_PI) sin(x) = opp / hyp cos(x) = adj/hyp