ResponsiveLayout class

ResponsiveLayout

一个根据屏幕尺寸自适应展示不同布局的响应式组件,适用于同时支持移动端、平板和桌面端界面的场景。

  • 当屏幕宽度小于650像素时,显示 mobile 组件;
  • 当屏幕宽度介于650到1100像素(含)之间时,显示 tablet 组件(若未提供则显示 desktop);
  • 当屏幕宽度大于等于1100像素时,显示 desktop 组件(若未提供则优先显示 tablet,再回退至 mobile);

常用于根据屏幕大小调整布局,提升多终端适配体验。

参数说明

  • mobile 必填,移动端显示的组件。
  • tablet 选填,平板端显示的组件,如未设置则回退为 desktop。
  • desktop 选填,桌面端显示的组件。

静态方法

代码示例

ResponsiveLayout(
  mobile: MobileWidget(),
  tablet: TabletWidget(),
  desktop: DesktopWidget(),
)

返回结果

返回当前屏幕尺寸下对应的 Widget,以适配不同终端。

Inheritance

Constructors

ResponsiveLayout({Key? key, required Widget mobile, Widget? tablet, Widget? desktop})
构造函数
const

Properties

desktop → Widget?
桌面端显示的组件(可选)
final
hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
mobile → Widget
移动端显示的组件
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
tablet → Widget?
平板端显示的组件(可选,未设置时回退为desktop或mobile)
final

Methods

build(BuildContext context) → Widget
根据屏幕尺寸返回对应的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

Static Methods

isDesktop(BuildContext context) → bool
判断是否为桌面端(宽度大于等于1100像素)
isMobile(BuildContext context) → bool
判断是否为移动端(宽度小于650像素)
isTablet(BuildContext context) → bool
判断是否为平板(宽度大于等于650且小于1100像素)