FlutterでiPhoneのカメラのシャッターボタンみたいなやつを作る

こんなやつです。

CustomPainter を作成

class CirclePainter extends CustomPainter {
  final _paint = Paint()
    ..color = Colors.white
    ..strokeWidth = 5
    ..style = PaintingStyle.stroke;

  @override
  void paint(Canvas canvas, Size size) {
    canvas.drawOval(
      Rect.fromLTWH(0, 0, size.width, size.height),
      _paint,
    );
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => false;
}

これを使います。

SizedBox(
            width: 60,
            height: 60,
            child: CustomPaint(
              painter: CirclePainter(),
              child: Padding(
                padding: const EdgeInsets.all(7),
                child: InkWell(
                  onTap: () {
		   // シャッター処理
                  },
                  child: CircleAvatar(
                    backgroundColor: Colors.white,
                  ),
                ),
              ),
            ),
          ),