title: How to rotate a stack from element's center in flutter?
body: <p>I have a following code:</p>
  <pre><code>import 'package:flutter/material.dart';
  import 'package:flutter/rendering.dart';
  import 'dart:math' as math;
  
  void main() {
    debugPaintSizeEnabled = true;
    return runApp(MyApp());
  }
  
  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        home: Scaffold(
          backgroundColor: Colors.grey,
          body: SafeArea(
            child: ImageRotate(),
          ),
        ),
      );
    }
  }
  
  class ImageRotate extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return Transform.rotate(
        angle: (math.pi / 180) * 45,
        child: Stack(
          children: [
            Positioned(
              top: 100,
              left: 50,
              child: Image.network(
                &quot;https://via.placeholder.com/300x200&quot;,
                height: 200,
                width: 300,
              ),
            ),
          ],
        ),
      );
    }
  }
  
  </code></pre>
  <p>Now what I expect is the rotation to be executed from center of the image like so,</p>
  <p><a href="https://i.stack.imgur.com/KrRDE.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KrRDE.jpg" alt="enter image description here" /></a></p>
  <p>Instead it rotates like so,</p>
  <p><a href="https://i.stack.imgur.com/i5rjv.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/i5rjv.jpg" alt="enter image description here" /></a></p>
  <p>I also tried looking into transform origin. But I couldn't figure out the origin's offset by myself. Any help would be appreciated.</p>