🧩 FlexBox + FlexGraphic – Responsive Layout & Stylish Graphics for Unity UIFlexBox and FlexGraphic are powerful and easy-to-use tools to build responsive, clean, and modern interfaces inside Unity’s UI system. Inspired by CSS Flexbox, these components let you create dynamic layouts and stylish visuals in seconds.🔧 What’s Included?✅ FlexBox – Flexible Layout System for CanvasAuto alignment using Justify Content and Align ItemsFull support for Direction, Wrap, and nested layoutsWeb-style behavior just like CSS FlexboxComplete control over element order, spacing, and directionIdeal for dynamic menus, HUDs, and scalable UIsFully compatible with Unity’s UGUI system🎨 FlexGraphic – Visual Styling Made EasyCode-based drawing — no external images neededRounded corners and border thickness customizationInstant visual tweaking from the InspectorPerfect for buttons, panels, cards, and moreLightweight and optimized, with minimal overdraw⚡ Key Benefits🎯 Rapid UI layout building📱 Fully responsive design🧼 Cleaner hierarchy structure🎨 Image-free stylized graphics🧩 Perfect for adaptive and scalable projects🧠 No more anchor and RectTransform headaches🛠 100% extensible and written with SOLID principles.Components details:Container Properties:Direction: Row, Column, RowReverse, ColumnReverseWrap: NoWrap, Wrap, WrapReverseJustifyContent: FlexStart, FlexEnd, Center, SpaceBetween, SpaceAround, SpaceEvenlyAlignItems: FlexStart, FlexEnd, Center, StretchAlignContent: FlexStart, FlexEnd, Center, Stretch, SpaceBetween, SpaceAroundGap: Space between child elementsPadding: Inner spacingReverseOrder: Reverse the order of childrenItem Properties:FlexGrow:How much the item can growFlexShrink: How much the item can shrinkFlexBasis: Initial size of the itemAlignSelf: Override parent's align-itemsOrder: Visual order of the itemPosition: Relative or Absolute positioningWidth/Height: Size constraintsMinWidth/MinHeight: Minimum size constraintsMaxWidth/MaxHeight: Maximum size constraintsMargin: Outer spacingIgnoreLayout: Skip this element in layout calculationsLayoutPriority: Priority for layout calculationsFlexSizeA flexible size system supporting:Pixels: Fixed size in pixelsPercentage: Size relative to parentAuto: Automatic sizing based on contentFlexSpacingA comprehensive spacing system for padding and margin with:Individual control over top, right, bottom, leftQuick "set all" functionalityVisual preview of spacingFlexGraphicAdvanced graphic component with rounded corners and borders:Rounded Corners: Individual or unified corner radiusBorders: Customizable border width and colorFill Effects: Multiple fill directions and patternsSprite Support: Full sprite rendering with UV mappingMask Support: Integration with Unity's masking systemRaycast Filtering: Pixel-perfect hit testingUxmlToFlexConverterConvert UI Toolkit UXML files to FlexBox-based GameObjects:UXML Import: Import VisualTreeAsset filesStyle Conversion: Convert UI Toolkit styles to FlexBox propertiesHierarchy Preservation**: Maintain original element hierarchyComponent Generatio: Automatically add appropriate UI componentsDebug Support: Comprehensive logging and error handling📝SupportDiscord: https://discord.gg/9grad2eQhdLinkedin: https://www.linkedin.com/in/eduardo-varela-dev/Email: eduardo.varela.juegos@gmail.com
