Οπτικός Προγραμματισμός  Προέρχονται από τα sets της Pascal.Ορίζονται ως : typedef Set όνομα τύπου συνόλου Π.χ. typedef set MikroiAkeraioi  Συνήθως συνδυάζονται με Απαριθμητούς τύπους δεδομένων : π.χ. enum TFontStyle { fsBold, fsItalic, fsUnderline, fsStrikeOut }; typedef Set TFontStyles μεταβλητή συνόλου : TfontStyles style;  Για να συμπεριλάβουμε ένα στοιχείο σε ένα σύνολο χρησιμοποιούμε τον τελεστή << π.χ. style = style << fsBold << fsItalic;  Για να εξαιρέσουμε ένα στοιχείο από ένα σύνολο χρησιμοποιούμε τον τελεστή >> π.χ. style = style >> fsBold;  Για να ελέγξουμε άν ένα σύνολο περιέχει ένα στοιχείο χρησιμοποιούμε την μέθοδο Contains : π.χ. if (style.Contains(fsBold)) ……;  Για άδειασμα του συνόλου χρησιμοποιούμε τη μέθοδο Clear. π.χ. style.Clear();

Οπτικός Προγραμματισμός  TabControl : χρησιμοποιείται για δημιουργία διαλόγων με πολλές σελίδες, όπου η κάθε σελίδα περιέχει διαφορετικά components (π.χ. properties).  PageControl : επίσης χρησιμοποιείται για διαλόγους με πολλαπλές σελίδες (κάθε σελίδα είναι ΤΤabsheet object).  ImageList : αποθηκεύει μεγάλο αριθμό από εικόνες στις οποίες μπορούμε να απευθυνόμαστε με α/α. Χρησιμοποιείται για την κατασκευή toolbars.  RichEdit : είναι ένα Edit box που επιτρέπει όμως εισαγωγή κειμένου με παραλλαγές font, και μορφοποίηση παραγράφων.  TrackBar : εμφανίζει ένα μετακινούμενο δείκτη πάνω σε μία διαβαθμισ- μένη μπάρα. Χρησιμοποιείται για καθορισμό ποσοτικών μεγεθών.  ProgressBar : εμφανίζει μία μπάρα προόδου διαδικασιών.  UpDown : αποτελείται από δύο κουμπιά με βελάκια πάνω κάτω και χρησιμοποιείται για αυξομείωση μεγεθών.

Οπτικός Προγραμματισμός  HotKey : χρησιμοποιείται για να αντιστοιχούμε διάφορες ρουτίνες με πατήματα συνδυασμών πλήκτρων.  Animate : αποτελεί ένα component που μπορεί να «παίζει» αρχεία video κωδικοποίησης AVI, χωρίς όμως ήχο (μόνο animation).  DateTimePicker : component για την εισαγωγή ώρας και ημερομηνίας.  MonthCalendar : εντυπωσιακό component που επιτρέπει την επιλογή ημερομηνίας μέσα από μηνιαίο ημερολόγιο.  TreeView : component για εμφάνιση αντικειμένων που έχουν δομή δένδρου (π.χ. κατάλογοι, εγγραφές στο registry κ.λ.π.)  ListView : εμφανίζει μία λίστα αντικειμένων με πολλαπλούς τρόπους (strings, εικονίδια μικρά/μεγάλα, σε στήλες με επικεφαλίδες κ.λ.π.)  HeaderControl : ειδικό component για εμφάνιση γραμμής με επικεφαλίδες στηλών. Χρησιμοποιείται σε συνεργασία με άλλα components (π.χ. ListBox).

Οπτικός Προγραμματισμός  StatusBar : υλοποιεί γραμμές κατάστασης που συνήθως βρίσκονται στο κάτω μέρος του παραθύρου. Έχουν πολλά Panels που εμφανίζουν πληροφορίες σχετικά με την κατάσταση της εφαρμογής (INS,OVR, …)  ToolBar : υλοποιεί μπάρες εργαλείων (κουμπιών). Περιλαμβάνει κουμπιά του τύπου TToolButton αλλά μπορεί να δεχθεί και άλλα components.  CoolBar : περιέχει child components που μπορούν να μετακινούνται και να αυξομειώνονται ανεξάρτητα. Χρησιμοποιείται επίσης μαζί με την κλάση TControlBar ως docking site για toolbars και controls.  PageScroller : μοιάζει με το ScrollBox. Χρησιμοποιείται για τον καθορισμό ενός μικρού χώρου όπως τα toolbars. Αν τα περιεχόμενα του toolbar δεν χωρούν στο παράθυρο τότε εμφανίζονται δύο βελάκια για scrolling του παραθύρου.

Οπτικός Προγραμματισμός  Παράγεται από την κλάση TToolBar. Περιέχει κουμπιά του τύπου TToolButton. Όλα τα κουμπιά έχουν το ίδιο πλάτος και ύψος. Τα κουμπιά αυτόματα δημιουργούν δεύτερη γραμμή αν δεν χωρούν σε μία γραμμή. Μπορούν να χωρίζονται με κενά ή διαχωριστές για ομαδοποίηση. Iδιότητες (Properties) :  ButtonHeight (int) : καθορίζει το ύψος των κουμπιών σε pixels.  ButtonWidth (int) : καθορίζει το πλάτος των κουμπιών σε pixels.  DisabledImages (TImageList) : καθορίζει τα bitmaps που θα εμφανίζονται στα κουμπιά όταν αυτά είναι απενεργοποιημένα (Disabled).  EdgeBorders (set of TEdgeBorder={ebLeft, ebTop, ebRight, ebBottom }): καθορίζει αν θα εμφανίζονται πλαίσια και σε ποιές ακμές (edges).  EdgeInner, EdgeOuter (esNone, esRaised, esLowered) : καθορίζουν την τρισδιάστατη εμφάνιση της μπάρας εργαλείων.

Οπτικός Προγραμματισμός  HotImages (TImageList) : καθορίζει τα bitmaps που θα εμφανίζονται στα κουμπιά όταν περνά από πάνω τους το ποντίκι κατά την εκτέλεση του προγράμματος.  Images (TImageList) : καθορίζει τα bitmaps που θα εμφανίζονται πάνω στα κουμπιά του toolbar. Η αντιστοίχιση γίνεται με Α/Α.  List (bool) : όταν είναι false τα κουμπιά εμφανίζονται με τα εικονίδια κεντραρισμένα και τα captions από κάτω (αν είναι ορατά). Όταν είναι true τότε εμφανίζει τις εικόνες αριστερά και τα captions δεξιά (σαν λίστα).  ShowCaptions (bool) : καθορίζει αν θα εμφανίζονται τα captions των κουμπιών ή όχι.  Wrapable (bool) : όταν είναι true επιτρέπει ώστε τα κουμπιά να σχηματίζουν και δεύτερη γραμμή κουμπιών όταν δεν χωράνε σε μία γραμμή.  ButtonCount (int) : επιστρέφει τον αριθμό των κουμπιών που έχει ένα toolbar.

Οπτικός Προγραμματισμός  Buttons[I] (TToolButton) : πίνακας με τα κουμπιά του toolbar.  Canvas (TCanvas) : επιτρέπει την γραφική σχεδίαση μέσα στο client area του toolbar.  RowCount : επιστρέφει τον αριθμό των γραμμών που καταλαμβάνουν τα κουμπιά του toolbar. Μέθοδοι (Methods) :  ChangeScale() : μεταβάλλει το μέγεθος του toolbar και των κουμπιών του ποσοστιαία.  ClickButton() : εξομοιώνει το πάτημα του πλήκτρου.  WrapButtons() : επαναδιευθετεί τα κουμπιά του toolbar ώστε να χωρούν σε νέο πλάτος και νέο ύψος.

Οπτικός Προγραμματισμός  OnAdnvanceCustomDraw : παράγεται όταν επανασχεδιάζεται το toolbar και χρησιμοποιείται για να σχεδιάζουμε το background. Παράγεται σε αρκετά στάδια του σχεδιασμού και ελέγχοντας το στάδιο μπορούμε να εκτελούμε τον κατάλληλο κώδικα.  OnAdnvanceCustomDrawButton : παράγεται όταν επανασχεδιάζεται κάθε κουμπί του toolbar και χρησιμοποιείται για να σχεδιάζουμε κατά βούληση τα κουμπιά του toolbar. Παράγεται σε πολλά στάδια της σχεδίασης του κάθε κουμπιού.  OnCustomDraw : παράγεται λίγο πριν σχεδιαστεί το background και χρησιμοποιείται για να σχεδιάζουμε εμείς το background κατά βούληση.  OnCustomDrawButton : παράγεται μία φορά λίγο πριν σχεδιαστεί το κάθε κουμπί και χρησιμοποιείται για να σχεδιάζουμε εμείς τα κουμπιά.

Οπτικός Προγραμματισμός  Πρώτα ενσωματώνουμε στη φόρμα μας ένα ToolBar component από την μπάρα εργαλείων Win32. To ToolBar αυτόματα αγκιστρώνεται στο επάνω μέρος του παραθύρου και πιάνει όλο το πλάτος του.  Στη συνέχεια με δεξί κλικ πάνω στο ToolBar και επιλέγοντας “New Button” ή “New Separator” δημιουργούμε τα κουμπιά που θέλουμε με την ομαδοποίηση που θέλουμε.  Στη συνέχεια ενσωματώνουμε στην φόρμα μας ένα ImageList component στο οποίο με διπλό κλικ ανοίγουμε τον ImageList Editor και φορτώνουμε τα bitmaps των κουμπιών προσέχοντας απλά η σειρά φόρτωσης να είναι ίδια με την σειρά των κουμπιών στο ToolBar.

Οπτικός Προγραμματισμός  Τέλος για να αποκτήσουν τα κουμπιά λειτουργικότητα αρκεί επιλέγοντας το καθένα και πηγαίνοντας στην σελίδα Events του Object Inspector να καθορίσουμε συγκεκριμένη ρουτίνα για το OnClick Event (οι ρουτίνες μπορεί να προυπάρχουν αν πρώτα έχει δημιουργηθεί το μενού).  Κατόπιν για να συνδέ- σουμε το ToolBar με το ImageList αρκεί στην ιδιότητα ‘Images’ του Toolbar να επιλέξουμε το όνομα του Image List. Αυτόματα τα bitmaps που φορτώθη- καν στο ImageList εμ- φανίζονται στα κουμπιά του Toolbar.

Οπτικός Προγραμματισμός  Το Toolbar component περιλαμ- βάνει ένα Canvas property μέσω του οποίου μπορούμε να σχεδιά- σουμε πάνω στην επιφάνεια του Toolbar.  Η σχεδίαση πρέπει να γίνεται κάθε φορά που επανασχεδιάζεται το Toolbar και όχι απλά μία φορά στην αρχή (π.χ. OnFormCreate).  Έτσι, θα πρέπει να παγιδεύσουμε το OnCustomDraw event του Toolbar και στον Event handler να εισάγουμε κώδικα που να εμφανίζει τα γραφικά που θέλουμε στο Canvas.

Οπτικός Προγραμματισμός TPicture * SkinImage;.... void __fastcall TForm1::FormCreate(TObject *Sender) { SkinImage = new TPicture; SkinImage->LoadFromFile("clouds.bmp"); } void __fastcall TForm1::ToolBar1CustomDraw(TToolBar *Sender, const TRect &ARect, bool &DefaultDraw) { ToolBar1->Canvas->StretchDraw(ARect, SkinImage->Graphic); }

Οπτικός Προγραμματισμός  Για να αντιστοιχίσετε κουμπιά ενός Toolbar σε επιλογές του μενού καθορίστε την Ιδιότητα “MenuItem” του κάθε κουμπιού.  Για να κάνετε τα κουμπιά να πατιούνται μέσα με το 1ο κλικ και να βγαίνουν έξω με το 2ο : αλλάξτε την Ιδιότητα “Style” του κουμπιού σε “tbsCheck”.  Για να ομαδοποιήσουμε κουμπιά ώστε να συμπεριφέρονται ως “radio buttons” : Μαρκάρουμε τα κουμπιά που θέλουμε και θέτουμε την Ιδιότητα “Style” σε “tbsCheck” καθώς και την ιδιότητα “Grouped” σε “true”. Σημείωση : τα κουμπιά που ανήκουν σε ένα Group θα πρέπει να είναι συνεχή και να μην παρεμβάλλονται ανάμεσα διαχωριστικά ή άλλα components.  Για να μπορούμε ωστόσο να έχουμε όλα τα κουμπιά μίας ομάδας (που λειτουργούν ως radio buttons) σε κατάσταση “Up” θα πρέπει να θέσουμε την Ιδιότητα “AllowAllUp” των κουμπιών σε “true”.

Οπτικός Προγραμματισμός  Εισάγουμε στη φόρμα ένα ControlBar component που παίζει τον ρόλο του docking site. Καθορίζουμε την ιδιότητά Align σε AlTop, ώστε να καταλάβει τον επάνω χώρο του client area και AutoSize σε true, έτσι ώστε να αυξομειώνεται αυτόματα ανάλογα με το αν έχει docked child ή όχι.  Καθορίζουμε την ιδιότητα DragKind του Toolbar σε dkDock (από dkDrag) έτσι ώστε η μετακί- νηση με το ποντίκι να ξεκινά διαδικασία Drag&Dock και το DragMode σε dmAutomatic, ώστε να γίνεται αυτόματα.