Flutter - Placeholder class

Flutter 的 Placeholder widget 主要用來標示後續會被其它 Widget 取代的地方。


其建構子如下:

Placeholder({Key key, Color color: const Color(0xFF455A64), double strokeWidth: 2.0, double fallbackWidth: 400.0, double fallbackHeight: 400.0 })


屬性如下:

Name Type Description
color Color The color to draw the placeholder box.
fallbackHeight double The height to use when the placeholder is in a situation with an unbounded height.
fallbackWidth double The width to use when the placeholder is in a situation with an unbounded width.
strokeWidth double The width of the lines in the placeholder box.
hashCode int The hash code for this object.
key Key Controls how one widget replaces another widget in the tree.
runtimeType Type A representation of the runtime type of the object.


方法如下:

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


該 Widget 可以不帶參數直接使用。

1
2
3
4
5
import 'package:flutter/material.dart';

void main() {
runApp(new Placeholder());
}



若有需要也可以透過 color 屬性變更顏色。

1
2
3
4
5
6
7
import 'package:flutter/material.dart';

void main() {
runApp(new Placeholder(
color: Colors.green,
));
}



或是透過 strakeWidth 變更線條的寬度。

1
2
3
4
5
6
7
import 'package:flutter/material.dart';

void main() {
runApp(new Placeholder(
strokeWidth: 10.0,
));
}