device_preview 用のiPhone SE(第1世代)スキンを作りました

Flutterにはの[device_preview](https://pub.dev/packages/device_preview)という、素晴らしいデバイス画面シミュレータがあります。

が、ギリギリ現役な iPhone SE (第１世代）用のデバイス定義がありません。この端末は320x568解像度世代の最終機なので、やっぱりデバイス定義がほしい...。ということで、作ってみました。

# 出来た画面
![iphone_se_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43781/f1aa670d-f9bc-6cbd-f340-82c0e9a3b094.png)

# 使い方
```dart
import 'package:device_preview/device_preview.dart';
import './iphone_se_1.dart' as i_iphone_se_1;

void main() {
  runApp(
    DevicePreview(
      enabled: !kReleaseMode,
      builder: (_) => const MyApp(),
      devices: [
        i_iphone_se_1.info, // これ追加
        ...Devices.all,
      ],
    ),
  );
}
```

# iphone_se_1.dart

```iphone_se_1.dart
// ignore_for_file: non_constant_identifier_names, prefer_const_constructors

import 'package:device_frame/src/info/device_type.dart';
import 'package:device_frame/src/info/identifier.dart';
import 'package:device_frame/src/info/info.dart';
import 'package:flutter/material.dart';

final info = DeviceInfo(
  identifier: const DeviceIdentifier(
    TargetPlatform.iOS,
    DeviceType.phone,
    'iphone-se-1',
  ),
  name: 'iPhone SE (1st gen)',
  pixelRatio: 2.0,
  frameSize: const Size(891.0, 1866.0),
  screenSize: const Size(320.0, 568.0),
  safeAreas: const EdgeInsets.only(
    left: 0.0,
    top: 20.0,
    right: 0.0,
    bottom: 0.0,
  ),
  rotatedSafeAreas: const EdgeInsets.only(
    left: 0.0,
    top: 20.0,
    right: 0.0,
    bottom: 0.0,
  ),
  framePainter: const _FramePainter(),
  screenPath: _screenPath,
);

// Generated manually
final _screenPath = Path()
  ..moveTo(824, 280)
  ..lineTo(78, 280)
  ..lineTo(78, 1604)
  ..lineTo(824, 1604)
  ..lineTo(824, 280)
  ..close()
  ..fillType = PathFillType.evenOdd;

// Generated manually with https://fluttershapemaker.com/
class _FramePainter extends CustomPainter {
  const _FramePainter();

  @override
  void paint(Canvas canvas, Size size) {
    Paint paint_0_fill = Paint()..style = PaintingStyle.fill;
    paint_0_fill.color = Color(0xff666666).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(size.width * 0.6711560, 0, size.width * 0.1627385,
                size.height * 0.009646302),
            bottomRight: Radius.circular(size.width * 0.004489338),
            bottomLeft: Radius.circular(size.width * 0.004489338),
            topLeft: Radius.circular(size.width * 0.004489338),
            topRight: Radius.circular(size.width * 0.004489338)),
        paint_0_fill);

    Paint paint_1_fill = Paint()..style = PaintingStyle.fill;
    paint_1_fill.color = Color(0xff666666).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(0, size.height * 0.2384780, size.width * 0.02805836,
                size.height * 0.03001072),
            bottomRight: Radius.circular(size.width * 0.002244669),
            bottomLeft: Radius.circular(size.width * 0.002244669),
            topLeft: Radius.circular(size.width * 0.002244669),
            topRight: Radius.circular(size.width * 0.002244669)),
        paint_1_fill);

    Paint paint_2_fill = Paint()..style = PaintingStyle.fill;
    paint_2_fill.color = Color(0xff666666).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(0, size.height * 0.1404073, size.width * 0.02805836,
                size.height * 0.04769561),
            bottomRight: Radius.circular(size.width * 0.007856341),
            bottomLeft: Radius.circular(size.width * 0.007856341),
            topLeft: Radius.circular(size.width * 0.007856341),
            topRight: Radius.circular(size.width * 0.007856341)),
        paint_2_fill);

    Paint paint_3_fill = Paint()..style = PaintingStyle.fill;
    paint_3_fill.color = Color(0xff666666).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(0, size.height * 0.3210075, size.width * 0.02805836,
                size.height * 0.03001072),
            bottomRight: Radius.circular(size.width * 0.002244669),
            bottomLeft: Radius.circular(size.width * 0.002244669),
            topLeft: Radius.circular(size.width * 0.002244669),
            topRight: Radius.circular(size.width * 0.002244669)),
        paint_3_fill);

    Path path_4 = Path();
    path_4.moveTo(759, 12);
    path_4.cubicTo(831.901587, 12, 891, 71.098413, 891, 144);
    path_4.lineTo(891, 1734);
    path_4.cubicTo(891, 1806.90159, 831.901587, 1866, 759, 1866);
    path_4.lineTo(141, 1866);
    path_4.cubicTo(68.098413, 1866, 9, 1806.90159, 9, 1734);
    path_4.lineTo(9, 144);
    path_4.cubicTo(9, 71.098413, 68.098413, 12, 141, 12);
    path_4.lineTo(759, 12);
    path_4.close();

    Paint paint_4_fill = Paint()..style = PaintingStyle.fill;
    paint_4_fill.color = Color(0xff888888).withOpacity(1.0);
    canvas.drawPath(path_4, paint_4_fill);

    Paint paint_5_fill = Paint()..style = PaintingStyle.fill;
    paint_5_fill.color = Color(0xff121212).withOpacity(1.0);
    canvas.drawRect(
        Rect.fromLTWH(size.width * 0.01010101, size.height * 0.9072883,
            size.width * 0.9898990, size.height * 0.007502680),
        paint_5_fill);

    Paint paint_6_fill = Paint()..style = PaintingStyle.fill;
    paint_6_fill.color = Color(0xff121212).withOpacity(1.0);
    canvas.drawRect(
        Rect.fromLTWH(size.width * 0.01010101, size.height * 0.09163987,
            size.width * 0.9898990, size.height * 0.007502680),
        paint_6_fill);

    Paint paint_7_fill = Paint()..style = PaintingStyle.fill;
    paint_7_fill.color = Color(0xff121212).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(size.width * 0.02805836, size.height * 0.01500536,
                size.width * 0.9539843, size.height * 0.9753483),
            bottomRight: Radius.circular(size.width * 0.1324355),
            bottomLeft: Radius.circular(size.width * 0.1324355),
            topLeft: Radius.circular(size.width * 0.1324355),
            topRight: Radius.circular(size.width * 0.1324355)),
        paint_7_fill);

    Paint paint_8_fill = Paint()..style = PaintingStyle.fill;
    paint_8_fill.color = Color(0xff262C2D).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(size.width * 0.08080808, size.height * 0.1463023,
                size.width * 0.8496072, size.height * 0.7170418),
            bottomRight: Radius.circular(size.width * 0.006734007),
            bottomLeft: Radius.circular(size.width * 0.006734007),
            topLeft: Radius.circular(size.width * 0.006734007),
            topRight: Radius.circular(size.width * 0.006734007)),
        paint_8_fill);

    Paint paint_9_fill = Paint()..style = PaintingStyle.fill;
    paint_9_fill.color = Color(0xff2C2C2C).withOpacity(1.0);
    canvas.drawRRect(
        RRect.fromRectAndCorners(
            Rect.fromLTWH(size.width * 0.4208754, size.height * 0.08896034,
                size.width * 0.1672278, size.height * 0.009646302),
            bottomRight: Radius.circular(size.width * 0.01010101),
            bottomLeft: Radius.circular(size.width * 0.01010101),
            topLeft: Radius.circular(size.width * 0.01010101),
            topRight: Radius.circular(size.width * 0.01010101)),
        paint_9_fill);

    Paint paint_10_fill = Paint()..style = PaintingStyle.fill;
    paint_10_fill.color = Color(0xff2C2C2C).withOpacity(1.0);
    canvas.drawCircle(Offset(size.width * 0.5061728, size.height * 0.05627010),
        size.width * 0.01571268, paint_10_fill);

    Paint paint_11_fill = Paint()..style = PaintingStyle.fill;
    paint_11_fill.color = Color(0xff150B3F).withOpacity(1.0);
    canvas.drawCircle(Offset(size.width * 0.5061728, size.height * 0.05627010),
        size.width * 0.005611672, paint_11_fill);

    Path path_12 = Path();
    path_12.moveTo(449, 1651);
    path_12.cubicTo(492.630495, 1651, 528, 1686.3695, 528, 1730);
    path_12.cubicTo(528, 1773.6305, 492.630495, 1809, 449, 1809);
    path_12.cubicTo(405.369505, 1809, 370, 1773.6305, 370, 1730);
    path_12.cubicTo(370, 1686.3695, 405.369505, 1651, 449, 1651);
    path_12.close();
    path_12.moveTo(449, 1659);
    path_12.cubicTo(409.787783, 1659, 378, 1690.78778, 378, 1730);
    path_12.cubicTo(378, 1769.21222, 409.787783, 1801, 449, 1801);
    path_12.cubicTo(488.212217, 1801, 520, 1769.21222, 520, 1730);
    path_12.cubicTo(520, 1690.78778, 488.212217, 1659, 449, 1659);
    path_12.close();

    Paint paint_12_fill = Paint()..style = PaintingStyle.fill;
    paint_12_fill.color = Color(0xff262C2D).withOpacity(1.0);
    canvas.drawPath(path_12, paint_12_fill);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return false;
  }
}

```