반응형
오늘은 Flutter 에서 flutter_new_badger 를 사용하여 App Badge 를 사용하는 방법을 포스팅하겠습니다.
1. 최신버전을 pubspec.yaml 파일에 추가 현재는 1.1.0 입니다.
flutter_new_badger: ^1.1.0
https://pub.dev/packages/flutter_new_badger
flutter_new_badger | Flutter package
A flutter project to handle app icon badges for iOS, macOS and android
pub.dev
2.기본사용법은 다음과 같습니다.
1. Set 하는 방법
FlutterNewBadger.setBadge(5);
2. Reset 하는 법
FlutterNewBadger.removeBadge();
3. get 하는 법
int? badge = await FlutterNewBadger.getBadge();
4. Incremet 하는 법
int? int = await FlutterNewBadger.incrementBadgeCount();
5. Decrement 하는 법
int? int = await FlutterNewBadger.decrementBadgeCount();
3.아래는 공식문서에 있는 코드입니다.
아래를 보면서 정적으로 코드를 작성할 수 있습니다.
// Copyright 2024 Simon Braillard
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import 'dart:developer' as developer;
import 'package:flutter/material.dart';
import 'package:flutter_new_badger/flutter_new_badger.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
int? badgeCount;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Plugin example app'),
),
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Text('New badger plugin'),
const SizedBox(height: 16),
Text('Badge count: $badgeCount'),
const SizedBox(height: 16),
ElevatedButton(
onPressed: () async {
await FlutterNewBadger.setBadge(5);
setState(() {
badgeCount = 5;
});
developer.log('Badge set', name: 'FlutterNewBadger');
},
child: const Text('Set 5 badges'),
),
const SizedBox(height: 16),
ElevatedButton(
onPressed: () async {
await FlutterNewBadger.removeBadge();
setState(() {
badgeCount = null;
});
developer.log('Badge removed', name: 'FlutterNewBadger');
},
child: const Text('Remove badge'),
),
const SizedBox(height: 16),
ElevatedButton(
onPressed: () async {
badgeCount = await FlutterNewBadger.incrementBadgeCount();
setState(() {});
developer.log('Badge count incremented: $badgeCount',
name: 'FlutterNewBadger');
},
child: const Text('Increment badge count'),
),
const SizedBox(height: 16),
ElevatedButton(
onPressed: () async {
badgeCount = await FlutterNewBadger.decrementBadgeCount();
setState(() {});
developer.log('Badge count decremented: $badgeCount',
name: 'FlutterNewBadger');
},
child: const Text('Decrement badge count'),
),
const SizedBox(height: 16),
ElevatedButton(
onPressed: () async {
badgeCount = await FlutterNewBadger.getBadge();
setState(() {});
developer.log('Badge count : $badgeCount',
name: 'FlutterNewBadger');
},
child: const Text('Get badge count'),
),
],
),
),
),
);
}
}
다음 포스팅에서는 SharedPreferences 를 사용하여서 동적으로 앱 아이콘 뱃지 기능이 작동하도록 설정해보겠습니다.
반응형
'Flutter' 카테고리의 다른 글
[Flutter] Firebase FCM 사용하기 Part. 4-3 (ios) (0) | 2025.02.14 |
---|---|
[Flutter] App Badge 사용하는 방법. (flutter_new_badger) 2탄 (0) | 2025.02.13 |
[Flutter] Firebase FCM 사용하기 Part. 4-2 (ios) (0) | 2025.02.03 |
[Flutter] Firebase FCM 사용하기 Part. 4-1 (ios) (0) | 2025.02.03 |
[Flutter] 안드로이드 뒤로가기 버튼 listener (0) | 2025.01.17 |