[Flutter] 안드로이드는 Material, iOS는 Cupertino 로 위젯을 보여주려면
3 min readFeb 8, 2020
Flutter를 시작하면 프로젝트 기본 설정이 Material Design을 따르도록 되어있습니다. Flutter에는 iOS를 지원하도록 Cupertino 라는 패키지를 제공합니다. iOS에서 제공하는 대부분의 기본 UI 컴포넌트를 가지고 있습니다.
Flutter 앱을 Android / iOS 두 플랫폼으로 제공한다면, 해당 플랫폼의 기기에 어울리는 UI를 보여주는 것이 더 좋은 사용자 경험을 가져올 수 있을 것입니다.
내장된 ‘dart:io’ 패키지에는 플랫폼 구분을 위한 Platform 클래스를 제공합니다. Android, iOS 뿐만아니라 Windows, Linux, macOS 그리고 Fuchsia까지 구분할 수 있습니다. 이 글에서는 Andorid, iOS 환경에 따라 다른 UI 위젯을 보여주는 방법을 알아봅니다.
class PlatformSwitch extends StatefulWidget {
PlatformSwitch(); @override
_PlatformSwitchState createState() => _PlatformSwitchState();
}class _PlatformSwitchState extends State<PlatformSwitch> {
bool _value = false; @override
Widget build(BuildContext context) {
if (Platform.isIOS) {
return CupertinoSwitch(value: _value, onChanged: onChanged);
}
return Switch(value: _value, onChanged: onChanged);
} onChanged(bool value) {
setState(() {
_value = value;
});
}
}
기본적인 Switch를 StatefulWidget으로 감싸고, build 메소드에서 Platform클래스로 플랫폼에 맞는 위젯 스위치를 그리면 됩니다.
Flutter에는 수많은 위젯이 있고 모든 위젯을 새로 만들기 힘듭니다. Flutter Platform Widget은 이런 수고를 덜어주는 패키지입니다. 이 패키지를 사용하면 Scaffold부터 Icon까지 안드로이드와 iOS 환경에 따라 다른 위젯을 그리는 설정을 조금은 수월하게 할 수 있습니다.
