Καλώς ορίσατε στο dotNETZone.gr - Σύνδεση | Εγγραφή | Βοήθεια
σε

 

Αρχική σελίδα Ιστολόγια Συζητήσεις Εκθέσεις Φωτογραφιών Αρχειοθήκες

pack() - auto resize για τα dialogs/popup windows

Îåêßíçóå áðü ôï ìÝëïò anjelinio. Τελευταία δημοσίευση από το μέλος anjelinio στις 28-02-2006, 11:50. Υπάρχουν 0 απαντήσεις.
Ταξινόμηση Δημοσιεύσεων: Προηγούμενο Επόμενο
  •  28-02-2006, 11:50 10243

    pack() - auto resize για τα dialogs/popup windows

    Έχει τύχει σε κάποιον απο 'σας να του λείπει τόσο μα τόσο  το pack() του Java Swing ... ?

    Το pack() - για τους αλλόθρησκους - ήταν η μαγική μέθοδος ενός container η οποία έκανε resize το container έτσι ώστε να φαίνονται σωστά όλα τα controls που περιείχε, αλλά όχι περισσότερο ή λιγότερο. Just Right !

    Σε μια εφαρμογή που γράφουμε, πολύ συχνά έχουμε το φαινόμενο ένας διάλογος με fixed size να μη φαίνεται ολόκληρος για τον τάδε ή το δείνα λόγο στους browsers των πελατών. Έτσι, σε μια απέλπιδα προσπάθεια γράφτηκε λίγη JavaScript μπας και το σώσουμε το θέμα γεινικά και όμορφα, και παραθέτω τα αποτελέσματα προς τέρψην των popup ανησυχιών μας :P

            <script language="javascript">
                function pack() {
                    try{
                        var theTable = document.getElementById("Table1");
                       
                        var tWidth = theTable.clientWidth+30;
                        var tHeight = theTable.clientHeight+50;
                       
                        //window.resizeTo(tWidth, tHeight);
                        window.dialogWidth = tWidth+"px";
                        window.dialogHeight = tHeight+"px";
                       
                        //move window to the center of the screen
                        var screenWidth = window.screen.width;
                        var screenHeight = window.screen.height;
                       
                        var dialogWidth = tWidth;
                        var dialogHeight = tHeight;
                       
                        window.dialogLeft = ((screenWidth-dialogWidth)/2)+"px";
                        window.dialogTop = ((screenHeight-dialogHeight)/2)+"px";
                       
                    }catch(e){
                        alert(e);
                    }
                }
               
            </script>

    Το μυστικό είναι πολύ απλό. Όπως θα δείτε στον κώδικα, η JavaScript κοιτάει τα width / height ενός table, και πράττει ανάλογα. Αυτό το table είναι το πρώτο control της σελίδας, και περιέχει τα πάντα μέσα του. Έτσι, το width & height του είναι το total width & height των controls που περιέχει ;) Προσθέτεις μερικά pixels για να  πάρεις  υπ'όψην  toolbars, scrollbars κτλ κτλ... et voila !

    <body bottomMargin="2" bgColor="#e9e8d6" leftMargin="2" topMargin="2" rightMargin="2"
            MS_POSITIONING="GridLayout">
            <form id="Form1" method="post" runat="server">
                <TABLE class="editBack" id="Table1" height="100%" cellSpacing="0" cellPadding="0" width="100%"
                    border="0">
                    <TR height="20"> ... κτλ κτλ

    Παρατήρησα οτι αν καλεστεί η pack() στο onload του body ή του window, κάποιες φορές δεν έπαιζε σωστά, και έκανε resize σε ένα πολύ μικρό μέγεθος. Μετά απο σκέψη, προσθέσαμε το παρακάτω κομματάκι κώδικα στο τέλος της σελίδας, βγάλαμε το onload event και τα πράγματα φαίνονται πολύ καλύτερα τώρα :)

    <script language="Javascript"> try { setTimeout('pack();', 1000); } catch(er) { } </script>
        </body>

    Αυτάάά ... καταλαβαίνετε ότι ο παραπάνω κώδικας δεν είναι και της καλύτερης ποιότητας ( μας τρέχουν άσκημα ... ) και θέλει λίγο μάζεμα και ψάξιμο αλλά ...

    Happy pack() - ing !!!

    try { setTimeout('pack();', 1000); } catch(er) { }

    Angel
    O:]
Προβολή Τροφοδοσίας RSS με μορφή XML
Με χρήση του Community Server (Commercial Edition), από την Telligent Systems