mirror of
https://github.com/rive-app/rive-flutter.git
synced 2025-05-21 07:16:35 +08:00
improve Rive widget clipping and sizing
- Exposes `useArtboardSize` in RiveAnimation - Checks to see if clipping is disabled - Artboard.clip - Provides means to supply a custom Rect for clipping Diffs= fa6ed717b improve Rive widget clipping and sizing (#5154) 13863bf8f Rive Text for iOS and Android! (#5634) 9e0c43b70 Fix small bugs caught by JC (and Alex). (#5647) Co-authored-by: Gordon <pggordonhayes@gmail.com>
This commit is contained in:
@ -1 +1 @@
|
|||||||
d0c65132d98f2a82b0a51c0df7328179bdb5085d
|
fa6ed717b4c9e28f20cd20901f39b0dc44d8bbdd
|
||||||
|
@ -1,3 +1,8 @@
|
|||||||
|
## UPCOMING
|
||||||
|
|
||||||
|
- Expose `useArtboardSize` in `RiveAnimation` widget. Which is a boolean that determines whether to use the inherent size of the artboard, i.e. the absolute size defined by the artboard, or size the widget based on the available constraints only (sized by parent).
|
||||||
|
- Add `clipRect` to `RiveAnimation` and `Rive` widgets. Forces the artboard to clip with the provided Rect.
|
||||||
|
- Fixed `Rive` widget always applying a clip, regardless of `Artboard.clip` value (set in the Editor).
|
||||||
|
|
||||||
## 0.11.5
|
## 0.11.5
|
||||||
|
|
||||||
|
@ -8,6 +8,7 @@ class Rive extends LeafRenderObjectWidget {
|
|||||||
/// Artboard used for drawing
|
/// Artboard used for drawing
|
||||||
final Artboard artboard;
|
final Artboard artboard;
|
||||||
|
|
||||||
|
/// {@template Rive.useArtboardSize}
|
||||||
/// Determines whether to use the inherent size of the [artboard], i.e. the
|
/// Determines whether to use the inherent size of the [artboard], i.e. the
|
||||||
/// absolute size defined by the artboard, or size the widget based on the
|
/// absolute size defined by the artboard, or size the widget based on the
|
||||||
/// available constraints only (sized by parent).
|
/// available constraints only (sized by parent).
|
||||||
@ -25,6 +26,7 @@ class Rive extends LeafRenderObjectWidget {
|
|||||||
/// of an [IntrinsicWidth] or [IntrinsicHeight] widget or intend to directly
|
/// of an [IntrinsicWidth] or [IntrinsicHeight] widget or intend to directly
|
||||||
/// obtain the [RenderBox.getMinIntrinsicWidth] et al., you will want to set
|
/// obtain the [RenderBox.getMinIntrinsicWidth] et al., you will want to set
|
||||||
/// this to `true`.
|
/// this to `true`.
|
||||||
|
/// {@endtemplate}
|
||||||
final bool useArtboardSize;
|
final bool useArtboardSize;
|
||||||
|
|
||||||
/// Fit for the rendering artboard
|
/// Fit for the rendering artboard
|
||||||
@ -36,12 +38,22 @@ class Rive extends LeafRenderObjectWidget {
|
|||||||
/// Enables/disables antialiasing
|
/// Enables/disables antialiasing
|
||||||
final bool antialiasing;
|
final bool antialiasing;
|
||||||
|
|
||||||
|
/// {@template Rive.clipRect}
|
||||||
|
/// Clip the artboard to this rect.
|
||||||
|
///
|
||||||
|
/// If not supplied it'll default to the constraint size provided by the
|
||||||
|
/// parent widget. Unless the [Artboard] has clipping disabled, then no
|
||||||
|
/// clip will be applied.
|
||||||
|
/// {@endtemplate}
|
||||||
|
final Rect? clipRect;
|
||||||
|
|
||||||
const Rive({
|
const Rive({
|
||||||
required this.artboard,
|
required this.artboard,
|
||||||
this.useArtboardSize = false,
|
this.useArtboardSize = false,
|
||||||
this.antialiasing = true,
|
this.antialiasing = true,
|
||||||
BoxFit? fit,
|
BoxFit? fit,
|
||||||
Alignment? alignment,
|
Alignment? alignment,
|
||||||
|
this.clipRect,
|
||||||
}) : fit = fit ?? BoxFit.contain,
|
}) : fit = fit ?? BoxFit.contain,
|
||||||
alignment = alignment ?? Alignment.center;
|
alignment = alignment ?? Alignment.center;
|
||||||
|
|
||||||
@ -53,7 +65,8 @@ class Rive extends LeafRenderObjectWidget {
|
|||||||
..fit = fit
|
..fit = fit
|
||||||
..alignment = alignment
|
..alignment = alignment
|
||||||
..artboardSize = Size(artboard.width, artboard.height)
|
..artboardSize = Size(artboard.width, artboard.height)
|
||||||
..useArtboardSize = useArtboardSize;
|
..useArtboardSize = useArtboardSize
|
||||||
|
..clipRect = clipRect;
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
@ -65,7 +78,8 @@ class Rive extends LeafRenderObjectWidget {
|
|||||||
..fit = fit
|
..fit = fit
|
||||||
..alignment = alignment
|
..alignment = alignment
|
||||||
..artboardSize = Size(artboard.width, artboard.height)
|
..artboardSize = Size(artboard.width, artboard.height)
|
||||||
..useArtboardSize = useArtboardSize;
|
..useArtboardSize = useArtboardSize
|
||||||
|
..clipRect = clipRect;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -106,7 +120,13 @@ class RiveRenderObject extends RiveRenderBox {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
void beforeDraw(Canvas canvas, Offset offset) {
|
void beforeDraw(Canvas canvas, Offset offset) {
|
||||||
canvas.clipRect(offset & size);
|
// Apply clip rect if provided and return early
|
||||||
|
if (clipRect != null) {
|
||||||
|
return canvas.clipRect(clipRect!);
|
||||||
|
}
|
||||||
|
if (artboard.clip) {
|
||||||
|
canvas.clipRect(offset & size);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
|
@ -18,6 +18,7 @@ abstract class RiveRenderBox extends RenderBox {
|
|||||||
BoxFit _fit = BoxFit.none;
|
BoxFit _fit = BoxFit.none;
|
||||||
Alignment _alignment = Alignment.center;
|
Alignment _alignment = Alignment.center;
|
||||||
bool _useArtboardSize = false;
|
bool _useArtboardSize = false;
|
||||||
|
Rect? _clipRect;
|
||||||
|
|
||||||
bool get useArtboardSize => _useArtboardSize;
|
bool get useArtboardSize => _useArtboardSize;
|
||||||
|
|
||||||
@ -63,6 +64,15 @@ abstract class RiveRenderBox extends RenderBox {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Rect? get clipRect => _clipRect;
|
||||||
|
|
||||||
|
set clipRect(Rect? value) {
|
||||||
|
if (value != _clipRect) {
|
||||||
|
_clipRect = value;
|
||||||
|
markNeedsPaint();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
bool get sizedByParent => !useArtboardSize;
|
bool get sizedByParent => !useArtboardSize;
|
||||||
|
|
||||||
|
@ -48,6 +48,12 @@ class RiveAnimation extends StatefulWidget {
|
|||||||
/// Enable/disable antialiasing when rendering
|
/// Enable/disable antialiasing when rendering
|
||||||
final bool antialiasing;
|
final bool antialiasing;
|
||||||
|
|
||||||
|
/// {@macro Rive.useArtboardSize}
|
||||||
|
final bool useArtboardSize;
|
||||||
|
|
||||||
|
/// {@macro Rive.clipRect}
|
||||||
|
final Rect? clipRect;
|
||||||
|
|
||||||
/// Controllers for instanced animations and state machines; use this
|
/// Controllers for instanced animations and state machines; use this
|
||||||
/// to directly control animation states instead of passing names.
|
/// to directly control animation states instead of passing names.
|
||||||
final List<RiveAnimationController> controllers;
|
final List<RiveAnimationController> controllers;
|
||||||
@ -73,6 +79,8 @@ class RiveAnimation extends StatefulWidget {
|
|||||||
this.alignment,
|
this.alignment,
|
||||||
this.placeHolder,
|
this.placeHolder,
|
||||||
this.antialiasing = true,
|
this.antialiasing = true,
|
||||||
|
this.useArtboardSize = false,
|
||||||
|
this.clipRect,
|
||||||
this.controllers = const [],
|
this.controllers = const [],
|
||||||
this.onInit,
|
this.onInit,
|
||||||
Key? key,
|
Key? key,
|
||||||
@ -97,6 +105,8 @@ class RiveAnimation extends StatefulWidget {
|
|||||||
this.alignment,
|
this.alignment,
|
||||||
this.placeHolder,
|
this.placeHolder,
|
||||||
this.antialiasing = true,
|
this.antialiasing = true,
|
||||||
|
this.useArtboardSize = false,
|
||||||
|
this.clipRect,
|
||||||
this.controllers = const [],
|
this.controllers = const [],
|
||||||
this.onInit,
|
this.onInit,
|
||||||
this.headers,
|
this.headers,
|
||||||
@ -121,6 +131,8 @@ class RiveAnimation extends StatefulWidget {
|
|||||||
this.alignment,
|
this.alignment,
|
||||||
this.placeHolder,
|
this.placeHolder,
|
||||||
this.antialiasing = true,
|
this.antialiasing = true,
|
||||||
|
this.useArtboardSize = false,
|
||||||
|
this.clipRect,
|
||||||
this.controllers = const [],
|
this.controllers = const [],
|
||||||
this.onInit,
|
this.onInit,
|
||||||
Key? key,
|
Key? key,
|
||||||
@ -147,6 +159,8 @@ class RiveAnimation extends StatefulWidget {
|
|||||||
this.alignment,
|
this.alignment,
|
||||||
this.placeHolder,
|
this.placeHolder,
|
||||||
this.antialiasing = true,
|
this.antialiasing = true,
|
||||||
|
this.useArtboardSize = false,
|
||||||
|
this.clipRect,
|
||||||
this.controllers = const [],
|
this.controllers = const [],
|
||||||
this.onInit,
|
this.onInit,
|
||||||
Key? key,
|
Key? key,
|
||||||
@ -377,6 +391,8 @@ class RiveAnimationState extends State<RiveAnimation> {
|
|||||||
fit: widget.fit,
|
fit: widget.fit,
|
||||||
alignment: widget.alignment,
|
alignment: widget.alignment,
|
||||||
antialiasing: widget.antialiasing,
|
antialiasing: widget.antialiasing,
|
||||||
|
useArtboardSize: widget.useArtboardSize,
|
||||||
|
clipRect: widget.clipRect,
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
: widget.placeHolder ?? const SizedBox();
|
: widget.placeHolder ?? const SizedBox();
|
||||||
|
Reference in New Issue
Block a user