Δημιουργία δυναμικών διατάξεων σε εφαρμογές καμβά
Πριν να δημιουργήσετε μια εφαρμογή καμβά στο Power Apps, καθορίζετε εάν θα προσαρμόσετε την εφαρμογή για τηλέφωνο ή tablet. Αυτή η επιλογή καθορίζει το μέγεθος και το σχήμα του καμβά στον οποίο θα δημιουργήσετε την εφαρμογή σας.
Αφού κάνετε αυτήν την επιλογή, μπορείτε να κάνετε μερικές ακόμα επιλογές εάν επιλέξετε Ρυθμίσεις > Εμφάνιση. Μπορείτε να επιλέξετε κατακόρυφο ή οριζόντιο προσανατολισμό και μέγεθος οθόνης (για tablet μόνο). Μπορείτε, επίσης, να κλειδώσετε ή να ξεκλειδώσετε τις αναλογίες εικόνας και να υποστηρίξετε την περιστροφή συσκευής (ή όχι).
Αυτές οι επιλογές διέπουν κάθε άλλη επιλογή που κάνετε κατά τη σχεδίαση διατάξεων οθόνης. Εάν η εφαρμογή σας εκτελείται σε μια συσκευή διαφορετικού μεγέθους ή στο web, η όλη διάταξη προσαρμόζεται έτσι ώστε να ταιριάζει στην οθόνη όπου εκτελείται η εφαρμογή. Εάν, λόγου χάρη, μια εφαρμογή που έχει σχεδιαστεί για τηλέφωνο εκτελεσθεί σε μεγάλο παράθυρο προγράμματος περιήγησης, η εφαρμογή προσαρμόζεται ώστε να αντισταθμίσει το μέγεθος και έτσι δείχνει υπερμεγέθης σε σχέση με τον χώρο της. Η εφαρμογή δεν μπορεί να εκμεταλλευτεί τα επιπλέον pixel με την εμφάνιση περισσότερων στοιχείων ελέγχου ή περισσότερου περιεχομένου.
Εάν δημιουργήσετε μια δυναμική διάταξη, τα στοιχεία ελέγχου μπορούν να αποκριθούν σε διαφορετικές συσκευές ή μεγέθη παραθύρου, κάνοντας τις διάφορες εμπειρίες πιο φυσικές. Για να επιτύχετε μια δυναμική διάταξη, μπορείτε να προσαρμόσετε ορισμένες ρυθμίσεις και να συντάξετε εκφράσεις σε όλη την εφαρμογή σας.
Απενεργοποίηση προσαρμογής μεγέθους
Μπορείτε να ρυθμίσετε τις παραμέτρους κάθε οθόνης ώστε η διάταξή της να προσαρμοστεί στον πραγματικό χώρο στον οποίο εκτελείται η εφαρμογή.
Ενεργοποιείτε την απόκριση απενεργοποιώντας τη ρύθμιση Προσαρμογή κλίμακας " της εφαρμογής, η οποία είναι ενεργοποιημένη από προεπιλογή. Όταν απενεργοποιείτε αυτήν τη ρύθμιση, απενεργοποιείτε επίσης το Κλείδωμα αναλογίας εικόνας επειδή δεν σχεδιάζετε πλέον για ένα συγκεκριμένο σχήμα οθόνης. (Εξακολουθείτε να μπορείτε να καθορίσετε εάν η εφαρμογή σας θα υποστηρίζει την περιστροφή συσκευής.)
Για να είναι δυνατή η απόκριση της εφαρμογής σας θα πρέπει να ακολουθήσετε πρόσθετα βήματα, αλλά αυτή η αλλαγή είναι το πρώτο βήμα ώστε να γίνει δυνατή η απόκριση.
Κατανόηση διαστάσεων εφαρμογής και οθόνης
Για να κάνετε τις διατάξεις της εφαρμογής σας να ανταποκρίνονται στις αλλαγές των διαστάσεων της οθόνης, θα συντάξετε τύπους που χρησιμοποιούν τις ιδιότητες Width και Height της οθόνης. Για να εμφανίσετε αυτές τις ιδιότητες, ανοίξτε μια εφαρμογή στο Power Apps Studio και στη συνέχεια επιλέξτε μια οθόνη. Οι προεπιλεγμένοι τύποι για αυτές τις ιδιότητες εμφανίζονται στην καρτέλα Για προχωρημένους δεξιό τμήμα παραθύρου.
Πλάτος = Max(App.Width, App.DesignWidth)
Ύψος = Max(App.Height, App.DesignHeight)
Αυτοί οι τύποι αναφέρονται στις ιδιότητες Width, Height, DesignWidth και DesignHeight της εφαρμογής. Οι ιδιότητες Width και Height της εφαρμογής αντιστοιχούν στις διαστάσεις της συσκευής ή του παραθύρου του προγράμματος περιήγησης στο οποίο εκτελείται η εφαρμογή σας. Εάν ο χρήστης αλλάξει το μέγεθος του παραθύρου του προγράμματος περιήγησης (ή περιστρέψει τη συσκευή εάν έχετε απενεργοποιήσει το Κλείδωμα προσανατολισμού), οι τιμές αυτών των ιδιοτήτων αλλάζουν δυναμικά. Οι τύποι στις ιδιότητες Width και Height αξιολογούνται εκ νέου όταν αλλάζουν αυτές οι τιμές.
Οι ιδιότητες DesignWidth και DesignHeight προέρχονται από τις διαστάσεις που ορίζεται στο τμήμα παραθύρου Εμφάνιση στις Ρυθμίσεις. Για παράδειγμα, εάν επιλέξετε τη διάταξη τηλεφώνου σε κατακόρυφο προσανατολισμό, το DesignWidth είναι 640 και το DesignHeight είναι 1136.
Όπως χρησιμοποιούνται στους τύπους για τις ιδιότητες Width και Height της οθόνης, μπορείτε να θεωρήσετε το DesignWidth και το DesignHeight ως τις ελάχιστες διαστάσεις για τις οποίες σχεδιάζετε την εφαρμογή. Εάν η πραγματική περιοχή που είναι διαθέσιμη στην εφαρμογή σας είναι ακόμα μικρότερη από αυτές τις ελάχιστες διαστάσεις, οι τύποι για τις ιδιότητες Width και Height της οθόνης διασφαλίζουν ότι οι τιμές τους δεν θα γίνουν μικρότερες από τις ελάχιστες. Σε αυτήν την περίπτωση, ο χρήστης θα πρέπει να κάνει κύλιση για να προβάλει όλο το περιεχόμενο της οθόνης.
Αφού καθορίσετε τα DesignWidth και DesignHeight της εφαρμογής σας, δεν θα χρειαστεί (στις περισσότερες περιπτώσεις) να αλλάξετε τους προεπιλεγμένους τύπους για τις ιδιότητες Width και Height κάθε οθόνης. Στη συνέχεια, αυτό το θέμα εξετάζει περιπτώσεις στις οποίες μπορεί να θέλετε να προσαρμόσετε αυτούς τους τύπους.
Χρήση τύπων για δυναμική διάταξη
Για να δημιουργήσετε μια δυναμική σχεδίαση, εντοπίζετε και ταξινομείτε κάθε στοιχείο ελέγχου χρησιμοποιώντας τύπους αντί για απόλυτες (σταθερές) τιμές συντεταγμένων. Αυτοί οι τύποι εκφράζουν τη θέση και το μέγεθος κάθε στοιχείου ελέγχου από άποψη συνολικού μεγέθους οθόνης ή σε σχέση με άλλα στοιχεία ελέγχου στην οθόνη.
Σημαντικό
Αφού συντάξετε τύπους για τις ιδιότητες Χ, Υ, Width και Height ενός στοιχείου ελέγχου, οι τύποι σας θα αντικατασταθούν από σταθερές τιμές εάν στη συνέχεια σύρετε το στοιχείο ελέγχου στο πρόγραμμα επεξεργασίας καμβά. Όταν ξεκινάτε να χρησιμοποιείτε τύπους για να επιτύχετε δυναμική διάταξη, θα πρέπει να αποφεύγετε τη μεταφορά στοιχείων ελέγχου.
Στην πιο απλή περίπτωση, ένα στοιχείο ελέγχου γεμίζει μια ολόκληρη οθόνη. Για να δημιουργήσετε αυτό το εφέ, ορίστε τις ιδιότητες του στοιχείου ελέγχου σε αυτές τις τιμές:
Ιδιότητα | Τιμή |
---|---|
X | 0 |
Y | 0 |
Πλάτος | Parent.Width |
Ύψος | Parent.Height |
Αυτοί οι τύποι χρησιμοποιούν τον Γονικό τελεστή. Για ένα στοιχείο ελέγχου που τοποθετείται απευθείας σε μια οθόνη, το Γονικό αναφέρεται στην οθόνη. Με αυτές τις τιμές ιδιοτήτων, το στοιχείο ελέγχου εμφανίζεται στην επάνω αριστερή γωνία της οθόνης (0, 0) και έχει το ίδιο Width και Height με την οθόνη.
Στη συνέχεια αυτού του θέματος, θα εφαρμόζετε αυτές τις αρχές (και τον Γονικό τελεστή) για την τοποθέτηση στοιχείων ελέγχου στο εσωτερικό άλλων περιεκτών, όπως οι συλλογές, τα στοιχεία ελέγχου ομάδας και τα στοιχεία.
Εναλλακτικά, το στοιχείο ελέγχου μπορεί να γεμίσει μόνο το πάνω μισό της οθόνης. Για να δημιουργήσετε αυτό το εφέ, ορίστε την ιδιότητα Height σε Parent.Height /2 και αφήστε τους άλλους τύπους αμετάβλητους.
Εάν θέλετε ένα δεύτερο στοιχείο ελέγχου για να γεμίσει το κάτω μισό της ίδιας οθόνης, μπορείτε να ακολουθήσετε τουλάχιστον δύο άλλες προσεγγίσεις για την κατασκευή των τύπων του. Για λόγους ευκολίας, μπορείτε να ακολουθήσετε αυτήν την προσέγγιση:
Στοιχείο ελέγχου | Ιδιότητα | Τύπος |
---|---|---|
Upper | X | 0 |
Upper | Y | 0 |
Upper | Πλάτος | Parent.Width |
Upper | Ύψος | Parent.Height / 2 |
Κάτω | X | 0 |
Κάτω | Y | Parent.Height / 2 |
Κάτω | Πλάτος | Parent.Width |
Κάτω | Ύψος | Parent.Height / 2 |
Αυτή η ρύθμιση παραμέτρων θα επιτύχει το αποτέλεσμα που θέλετε, αλλά θα πρέπει να επεξεργαστείτε κάθε τύπο εάν αλλάξετε γνώμη σχετικά με τα σχετικά μεγέθη των στοιχείων ελέγχου. Για παράδειγμα, μπορεί να αποφασίσετε ότι το άνω στοιχείο ελέγχου θα πρέπει να καταλαμβάνει μόνο το επάνω ένα τρίτο της οθόνης, με το κάτω στοιχείο ελέγχου να γεμίζει τα κάτω δύο τρίτα.
Για να δημιουργήσετε αυτό το αποτέλεσμα, θα πρέπει να ενημερώσετε την ιδιότητα Height του στοιχείου ελέγχου Άνω και τις ιδιότητες Y και Height του Κάτω στοιχείου ελέγχου. Αντί για αυτό, εξετάστε το ενδεχόμενο να συγγράψετε τους τύπους για το Κάτω στοιχείο ελέγχου ως προς το Άνω στοιχείο ελέγχου (και ως προς τον εαυτό του), όπως φαίνεται σε αυτό το παράδειγμα:
Στοιχείο ελέγχου | Ιδιότητα | Τύπος |
---|---|---|
Upper | X | 0 |
Upper | Y | 0 |
Upper | Πλάτος | Parent.Width |
Upper | Ύψος | Parent.Height / 3 |
Lower | X | 0 |
Lower | Y | Upper.Y + Upper.Height |
Lower | Πλάτος | Parent.Width |
Κάτω | Ύψος | Parent.Height - Lower.Y |
Με αυτούς τους τύπους εφαρμοσμένους, θα πρέπει να αλλάξετε μόνο την ιδιότητα Height του Άνω στοιχείου ελέγχου ώστε να εκφράζεται διαφορετικό κλάσμα ύψους της οθόνης. Το Κάτω στοιχείο ελέγχου μετακινείται και αλλάζει μέγεθος αυτόματα ώστε να λογαριάσει την αλλαγή.
Μπορείτε να χρησιμοποιήσετε αυτά τα μοτίβα τύπου για την έκφραση συνήθων σχέσεων διάταξης μεταξύ ενός στοιχείου ελέγχου, με όνομα C και του γονικού ή ενός αδελφικού του στοιχείου ελέγχου με όνομα D.
Σχέση μεταξύ του C και του γονικού του | Ιδιότητα | Τύπος | Απεικόνιση |
---|---|---|---|
Το στοιχείο C γεμίζει το πλάτος του γονικού, με περιθώριο Ν | X | N |
|
Πλάτος | Parent.Width - (N * 2) |
||
Το στοιχείο C γεμίζει το ύψος του γονικού, με περιθώριο Ν | Y | N |
|
Ύψος | Parent.Height - (N * 2) |
||
Το C στοιχισμένο με το δεξιό άκρο του γονικού, με περιθώριο Ν | X | Parent.Width - (C.Width + N) |
|
Το C στοιχισμένο με το κάτω άκρο του γονικού, με περιθώριο Ν | Y | Parent.Height - (C.Height + N) |
|
Το C κεντραρισμένο οριζόντια στο γονικό | X | (Parent.Width - C.Width) / 2 |
|
Το C κεντραρισμένο κάθετα στο γονικό | Y | (Parent.Height - C.Height) / 2 |
Σχέση μεταξύ C και D | Ιδιότητα | Τύπος | Απεικόνιση |
---|---|---|---|
Το C σε οριζόντια στοίχιση με το D και ίδιου πλάτους με το D | X | D.X |
|
Πλάτος | D.Width |
||
Το C σε κάθετη στοίχιση με το D και ίδιου ύψους με το D | Y | D.Y |
|
Ύψος | D.Height |
||
Το δεξιό άκρο του C στοιχισμένο με το δεξιό άκρο του D | X | D.X + D.Width - C.Width |
|
Το κάτω άκρο του C στοιχισμένο με το κάτω άκρο του D | Y | D.Y + D.Height - C.Height |
|
Το C κεντραρισμένο οριζόντια σε σχέση με το D | X | D.X + (D.Width - C.Width) / 2 |
|
Το C κεντραρισμένο κάθετα σε σχέση με το D | Y | D.Y + (D.Height - C.Height) /2 |
|
Το C τοποθετημένο στα δεξιά του D με κενό Ν | X | D.X + D.Width + N |
|
Το C τοποθετημένο κάτω από το D με κενό Ν | Y | D.Y + D.Height + N |
|
Το C γεμίζει το διάστημα μεταξύ του D και του δεξιού άκρου του γονικού | X | D.X + D.Width |
|
Πλάτος | Parent.Width - C.X |
||
Το C γεμίζει το διάστημα μεταξύ του D και του κάτω άκρου του γονικού | Y | D.Y + D.Height |
|
Ύψος | Parent.Height - C.Y |
Ιεραρχική διάταξη
Καθώς κατασκευάζετε οθόνες που περιέχουν περισσότερα στοιχεία ελέγχου, θα είναι πιο βολικό (ή ακόμα και απαραίτητο) να τοποθετείτε στοιχεία ελέγχου σε σχέση με ένα γονικό στοιχείο ελέγχου, αντί σε σχέση με την οθόνη ή με ένα αδελφικό στοιχείο ελέγχου. Οργανώνοντας τα στοιχεία ελέγχου σας σε ιεραρχική δομή, μπορείτε να κάνετε τους τύπους σας πιο εύκολους στη συγγραφή και στη συντήρηση.
Συλλογές
Εάν χρησιμοποιείτε μια συλλογή στην εφαρμογή σας, θα πρέπει να μορφοποιήσετε τα στοιχεία ελέγχου στο πρότυπο της συλλογής. Μπορείτε να τοποθετήσετε αυτά τα στοιχεία ελέγχου συγγράφοντας τύπους που χρησιμοποιούν το Γονικό τελεστή, ο οποίος θα αναφέρεται στο πρότυπο της συλλογής. Στους τύπους των στοιχείων ελέγχου ενός πρότυπου συλλογής, χρησιμοποιήστε τις ιδιότητες Parent.TemplateHeight και Parent. TemplateWidth. Μην χρησιμοποιείτε τις Parent.Width και Parent.Height που αναφέρονται στο συνολικό μέγεθος της συλλογής.
Στοιχείο ελέγχου Κοντέινερ
Μπορείτε να χρησιμοποιήσετε στοιχείου ελέγχου Περιέκτης διάταξης, ως γονικό στοιχείο ελέγχου.
Εξετάστε το παράδειγμα μιας κεφαλίδας στο επάνω μέρος μιας οθόνης. Είναι σύνηθες να έχετε μια επικεφαλίδα με έναν τίτλο και διάφορα εικονίδια με τα οποία μπορούν να αλληλεπιδρούν οι χρήστες σας. Μπορείτε να δημιουργήσετε μια τέτοια κεφαλίδα χρησιμοποιώντας το στοιχείο ελέγχου Περιέκτης, που περιέχει ένα στοιχείο ελέγχου Ετικέτα και δύο στοιχεία ελέγχου Εικονίδιο :
Καθορίστε τις ιδιότητες για αυτά τα στοιχεία ελέγχου σε αυτές τις τιμές:
Ιδιότητα | Κεφαλίδα | Μενού | Κλείσιμο | Τίτλος |
---|---|---|---|---|
X | 0 |
0 |
Parent.Width - Close.Width |
Menu.X + Menu.Width |
Y | 0 |
0 |
0 |
0 |
Πλάτος | Parent.Width |
Parent.Height |
Parent.Height |
Close.X - Title.X |
Ύψος | 64 |
Parent.Height |
Parent.Height |
Parent.Height |
Για το στοιχείο ελέγχου Κεφαλίδα , το Parent
αναφέρεται στην οθόνη. Για τα άλλα στοιχεία ελέγχου, το Parent
αναφέρεται στο στοιχείο ελέγχου Κεφαλίδα.
Αφού συνταχθούν αυτοί οι τύποι, μπορείτε να προσαρμόσετε το μέγεθος ή τη θέση του στοιχείου ελέγχου Κεφαλίδα αλλάζοντας τους τύπους για τις ιδιότητές του. Τα μεγέθη και οι θέσεις των θυγατρικών στοιχείων ελέγχου θα προσαρμόζονται αναλόγως αυτόματα.
Στοιχεία ελέγχου κοντέινερ αυτόματης διάταξης
Μπορείτε να χρησιμοποιήσετε μια δυνατότητα, τα στοιχεία ελέγχου κοντέινερ Αυτόματη διάταξη για την αυτόματη διάταξη των θυγατρικών στοιχείων. Αυτά τα κοντέινερ καθορίζουν τη θέση των θυγατρικών στοιχείων, έτσι ώστε να μην χρειάζεται να ορίσετε ποτέ τα X, Y για ένα στοιχείο εντός του κοντέινερ. Επίσης, μπορεί να κατανείμει το διαθέσιμο χώρο στα θυγατρικά στοιχεία του με βάση τις ρυθμίσεις, καθώς και να προσδιορίσει τόσο την κατακόρυφη όσο και την οριζόντια στοίχιση των θυγατρικών στοιχείων. Περισσότερες πληροφορίες: Στοιχεία ελέγχου κοντέινερ αυτόματης διάταξης
Στοιχεία
Εάν χρησιμοποιείτε μια άλλη δυνατότητα, με όνομα Στοιχεία, μπορείτε να κατασκευάσετε δομικά μπλοκ και να τα επαναχρησιμοποιήσετε σε όλη την εφαρμογή σας. Όπως και με στοιχείο ελέγχου Περιέκτης , τα στοιχεία ελέγχου που τοποθετείτε μέσα σε ένα στοιχείο θα πρέπει να βασίζουν τους τύπους θέσης και μεγέθους στα Parent.Width
και Parent.Height
, τα οποία αναφέρονται στο μέγεθος του στοιχείου. Περισσότερες πληροφορίες: Δημιουργία στοιχείου.
Προσαρμογή διάταξης στο μέγεθος και τον προσανατολισμό της συσκευής
Έως τώρα, έχετε μάθει τον τρόπο χρήσης τύπων για την αλλαγή του μεγέθους κάθε στοιχείου ελέγχου ώστε να αποκρίνεται στο διαθέσιμο χώρο, διατηρώντας παράλληλα τα στοιχεία ελέγχου στοιχισμένα το ένα με το άλλο. Ωστόσο, ενδέχεται να θελήσετε ή να χρειαστεί να κάνετε πιο ουσιαστικές αλλαγές στη διάταξη ώστε να αποκρίνεται σε διαφορετικά μεγέθη και προσανατολισμούς συσκευών. Για παράδειγμα, όταν μια συσκευή περιστρέφεται από κατακόρυφο σε οριζόντιο προσανατολισμό, μπορεί να θέλετε να μεταβείτε από μια κατακόρυφη διάταξη σε μια οριζόντια. Σε μια μεγαλύτερη συσκευή, μπορείτε να παρουσιάσετε περισσότερο περιεχόμενο ή να το αναδιατάξετε για να προσφέρετε μια πιο ελκυστική διάταξη. Σε μια μικρότερη συσκευή, μπορεί να χρειαστεί να διαμερίσετε το περιεχόμενο σε πολλές οθόνες.
Προσανατολισμός συσκευής
Οι προεπιλεγμένοι τύποι για τις ιδιότητες Width και Height μιας οθόνης, όπως περιγράφηκε παραπάνω σε αυτό το θέμα, δεν θα παρέχουν απαραίτητα καλή εμπειρία εάν ένας χρήστης περιστρέψει μια συσκευή. Για παράδειγμα, μια εφαρμογή που έχει σχεδιαστεί για ένα τηλέφωνο σε κατακόρυφο προσανατολισμό έχει DesignWidth 640 και DesignHeight 1136. Η ίδια εφαρμογή σε ένα τηλέφωνο με οριζόντιο προσανατολισμό θα έχει αυτές τις τιμές ιδιοτήτων:
- Η ιδιότητα Width της οθόνης έχει οριστεί στην τιμή
Max(App.Width, App.DesignWidth)
. Το Width (1136) της εφαρμογής είναι μεγαλύτερο από το DesignWidth (640) της κι επομένως ο τύπος αξιολογείται σε 1136. - Η ιδιότητα Height της οθόνης έχει οριστεί στην τιμή
Max(App.Height, App.DesignHeight)
. Το Height (640) της εφαρμογής είναι μικρότερο από το DesignHeight (1136) της κι επομένως ο τύπος αξιολογείται σε 1136.
Με Height οθόνης 1136 και ύψος συσκευής 640 (σε αυτόν τον προσανατολισμό), ο χρήστης πρέπει να κάνει κύλιση της οθόνης κατακόρυφα ώστε να εμφανίζει όλο το περιεχόμενό του, γεγονός που ενδεχομένως να μην ανταποκρίνεται στην εμπειρία που θέλετε.
Για να προσαρμόσετε τις ιδιότητες Width και Height της οθόνης στον προσανατολισμό της συσκευής, μπορείτε να χρησιμοποιήσετε αυτούς τους τύπους:
Πλάτος = Max(App.Width, If(App.Width < App.Height, App.DesignWidth, App.DesignHeight))
Ύψος = Max(App.Height, If(App.Width < App.Height, App.DesignHeight, App.DesignWidth))
Αυτοί οι τύποι αλλάζουν τις τιμές των DesignWidth και DesignHeight της εφαρμογής, ανάλογα με το εάν το πλάτος της συσκευής είναι μικρότερο από το ύψος (κατακόρυφος προσανατολισμός) ή μεγαλύτερο από το ύψος της (οριζόντιος προσανατολισμός).
Αφού προσαρμόσετε τους τύπους Width και Height της οθόνης, ίσως θελήσετε επίσης να αναδιατάξετε τα στοιχεία ελέγχου στην οθόνη σας για να χρησιμοποιήσετε καλύτερα το διαθέσιμο χώρο. Για παράδειγμα, εάν κάθε ένα από τα δύο στοιχεία ελέγχου καταλαμβάνει τη μισή οθόνη, μπορείτε να τα τοποθετήσετε κατακόρυφα σε κατακόρυφη στοίβα, αλλά να τα διατάξετε δίπλα-δίπλα σε οριζόντιο προσανατολισμό.
Μπορείτε να χρησιμοποιήσετε την ιδιότητα Προσανατολισμός της οθόνης για να προσδιορίσετε εάν η οθόνη είναι προσανατολισμένη κατακόρυφα ή οριζόντια.
Σημείωση
Στον οριζόντιο προσανατολισμό, τα Άνω και Κάτω στοιχεία ελέγχου εμφανίζονται ως αριστερά και δεξιά στοιχεία ελέγχου.
Στοιχείο ελέγχου | Ιδιότητα | Τύπος |
---|---|---|
Upper | X | 0 |
Upper | Y | 0 |
Upper | Πλάτος | If(Parent.Orientation = Layout.Vertical, Parent.Width, Parent.Width / 2) |
Upper | Ύψος | If(Parent.Orientation = Layout.Vertical, Parent.Height / 2, Parent.Height) |
Lower | X | If(Parent.Orientation = Layout.Vertical, 0, Upper.X + Upper.Width) |
Lower | Y | If(Parent.Orientation = Layout.Vertical, Upper.Y + Upper.Height, 0) |
Lower | Πλάτος | Parent.Width - Lower.X |
Κάτω | Ύψος | Parent.Height - Lower.Y |
Μεγέθη και σημεία διακοπής οθόνης
Μπορείτε να προσαρμόσετε τη διάταξή σας με βάση το μέγεθος της συσκευής. Η ιδιότητα Μέγεθος της οθόνης ταξινομεί το τρέχον μέγεθος της συσκευής. Το μέγεθος είναι ένας θετικός ακέραιος αριθμός. Ο τύπος ScreenSize παρέχει επώνυμες σταθερές που βοηθούν στην αναγνωσιμότητα. Σε αυτόν τον πίνακα παρατίθενται οι σταθερές:
Σταθερά | Τιμή | Τυπικός τύπος συσκευής (με χρήση προεπιλεγμένων ρυθμίσεων εφαρμογής) |
---|---|---|
ScreenSize. Small | 1 | Τηλέφωνο |
ScreenSize.Medium | 2 | Tablet, σε κατακόρυφο προσανατολισμό |
ScreenSize.Large | 3 | Tablet, σε οριζόντιο προσανατολισμό |
ScreenSize.ExtraLarge | 4 | Επιτραπέζιος υπολογιστή |
Χρησιμοποιήστε αυτά τα μεγέθη για να λάβετε αποφάσεις σχετικά με τη διάταξη της εφαρμογής σας. Για παράδειγμα, εάν θέλετε ένα στοιχείο ελέγχου να αποκρύπτεται σε μια συσκευή μεγέθους τηλεφώνου, αλλά να είναι ορατό σε διαφορετική περίπτωση, θα μπορούσατε να ορίσετε την ιδιότητα Visible του στοιχείου ελέγχου σε αυτόν τον τύπο:
Parent.Size >= ScreenSize.Medium
Αυτός ο τύπος αξιολογεί την τιμή σε true όταν το μέγεθος είναι μεσαίο ή μεγαλύτερο και διαφορετικά σε false.
Εάν θέλετε ένα στοιχείο ελέγχου να καταλαμβάνει διαφορετικό κλάσμα του πλάτους της οθόνης με βάση το μέγεθος της οθόνης, ορίστε την ιδιότητα Width του στοιχείου ελέγχου σε αυτόν τον τύπο:
Parent.Width *
Switch(
Parent.Size,
ScreenSize.Small, 0.5,
ScreenSize.Medium, 0.3,
0.25
)
Αυτός ο τύπος ορίζει το πλάτος του στοιχείου ελέγχου ως το μισό του πλάτους μιας μικρής οθόνης, ως τα τρία δέκατα του πλάτους μιας μέσης οθόνης και ως το ένα τέταρτο του πλάτους κάθε άλλης οθόνης.
Προσαρμοσμένα σημεία διακοπής
Η ιδιότητα Μέγεθος υπολογίζεται συγκρίνοντας την ιδιότητα Width της οθόνης με τις τιμές στην ιδιότητα SizeBreakpoints της εφαρμογής. Αυτή η ιδιότητα είναι ένας πίνακας-γραμμή με αριθμούς που υποδεικνύουν τα σημεία διακοπής πλάτους που διαχωρίζουν τα επώνυμα μεγέθη οθόνης:
Σε μια εφαρμογή που έχει δημιουργηθεί για tablet ή web, η προεπιλεγμένη τιμή στην ιδιότητα SizeBreakpoints της εφαρμογής είναι [600, 900, 1200]. Σε μια εφαρμογή που έχει δημιουργηθεί για τηλέφωνα, η τιμή είναι [1200, 1800, 2400]. (Οι τιμές για τις εφαρμογές τηλεφώνου διπλασιάζονται, επειδή αυτές οι εφαρμογές χρησιμοποιούν συντεταγμένες που ουσιαστικά έχουν διπλασιάσει τις συντεταγμένες που χρησιμοποιούνται σε άλλες εφαρμογές.)
Μπορείτε να προσαρμόσετε τα σημεία διακοπής της εφαρμογής σας αλλάζοντας τις τιμές στην ιδιότητα SizeBreakpoints της εφαρμογής . Επιλέξτε Εφαρμογή στην προβολή δέντρου, επιλέξτε SizeBreakpoints στη λίστα ιδιοτήτων και στη συνέχεια επεξεργαστείτε τις τιμές στη γραμμή τύπων. Μπορείτε να δημιουργήσετε τόσα σημεία διακοπής όσα χρειάζεται η εφαρμογή σας, αλλά μόνο τα μεγέθη 1 έως 4 αντιστοιχούν σε επώνυμα μεγέθη οθόνης. Στους τύπους, μπορείτε να αναφέρεστε σε μεγέθη πέρα από το ExtraLarge με τις αριθμητικές τιμές τους (5, 6 και ούτω καθεξής).
Επίσης, μπορείτε να καθορίσετε λιγότερα σημεία διακοπής. Για παράδειγμα, η εφαρμογή σας μπορεί να χρειάζεται μόνο τρία μεγέθη (δύο σημεία διακοπής), επομένως τα πιθανά μεγέθη οθόνης θα είναι μικρά, μεσαία και μεγάλα.
Γνωστοί περιορισμοί
Ο καμβάς σύνταξης δεν ανταποκρίνεται στους τύπους μεγέθους που δημιουργήθηκαν. Για να δοκιμάσετε τη συμπεριφορά απόκρισης, αποθηκεύστε και δημοσιεύστε την εφαρμογή σας και στη συνέχεια ανοίξτε την σε συσκευές ή σε παράθυρα προγραμμάτων περιήγησης διαφόρων μεγεθών και προσανατολισμών.
Εάν συντάσσετε εκφράσεις ή τύπους στις ιδιότητες X, Y, Widthκαι Height ενός στοιχείου ελέγχου, θα αντικαταστήσετε αυτές τις εκφράσεις ή τους τύπους εάν αργότερα σύρετε το στοιχείο ελέγχου σε μια διαφορετική θέση ή αλλάξετε το μέγεθος του στοιχείου ελέγχου σύροντας το περίγραμμα του.
Σημείωση
Μπορείτε να μας πείτε ποια γλώσσα προτιμάτε για την τεκμηρίωση; Πάρτε μέρος σε μια σύντομη έρευνα. (σημειώνεται ότι αυτή η έρευνα είναι στα Αγγλικά)
Η έρευνα θα διαρκέσει περίπου επτά λεπτά. Δεν συλλέγονται προσωπικά δεδομένα (δήλωση προστασίας προσωπικών δεδομένων).