Size Constraints Example (#7956)

# Objective

Add a simple example demonstrating how to use size constraints.

Related to #7946

# Solution

<img width="827" alt="Capture"
src="https://user-images.githubusercontent.com/27962798/223741566-4b8eca99-c450-42b5-a40e-a414858c8310.PNG">

# Changelog
* Added the example `size_constraints`

Cargo.toml

@@ -1802,6 +1802,16 @@ description = "Showcases the RelativeCursorPosition component"
 category = "UI (User Interface)"
 wasm = true
 
+[[example]]
+name = "size_constraints"
+path = "examples/ui/size_constraints.rs"
+
+[package.metadata.example.size_constraints]
+name = "Size Constraints"
+description = "Demonstrates how the to use the size constraints to control the size of a UI node."
+category = "UI (User Interface)"
+wasm = true
+
 [[example]]
 name = "text"
 path = "examples/ui/text.rs"

examples/README.md

@@ -338,6 +338,7 @@ Example | Description
 [Overflow](../examples/ui/overflow.rs) | Simple example demonstrating overflow behavior
 [Overflow and Clipping Debug](../examples/ui/overflow_debug.rs) | An example to debug overflow and clipping behavior
 [Relative Cursor Position](../examples/ui/relative_cursor_position.rs) | Showcases the RelativeCursorPosition component
+[Size Constraints](../examples/ui/size_constraints.rs) | Demonstrates how the to use the size constraints to control the size of a UI node.
 [Text](../examples/ui/text.rs) | Illustrates creating and updating text
 [Text Debug](../examples/ui/text_debug.rs) | An example for debugging text layout
 [Text Wrap Debug](../examples/ui/text_wrap_debug.rs) | Demonstrates text wrapping