[TIL] 5주차 메모 앱 개발

내일배움캠프 Flutter 앱 개발

 

메모앱 검색기능 개발

검색기능의 두 가지 방식

1. 사용자가 검색을 할 때 파이어베이스 쿼리 조회로 검색
+메모 데이터 다 가져올 필요가 없음
+실시간 데이터를 반영할 수 있음
-검색할 때마다 비용 발생
-인터넷 연결 필수

2. 검색시 앱 내의 모든 메모 정보 로드 후 앱 내에서 검색
+빠른 검색 가능
+오프라인 상태에서도 검색 가능
+키보드 입력별로 실시간 검색 처리 가능
-메모양이 방대해지면 한 번에 불러오기 어려움
-실시간 데이터 반영할 수 없음

 

구글 애드몹 설정
: 앱 내에 광고 배치
1. 구글 애드몹 가입
2.구글 애드몹 콘솔에 연동할 앱 생성
3.광고 단위 추가

<meta-data
      android:name="com.google.android.gms.ads.APPLICATION_ID"
    android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>

애드몹 앱 ID를 넣어줘야 함.

4.구글 광고 SDK 초기화

 MobileAds.instance.initialize();

5.광고 위젯 컴포넌트 만들기

import 'package:flutter/widgets.dart';

class AdmobBanner extends StatefulWidget {
  const AdmobBanner({super.key});

  @override
  State<AdmobBanner> createState() => _AdmobBannerState();
}

class _AdmobBannerState extends State<AdmobBanner> {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

6. 광고 로드는 한 번만 되어야 하므로 statefulWidget의 라이프 사이클의 initState 때 광고 로드 함수 호출하기

class _AdmobBannerState extends State<AdmobBanner> {
  AdManagerBannerAd? _bannerAd;
  bool _isLoaded = false;

  final adUnitId = '/21775744923/example/adaptive-banner';

  void loadAd() {
    _bannerAd = AdManagerBannerAd(
      adUnitId: adUnitId,
      request: const AdManagerAdRequest(),
      sizes: [AdSize.banner],
      listener: AdManagerBannerAdListener(
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        onAdFailedToLoad: (ad, err) {
          ad.dispose();
        },
      ),
    )..load();
  }

  @override
  void initState() {
    super.initState();
    loadAd();
  }

  @override
  Widget build(BuildContext context) {
    if (_bannerAd != null && _isLoaded) {
      return SizedBox(
        width: _bannerAd!.sizes.first.width.toDouble(),
        height: _bannerAd!.sizes.first.height.toDouble(),
        child: AdWidget(ad: _bannerAd!),
      );
    }
    return Container(height: 1);
  }
}