跳到主要内容

状态机播放

在加载 Rive 文件后,在运行时播放状态机并与之交互。

在 Flutter 中有多种播放/选择状态机的方式。

使用 RiveWidgetController(推荐)

创建 RiveWidgetController 时,默认会使用默认状态机,或者你可以按名称或索引指定状态机。

// 默认状态机
var controller = RiveWidgetController(riveFile);
// 按名称
controller = RiveWidgetController(
riveFile,
stateMachineSelector: StateMachineSelector.byName("State Machine 1"),
);
// 按索引
controller = RiveWidgetController(
riveFile,
stateMachineSelector: StateMachineSelector.byIndex(0),
);

将此控制器传递给 RiveWidget 会自动播放状态机。

@override
Widget build(BuildContext context) {
return RiveWidget(controller: controller);
}

你可以将控制器标记为 active 来播放/暂停状态机(推进和绘制):

final controller = RiveWidgetController(riveFile);
controller.active = false;

StateMachineSelector 也可以传递给 RiveWidgetBuilder 来指定要使用的状态机:

return RiveWidgetBuilder(
fileLoader: fileLoader,
stateMachineSelector: StateMachineSelector.byIndex(0),
builder: (context, state) => switch (state) {
/// ...
},
);

使用 StateMachinePainter

使用 StateMachinePainter 时,可以通过传递可选的名称来指定要使用的状态机。

// 默认状态机
final painter = rive.StateMachinePainter(withStateMachine: _withStateMachine);
// 按名称
painter = rive.StateMachinePainter(
withStateMachine: _withStateMachine,
stateMachineName: 'State Machine 1 ',
);

直接创建状态机

Artboard 直接创建状态机:

final artboard = riveFile.defaultArtboard()!;
// 默认状态机
var stateMachine = artboard.defaultStateMachine();
// 按名称
stateMachine = artboard.stateMachine('State Machine 1');
// 按索引
stateMachine = artboard.stateMachineAt(0);