rotateY() causes container to disappear at 90 degrees but not -90 - flutter

Question

I'm learning Flutter and am tasked with creating some 3D type effects for transitions and other "wow" factor type things. I have been using flutter's transforms to achieve this but have run into a problem. When I rotate about the Y axis the plane containing whatever tab was showing disappears around the 80 degree mark and shows back up around the 100 degree mark. This does not happen when rotated at -90 degrees.
I've seen other answers posted such as transform: rotateY() making element disappear but none seem to cover this issue.
The question is; is there something I should be setting to avoid this since it is pretty close to off screen when I do it. If not is this a quirk or known bug in flutter's transition?
I am unable to put the full code and I'm not really familiar enough with flutter to rip out a bit and rough up an example quickly. Below is a code snippet and I'll come back with a better code snippet once I have more time. My apologies for that.
#override
Container build (BuildContext context) {
return Container(
child: Transform(
transform: Matrix4.identity()
..setEntry(3, 2, 0.004)
..translate(position.x, position.y, position.z)
..rotateX(rotation.x)
..rotateY(rotation.y)
..rotateZ(rotation.z),
child: CustomPaint(
painter: MyPainter(),
),
),
);
}
class MyPainter extends CustomPainter {
Size rectSize = Size(100, 100);
#override
Future<void> paint(Canvas canvas, Size size) async {
final paint = Paint()
..style = PaintingStyle.fill
..color = Colors.green;
Rect rect = Offset(-rectSize.width / 2.0, -rectSize.height / 2.0) & this.rectSize;
canvas.drawRect(rect, paint);
}
}
EDIT 1: I have tried to get a minimal example working but the rotation actually works as expected. I used the above code with no changes into a statefulwidget but the plane only disappears at 90 and 270 degrees as expected. I'll update the question if I find out anything else. Thanks to all who have looked at this.

Answer 1

After quite a number of hours since yesterday I have discovered the cause of the disappearance. Both fragments of code are held in a custom Container class which uses alignment: FractionalOffset.center to align them into the center of the screen. When this is removed the widgets return to the upper left hand corner and rotates as expected.
I'm not sure why this happens and would love to know if anybody has any ideas. However, below is a minimal replication of the issue. Uncomment the aligment: FractionalOffset.center line in runApp() to see the error in action.
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:vector_math/vector_math.dart' as Vector;
import 'dart:math';
void main() {
runApp(
MaterialApp(
theme: ThemeData.dark(),
home: Stack(
// alignment: FractionalOffset.center, // Remove the comment slashes to see issue
children: [
MyWidget(),
]
)
),
);
//runApp(MyApp());
}
class MyWidget extends StatefulWidget {
#override
State<StatefulWidget> createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {
Vector.Vector3 position = Vector.Vector3.zero();
Vector.Vector3 rotation = Vector.Vector3.zero();
int degrees = 0;
#override
initState() {
super.initState();
new Timer.periodic(Duration(milliseconds: 100), (timer) => {timerCall()});
}
void timerCall() {
setState(() {
});
}
#override
Container build (BuildContext context) {
degrees += 1;
if (degrees >= 360) degrees = 0;
rotation.y = degrees * (pi / 180);
return Container(
child: Transform(
transform: Matrix4.identity()
..setEntry(3, 2, 0.004)
..translate(position.x, position.y, position.z)
..rotateX(rotation.x)
..rotateY(rotation.y)
..rotateZ(rotation.z),
child: CustomPaint(
painter: MyPainter(),
),
),
);
}
}
class MyPainter extends CustomPainter {
Size rectSize = Size(200, 200);
#override
Future<void> paint(Canvas canvas, Size size) async {
final paint = Paint()
..style = PaintingStyle.fill
..color = Colors.green;
Rect rect = Offset(-rectSize.width / 2.0, -rectSize.height / 2.0) & this.rectSize;
canvas.drawRect(rect, paint);
}
#override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
// TODO: implement shouldRepaint
return true;
}
}