What's happening here?

This example demonstrates maintaining aspect ratios and creating proportional layouts using constraint-based positioning. A character, logotype, and download button are positioned using aspect and proportion constraints for responsive, adaptive layouts.

// Create a horizontal proportion constraint
// to ensure the character takes less than
// 45% of the vertical space in the layer
// This constraint active only for vertical orientation
new UIHorizontalProportionConstraint(
  layer, character, {
    proportion: 0.45,
    relation: UIRelation.LESS_THAN,
    orientation: UIOrientation.VERTICAL,
  }
);

// Create a vertical proportion constraint
// to ensure the character takes less than
// 75% of the horizontal space in the layer
// This constraint active only for horizontal orientation
new UIVerticalProportionConstraint(
  layer, character, {
    proportion: 0.75,
    relation: UIRelation.LESS_THAN,
    orientation: UIOrientation.HORIZONTAL,
  }
);
💡 Interactive: Resize the demo to see how proportional and aspect constraints maintain relationships between elements.