ScalifySection class

Creates an independent scaling context based on the section's actual layout size rather than the full screen size.

Wrap any part of your UI in ScalifySection to make all context-based scaling methods (context.w(), context.fz(), context.s(), etc.) calculate values relative to this section's width and height.

This is essential for split-screen / master-detail layouts where a sidebar and main content have different widths and each should scale independently.

How It Works

Uses LayoutBuilder to capture the section's actual constraints.
Overrides MediaQuery so size.width equals the section width.
Creates a new ScalifyProvider that calculates scaling based on the overridden size.
Uses RepaintBoundary to isolate repaints for performance.

Important: Use Context-Based Extensions

Inside a ScalifySection, always use context-based scaling (e.g. context.fz(16), context.w(100)) rather than global extensions (e.g. 16.fz, 100.w), because global extensions read from GlobalResponsive which reflects the last updated provider.

Example — Split Layout

Row(
  children: [
    // Sidebar: scales based on 300px width
    SizedBox(
      width: 300,
      child: ScalifySection(child: Sidebar()),
    ),
    // Main content: scales based on remaining width
    Expanded(
      child: ScalifySection(child: MainContent()),
    ),
  ],
)

Inheritance

Constructors

ScalifySection({Key? key, required Widget child, ScalifyConfig? config}): Creates a ScalifySection.
const

Properties

child → Widget: The child widget that will receive the local scaling context.
final
config → ScalifyConfig?: Optional config override. If null, inherits from the nearest parent ScalifyProvider, falling back to ScalifyConfig defaults.
final
hashCode → int: The hash code for this object.
no setterinherited
key → Key?: Controls how one widget replaces another widget in the tree.
finalinherited
runtimeType → Type: A representation of the runtime type of the object.
no setterinherited

Methods

build(BuildContext context) → Widget: Describes the part of the user interface represented by this widget.
override
createElement() → StatelessElement: Creates a StatelessElement to manage this widget's location in the tree.
inherited
debugDescribeChildren() → List<DiagnosticsNode>: Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void: Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic: Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode: Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String: A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String: Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String: Returns a one-line detailed description of the object.
inherited
toStringShort() → String: A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool: The equality operator.
inherited