Γενικά θέματα ανάπτυξης για τα Windows Vista & Windows 7

Απ: Vista Gadget - Transparent Images Major Problem

KelMan — Fri, 08 Jun 2007 07:38:34 GMT

Φαντάσου ότι έχουμε ένα image 20x20. Μέσα σε αυτό υπάρχει ένα τετράγωνο 5x5, χρώματος κόκκινου και η γύρω περιοχή είναι διαφανής. Εδώ δεν έχουμε alpha blending γιατί κάθε ένα pixel μπορεί να είναι ή κόκκινο ή transparent. Αν όμως εσωτερικά, αντί για τετράγωνο έχουμε κύκλο, με το alpha blending μπορούμε να εξομαλύνουμε το περίγραμμα (και να αποφύγουμε τα "σκαλάκια") βάζοντας τα pixels που είναι στο border του κύκλου να μερικώς διαφανή. Ας πούμε φαντάσου ένα δαχτυλίδι που έχει πλάτος τα τελευταία 3 pixels του κύκλου. Το εσώτερο θα έχει transparency 75%, το επόμενο 50% και το εξώτερο 25%. Δηλαδή τα pixels "σβήνουν" από κόκκινο προς το διαφανές (και όχι από κόκκινο προς κάποιο άλλο χρώμα) και έτσι το μάτι ξεγελιέται. Θα πρέπει λοιπόν να κάνεις διάφορες ρυθμίσεις στα εργαλεία του Photoshop όπως για παράδειγμα να μην έχουν feather. Αν ψάξεις τον όρο στο internet θα βρεις πολλά παραδείγματα. Δες αυτό και κάνε το αντίθετο

Ως προς το positioning, δεν είναι ανάγκη να φτιάξεις όλα τα divs με absolute positioning. Δεδομένου ότι δεν μιλάμε για μεγάλες σελίδες με πολλά elements αλλά για gadgets, το absolute positioning βοηθάει πάρα πολύ. Επίσης, δοκίμασε το Expression Web (μπορείς να βάλεις την trial) που έχει υπέροχη υποστήριξη CSS και θα σε διευκολύνει πολύ. Τέλος, άλλο ένα hint, βάλε το CSS styling σε εξωτερικό αρχείο και όχι inline για να ελέγχεις ποιό εύκολα τη διαδικασία.

Απ: Vista Gadget - Transparent Images Major Problem

Δημήτρης Γκανάτσιος — Fri, 08 Jun 2007 06:44:44 GMT

Να προσθέσω ότι πολλές φορές η sidebar cacheάρει images των gadgets, με συνέπεια να πρέπει να την κλείσεις και να την ξανανοίξεις. Και όχι, η cache της sidebar δεν έχει σχέση με τα Temporary Internet Files του IE (από όσο κατάλαβα, at least).

Απ: Vista Gadget - Transparent Images Major Problem

Δημήτρης Γκανάτσιος — Fri, 08 Jun 2007 06:41:25 GMT

KelMan:

Το background του gadget υποστηρίζει transparency αλλά όχι alpha blending. Αν θέλεις να είναι oval το σχήμα του gadget θα πρέπει να το φτιάξεις έτσι ώστε οι άκρες να μην "σβήνουν" προς το διαφανές. Πάντως, εγώ κατάφερα να μπορώ να φτιάχνω εύκολα το layout χρησιμοποιώντας CSS και absolute positioning και να κάνω preview το layout στον explorer (μέχρι να έρθει η ώρα να βάλω κώδικα τουλάχιστον γιατί μετά...). Αν θες, ρίξε μια ματιά στα Ελληνικά gadgets που έχει στο gallery να πάρεις ιδέες (πχ δες αυτό του In.gr και του Αθηνόραμα)

αν μπορείς να μου εξηγήσεις τη διαφορά μεταξύ του transparency και του alpha blending θα σου ήμουν ευγνώμων Το "να μην σβήνουν προς το διαφανές" ομολογώ πως δεν το κατάλαβα

Βρήκα έναν τρόπο για το layout. Αρχικά κάνω το slicing όπως θα το έκανα κανονικά, σώζω μόνο το HTML output, και μετά σβήνω τα slices και σώζω το png as usual. Το HTML το κάνω paste στο main file του gadget και βάζω για το table background το png που έσωσα. Α ρε μπακάλη Μήτσο

Το absolute positiong δεν μ'αρέσει γενικά και τόσο, σιχαίνομαι να μετράω pixelάκια. Btw, το Visual Studio δεν μου κάνει preview το table background image. Μήπως ξέρει κανείς γιατί;;;

Τα έχω δει, τόσο του Αθηνοράματος, όσο και του in. Στο in, ο τύπος έχει ουσιαστικά ένα main background image στο Body, και από πάνω έχει χώσει ένα table όπου και βάζει τα tags. Αυτό πάω να κάνω, αλλά έστω ότι θέλω ανάλογα με ένα xml content που θα σκάει, να αλλάζω ένα μέρος του image που έχω για background. Και καταλήγω πάλι στο πρόβλημα που ανέφερα στο πρώτο post, ότι δηλαδή δεν παίζουνε τα transparent sliced PNGs

Απ: Vista Gadget - Transparent Images Major Problem

KelMan — Fri, 08 Jun 2007 06:14:19 GMT

Το background του gadget υποστηρίζει transparency αλλά όχι alpha blending. Αν θέλεις να είναι oval το σχήμα του gadget θα πρέπει να το φτιάξεις έτσι ώστε οι άκρες να μην "σβήνουν" προς το διαφανές. Πάντως, εγώ κατάφερα να μπορώ να φτιάχνω εύκολα το layout χρησιμοποιώντας CSS και absolute positioning και να κάνω preview το layout στον explorer (μέχρι να έρθει η ώρα να βάλω κώδικα τουλάχιστον γιατί μετά...). Αν θες, ρίξε μια ματιά στα Ελληνικά gadgets που έχει στο gallery να πάρεις ιδέες (πχ δες αυτό του In.gr και του Αθηνόραμα)

Vista Gadget - Transparent Images Major Problem

Δημήτρης Γκανάτσιος — Fri, 08 Jun 2007 05:49:49 GMT

Καλησπέρα σας. Προσπαθώ να φτιάξω gadget με transparent γραφικά (είτε gif είτε png), εμφανίζονται σωστά άμα γίνουνε render από browser, αλλά όταν τα βάλω σε gadget και το εμφανίσω στην sidebar, τότε τα βλέπω με άσπρο background! Δοκίμασα να παίξω με το

<g:background src="images/myimage.png" />

το οποίο δουλεύει μεν (είτε για png είτε για gif) αλλά πάλι είναι απίστευτα δύσκολο να κατασκευάσω το HTML table με το layout, καθώς λόγω της φύσης του tag, δεν μπορώ να δω το background σε κάποιον editor, παρά μόνο όταν το εμφανίσω στην sidebar. Συν τοις άλλοις έχω και προβλήματα στο z-indexing, καθώς έχω δώσει στο background image z-index:-1 μέσω stylesheet, αλλά και πάλι τα περιεχόμενα των tables εμφανίζονται από κάτω του.

Χρησιμοποιώ τα Photoshop και Imageready για επεξεργασία και slicing.

Any help???

edit: μόλις κατάφερα να βάλω ένα ολόκληρο image για background χρησιμοποιώντας το

αλλά και πάλι θα ήθελα να μπορώ να σχεδιάζω το layout από το imageready, ώστε να μπορώ να κάνω slicing και να επεξεργαστώ το gadget πιο εύκολα

thx