[flutter] 유데미x스나이퍼팩토리 프로젝트 캠프 - 15일차 과제 :

손세은·2023년 10월 14일
0

<15일차 과제 요구 사항>

coinapp.gif

  1. 위의 결과물처럼 메인페이지에서의 코인이 1초마다 +1씩 되도록 만드시오.

    • 사용된 비트코인은 FontAwesome의 아이콘을 활용한다.
      Icon(
          FontAwesomeIcons.bitcoin,
          size: 96.0,
          color: Colors.yellow.shade700,
      ),
  2. CoinController를 만들고, GetxController를 extends하여 위와 같은 결과물을 만들 수 있도록 하시오.

    • 코인은 int형의 데이터를 가지며, 관측가능한 형태의 데이터타입으로 사용한다.
    • 이 때 Timer를 사용할 수 있도록 한다.
    • 코인이 10의 배수가 될때 마때, 코인 10n개를 달성했다는 안내문구를 출력하도록 한다.
      (Getx의 워커중 상황에 맞는 올바른 워커를 사용할 것)
  3. [상점으로 이동하기] 버튼을 누르면 상점 페이지로 이동한다.

    • 상점페이지에서도 보유한 코인을 볼 수 있다.
    • 코인 리셋을 누르면 보유한 코인이 다시 0개로 바뀐다.
  4. GetxController를 활용하여 다음의 정보를 포함하고있는 “전역”컨트롤러를 만드시오
    (위와 같은 프로젝트에 만들기)

  • 컨트롤러명은 다음과 같다.
    • AppSettingController
  • 포함되어야 하는 멤버변수는 다음과 같다.
    boolisSoundOn
    boolisNotificationOn
    StringappVersion
    StringappName
    StringappAuthor
    StringappPackageName
    DateTime?lastUpdated
  • 위 데이터를 메인페이지에서 Get.put하여 전역에서 사용할 수 있도록 등록하고, 최소 두 페이지 이상에 Get.find하여 해당 데이터를 불러올 수 있도록 하시오.
  • 페이지 명, 페이지 수는 상관없으며 임의로 존재하는 페이지로 한다.
    이 때 페이지들은 서로 네비게이션을 다음과 같이 할 수 있도록 한다.
    ```dart
    Get.to(()=>페이지명());
    ```

과제코드

  • lib/controller/controller.dart
import 'dart:async';

import 'package:get/get.dart';

class AppController extends GetxController {
  RxInt count = 0.obs; // GetX의 상태 변수

  startTimer() {
    Timer.periodic(Duration(seconds: 1), (timer) {
      // 타이머가 실행될 때마다 count 변수를 1씩 증가시킵니다.
      count.value++;
    });
  }

  
  void onInit() {
    // TODO: implement onInit
    super.onInit();
    startTimer();
    ever(
      count,
      (newValue) {
        if (count % 10 == 0 && count != 0) {
          return Get.snackbar('코인 ${count}개 돌파!', '축하합니다!');
        }
      },
    );
  }
}
  • lib/controller/app_setting_controller.dart
import 'package:get/get.dart';

class AppSettingController extends GetxController {
  RxBool isSoundOn;
  RxBool isNotificationOn;
  String appVersion;
  String appName;
  String appAuthor;
  String appPackageName;
  DateTime lastUpdated;

  AppSettingController({
    required this.isSoundOn,
    required this.isNotificationOn,
    required this.appVersion,
    required this.appName,
    required this.appAuthor,
    required this.appPackageName,
    required this.lastUpdated,
  });
}
  • lib/pages/main_page.dart
import 'package:day16_assignment/controller/app_setting_controller.dart';
import 'package:day16_assignment/pages/sub_page.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:get/get.dart';

import '../controller/app_controller.dart';

class MainPage extends StatefulWidget {
  MainPage({super.key});

  
  State<MainPage> createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  
  Widget build(BuildContext context) {
    final controller = Get.put(AppController());
    final appSettingController = Get.put(
      AppSettingController(
        isSoundOn: RxBool(true),
        isNotificationOn: RxBool(true),
        appVersion: "1.0.0",
        appName: '김건으로 탕후루 만들기',
        appAuthor: '손세은',
        appPackageName: 'thoothBreak',
        lastUpdated: DateTime.now(),
      ),
    );

    return SafeArea(
      child: Scaffold(
        body: Align(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Align(
                alignment: AlignmentDirectional.topStart,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Obx(() => Text(
                        '브금 상태: ${appSettingController.isSoundOn.value.toString()}',
                        style: TextStyle(fontSize: 24))),
                    TextButton(
                        onPressed: () {
                          appSettingController.isSoundOn.value =
                              !appSettingController.isSoundOn.value;
                        },
                        child: Text('브금 틀기')),
                  ],
                ),
              ),
              Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Obx(() => Text('Count: ${controller.count.value}',
                        style: TextStyle(fontSize: 24))),
                    Icon(
                      FontAwesomeIcons.bitcoin,
                      size: 96.0,
                      color: Colors.yellow.shade700,
                    ),
                    TextButton(
                        onPressed: () {
                          Get.to(() => SubPage());
                        },
                        child: Text('상점으로 이동하기')),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
  • lib/pages/sub_page.dart
import 'package:day16_assignment/controller/app_setting_controller.dart';
import 'package:day16_assignment/pages/main_page.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../controller/app_controller.dart';

class SubPage extends StatelessWidget {
  const SubPage({super.key});

  
  Widget build(BuildContext context) {
    var controller = Get.find<AppController>();
    final appSettingController = Get.find<AppSettingController>();
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('상점', style: TextStyle(fontSize: 20)),
            Obx(() => Text('현재 보유한 코인: ${controller.count.value}',
                style: TextStyle(fontSize: 25))),
            TextButton(
                onPressed: () {
                  controller.count.value = 0;
                },
                child: Text('코인리셋')),
            TextButton(
              onPressed: () {
                if (appSettingController.isNotificationOn.value) {
                  showDialog(
                    context: context,
                    builder: (context) {
                      return AlertDialog(
                        title: Text('정말 돌아가시겠습니까?'),
                        actions: [
                          TextButton(
                            onPressed: () {
                              Get.to(() => MainPage());
                            },
                            child: Text('넵 돌아갈래유'),
                          ),
                        ],
                      );
                    },
                  );
                }
              },
              child: Text('돌아가기'),
            )
          ],
        ),
      ),
    );
  }
}
  • lib/main.dart
import 'package:flutter/material.dart';

import 'page/main_page.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark(),
      home: MainPage(),
    );
  }
}

결과

Untitled

Untitled

Untitled

profile
힙스터 개발자가 될래요

0개의 댓글