[flutter] FloatingActionButton을 사용하여 즐겨찾기 기능 구현하기

앱에서 특정 항목이나 기능을 즐겨찾기할 수 있는 기능은 많은 앱에서 사용되고 있습니다. Flutter 앱에서는 즐겨찾기 기능을 구현하기 위해 FloatingActionButton 위젯을 사용할 수 있습니다. 이 블로그 포스트에서는 Flutter 앱에서 FloatingActionButton을 사용하여 즐겨찾기 기능을 구현하는 방법에 대해 알아보겠습니다.

준비물

단계별 가이드

1. 프로젝트에 FloatingActionButton 위젯 추가

// FloatingActionButton을 추가할 화면의 코드 예시
import 'package:flutter/material.dart';

class BookmarkScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('즐겨찾기'),
      ),
      body: Center(
        child: Text('내 즐겨찾기 목록'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 즐겨찾기 추가 또는 삭제 로직 구현
        },
        child: Icon(Icons.bookmark),
        backgroundColor: Colors.blue,
      ),
    );
  }
}

2. onPressed 핸들러에 즐겨찾기 추가 또는 삭제 로직 구현

onPressed 핸들러에는 사용자가 버튼을 클릭했을 때 실행될 즐겨찾기 추가 또는 삭제 로직을 구현해야 합니다. 예를 들어, 사용자가 이미 즐겨찾기한 항목을 클릭했을 때는 즐겨찾기를 삭제하고, 즐겨찾기하지 않은 항목을 클릭했을 때는 즐겨찾기를 추가하는 등의 동작을 구현할 수 있습니다.

3. 즐겨찾기 상태 표시

해당 항목이 즐겨찾기되었는지 여부에 따라 FloatingActionButton의 색상이나 아이콘을 변경하여 사용자에게 현재 즐겨찾기 상태를 시각적으로 보여줄 수 있습니다.

마치며

Flutter의 FloatingActionButton을 사용하여 즐겨찾기 기능을 구현하는 방법에 대해 간단히 살펴보았습니다. 앱의 디자인 및 사용성에 따라 적절한 즐겨찾기 기능을 구현하여 사용자들에게 효과적인 서비스를 제공할 수 있습니다.

더 많은 정보를 원하시면 공식 Flutter 문서를 참고하시기 바랍니다.