Fitst commit from Vinyl

Author: amalChandran

lib/vinyl/widget_viewer.dart

@@ -10,30 +10,51 @@ class WidgetViewer extends StatefulWidget {
 class _WidgetViewerState extends State<WidgetViewer> {
   double _horizontalRotation = 0;
   double _verticalRotation = 0;
+  double _zRotation = 0;
+  double _perspective = 0;
   double _zoom = 1;
 
+  final List<Color> colors = [Colors.green, Colors.yellow, Colors.purple];
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(title: Text('3D Widget Viewer')),
+      appBar: AppBar(title: Text('3D Stacked Widget Viewer')),
       body: Column(
         children: [
           Expanded(
             child: Center(
               child: Transform(
+                // setEntry(0, 3, x): Translates along the X-axis
+                // setEntry(1, 3, y): Translates along the Y-axis
+                // setEntry(2, 3, z): Translates along the Z-axis
                 transform: Matrix4.identity()
-                  ..setEntry(3, 2, 0.001) // perspective
-                  ..rotateY(_horizontalRotation * pi / 180)
-                  ..rotateX(_verticalRotation * pi / 180)
+                  ..setEntry(3, 2, 0.0003512553609721081) // perspectivez
+                  // ..setEntry(3, 1, _perspective) // y
+                  // ..setEntry(3, 0, _perspective) //x
+                  ..rotateY(323 * pi / 180) // horixontal
+                  ..rotateX(355 * pi / 180) // vertical
+                  ..rotateZ(6 * pi / 180) //z : 32
                   ..scale(_zoom),
                 alignment: Alignment.center,
-                child: Container(
-                  width: 200,
-                  height: 200,
-                  color: Colors.blue,
-                  child: Center(
-                      child: Text('2D Widget',
-                          style: TextStyle(color: Colors.white))),
+                child: Stack(
+                  children: List.generate(colors.length, (index) {
+                    return Transform(
+                      transform: Matrix4.identity()
+                        ..translate(0.0, 0.0, -index * 50.0), // -index * 50.0
+                      child: Container(
+                        width: 200,
+                        height: 200,
+                        color: colors[index],
+                        child: Center(
+                          child: Text(
+                            'Layer ${index + 1}',
+                            style: TextStyle(color: Colors.white),
+                          ),
+                        ),
+                      ),
+                    );
+                  }),
                 ),
               ),
             ),
@@ -56,6 +77,21 @@ class _WidgetViewerState extends State<WidgetViewer> {
                   label:
                       'Vertical Rotation: ${_verticalRotation.toStringAsFixed(0)}°',
                 ),
+                _buildSlider(
+                  value: _zRotation,
+                  onChanged: (value) => setState(() => _zRotation = value),
+                  label: 'Z Rotation: ${_zRotation.toStringAsFixed(0)}°',
+                ),
+                _buildSlider(
+                  value: _perspective,
+                  min: -0.1,
+                  max: 0.1,
+                  onChanged: (value) => setState(() {
+                    _perspective = value;
+                    print("Perspective, value: $_perspective");
+                  }),
+                  label: 'Perspective: ${_perspective.toStringAsFixed(0)}°',
+                ),
                 _buildSlider(
                   value: _zoom,
                   min: 0.5,