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像素)