[flutter] cupertino_icons를 이용한 아이콘에 데이터 캐싱 기능 설정하기

목차

소개

cupertino_icons는 Flutter의 아이콘을 빠르고 쉽게 사용할 수 있는 라이브러리입니다. 이 라이브러리를 사용하면 iOS의 아이콘 디자인을 간편하게 적용할 수 있습니다. 이번에는 cupertino_icons를 사용하여 아이콘에 데이터 캐싱 기능을 설정하는 방법에 대해 알아보겠습니다.

cupertino_icons 라이브러리 설치하기

먼저, cupertino_icons 라이브러리를 사용하려면 pubspec.yaml 파일에 의존성을 추가해야 합니다. 다음과 같이 코드를 수정해주세요:

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.0

이제 pubspec.yaml 파일을 저장하고, Flutter 프로젝트를 업데이트해줍니다:

flutter pub get

아이콘에 데이터 캐싱 기능 추가하기

다음으로, cupertino_icons를 사용하여 아이콘에 데이터 캐싱 기능을 추가해보겠습니다. 먼저, Icon 위젯을 사용하여 원하는 아이콘을 표시합니다:

import 'package:flutter/material.dart';
import 'package:cupertino_icons/cupertino_icons.dart';

class MyIconPage extends StatefulWidget {
  @override
  _MyIconPageState createState() => _MyIconPageState();
}

class _MyIconPageState extends State<MyIconPage> {
  bool isFavorite = false;

  @override
  Widget build(BuildContext context) {
    return IconButton(
      icon: Icon(
        isFavorite ? CupertinoIcons.heart_fill : CupertinoIcons.heart,
        color: Colors.red,
      ),
      onPressed: () {
        setState(() {
          isFavorite = !isFavorite;
        });
      },
    );
  }
}

위 코드에서는 Icon 위젯을 사용하여 CupertinoIcons.heart_fill 아이콘과 CupertinoIcons.heart 아이콘을 구분하고, isFavorite 변수에 따라 표시되는 아이콘을 바꿉니다. 각 아이콘에 적절한 색상을 지정할 수도 있습니다.

Icon 위젯에 IconButton을 감싸고, onPressed 콜백을 사용하여 아이콘이 클릭되었을 때 isFavorite 변수를 변경해주는 기능을 추가했습니다.

결론

위에서 설명한 방법으로 cupertino_icons를 사용하여 아이콘에 데이터 캐싱 기능을 설정할 수 있습니다. 이를 통해 효율적인 아이콘 관리와 상태 업데이트를 할 수 있습니다. Flutter에서 아이콘을 사용할 때는 cupertino_icons를 사용하는 것을 추천합니다.

참고 자료