Einschränkungen

Einschränkungen definieren, wie Ebenen reagieren, wenn Sie ihre übergeordneten Rahmen ändern, und ermöglichen so responsive Designs für verschiedene Bildschirmgrößen und Geräte. Objekte innerhalb eines Rahmens werden als Kindobjekte bezeichnet, während der Rahmen selbst der übergeordnete Rahmen ist.

Einschränkungen haben horizontale (x-Achse) und vertikale (y-Achse) Einstellungen. Standardmäßig sind Objekte an den oberen und linken Kanten ihres übergeordneten Rahmens ausgerichtet.

Horizontale Einschränkungen

• Links: hält das Objekt relativ zur linken Seite positioniert;
• Rechts: positioniert relativ zur rechten Seite;
• Links + Rechts: Die Größe des Objekts passt sich mit dem Rahmen entlang der x-Achse an;
• Zentrum: hält das Objekt horizontal zentriert;
• Skalieren: passt die Größe und Position des Objekts proportional zum Rahmen an.

Vertikale Einschränkungen

• Oben: positioniert relativ zur oberen Kante;
• Unten: positioniert relativ zur unteren Kante;
• Oben + Unten: die Größe des Objekts passt sich mit dem Rahmen entlang der y-Achse an;
• Zentrum: hält das Objekt vertikal zentriert;
• Skalieren: ähnlich wie horizontales Skalieren, aber für die y-Achse.

Einschränkungen können auch visuell mit dem Einschränkungsfeld im Design-Panel festgelegt werden.

Verwendung von Einschränkungen für responsives Design

• Richten Sie Objekte (z.B. Text, Schaltflächen, Bilder) mit Layout-Rastern für präzise Positionierung aus;
• Passen Sie die Einschränkungen für jedes Objekt basierend darauf an, wie es sich verhalten soll, wenn der Rahmen geändert wird;
• Stellen Sie sicher, dass Gruppen oder maskierte Objekte wie beabsichtigt funktionieren, indem Sie sie in Rahmen verschachteln und Einschränkungen erneut anwenden. Die Verknüpfung ist CTRL + ALT + G (Windows) oder Command + Option + G (Mac);
• Testen Sie die Responsivität, indem Sie den übergeordneten Rahmen ändern, um sicherzustellen, dass keine Verzerrungen oder Fehlausrichtungen auftreten.