BankFlipCard class

A generic 3-D flip-card container.

Wraps any frontBuilder / backBuilder pair in a smooth perspective-flip animation. Suitable for credit cards, account cards, info tiles: any two-sided widget.

Trigger modes

trigger Behaviour
tapToFlip Tap anywhere on the card to flip (default).
builtInButton Small icon button in the card corner.
external No built-in trigger: host drives the flip.

External control

Provide both isFlipped and onFlip to make the card controlled:

BankFlipCard(
  isFlipped: _flipped,
  onFlip: () => setState(() => _flipped = !_flipped),
  frontBuilder: (ctx, _) => MyFront(),
  backBuilder:  (ctx, _) => MyBack(),
)

Omit both for a self-managed (uncontrolled) card.

Custom flip button

BankFlipCard(
  trigger: BankFlipTrigger.builtInButton,
  flipButtonBuilder: (ctx, flip) => IconButton(
    icon: const Icon(Icons.info_outline),
    onPressed: flip,
  ),
  frontBuilder: ...,
  backBuilder:  ...,
)
Inheritance

Constructors

BankFlipCard({required Widget frontBuilder(BuildContext context, bool isFlipped), required Widget backBuilder(BuildContext context, bool isFlipped), Key? key, bool? isFlipped, VoidCallback? onFlip, BankFlipTrigger trigger = BankFlipTrigger.tapToFlip, Widget flipButtonBuilder(BuildContext context, VoidCallback flip)?, Duration flipDuration = const Duration(milliseconds: 500), Curve flipCurve = Curves.easeInOutCubic, BankFlipAxis flipAxis = BankFlipAxis.horizontal, double? width, double? height, double? maxWidth, IconData? flipIcon, Color? flipButtonBackgroundColor, Color? flipButtonForegroundColor, String? flipButtonSemanticLabel, String? flipIconSemanticLabel, String? frontSemanticLabel, String? backSemanticLabel})
const

Properties

backBuilder → Widget Function(BuildContext context, bool isFlipped)
Builds the back face. Receives the BuildContext and whether the card is currently showing the back.
final
backSemanticLabel → String?
Semantics label announced while the back face shows. Defaults to 'Card back'.
final
flipAxis → BankFlipAxis
The rotation axis. Defaults to BankFlipAxis.horizontal.
final
flipButtonBackgroundColor → Color?
Background of the default flip button. Defaults to black at 30% alpha.
final
flipButtonBuilder → Widget Function(BuildContext context, VoidCallback flip)?
Replaces the default icon-button when trigger is builtInButton. The builder receives a flip callback that the custom widget should invoke on interaction.
final
flipButtonForegroundColor → Color?
Icon and splash colour of the default flip button. Defaults to Colors.white.
final
flipButtonSemanticLabel → String?
Semantics label of the default flip button. Defaults to 'Show card details'.
final
flipCurve → Curve
Curve applied to the flip animation. Defaults to Curves.easeInOutCubic.
final
flipDuration → Duration
Duration of the flip animation. Defaults to 500 ms.
final
flipIcon → IconData?
Glyph of the default flip button. Defaults to Icons.flip_outlined.
final
flipIconSemanticLabel → String?
Semantics label of the default flip button glyph. Defaults to 'Flip card'.
final
frontBuilder → Widget Function(BuildContext context, bool isFlipped)
Builds the front face. Receives the BuildContext and whether the card is currently showing the back (isFlipped = true during animation).
final
frontSemanticLabel → String?
Semantics label announced while the front face shows. Defaults to 'Card front'.
final
hashCode → int
The hash code for this object.
no setterinherited
height → double?
Fixed card height. When null (the default) the height is derived from the resolved width using the ISO 7810 ID-1 card ratio (kBankCardAspectRatio, 1.586) so flip cards match the rest of the card family.
final
isFlipped → bool?
When non-null, the card is controlled by the host. Pair with onFlip.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
maxWidth → double?
Upper bound on the card width when width is null. Defaults to 340, matching the previous fixed width.
final
onFlip → VoidCallback?
Called when the card's flip trigger fires. When isFlipped is null the card manages its own state and onFlip is optional (used as a side-effect callback). When isFlipped is provided the host must toggle it in onFlip.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
trigger → BankFlipTrigger
What causes the flip. Defaults to BankFlipTrigger.tapToFlip.
final
width → double?
Fixed card width. When null (the default) the card fills the available width up to maxWidth (340 when maxWidth is also null), so it renders at 340 in unconstrained contexts, exactly as older versions did.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<BankFlipCard>
Creates the mutable state for this widget at a given location in the tree.
override
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

Constants

builtInButtonClearance → const double
Horizontal extent a face must keep free of content from the card's end edge at the top corner when trigger is BankFlipTrigger.builtInButton: button inset + button footprint + a BankTokens.space2 gap.
builtInButtonExtent → const double
Footprint (width and height) of the default built-in flip button: an 18 px icon plus BankTokens.space2 padding on each side.
builtInButtonInset → const double
Inset of the built-in flip button from the card's top and end edges.