충돌 해결: 앱 아이콘 배경색 업데이트

2025-03-16 21:23:25 +09:00
parent f79c52c690 0e714af410
commit f62d89b040
12 changed files with 60 additions and 52 deletions
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -1,3 +1,4 @@
+
 apply plugin: 'com.android.application'

 android {
@@ -49,6 +50,9 @@ dependencies {
    androidTestImplementation "androidx.test.ext:junit:$androidxJunitVersion"
    androidTestImplementation "androidx.test.espresso:espresso-core:$androidxEspressoCoreVersion"
    implementation project(':capacitor-cordova-android-plugins')
+    
+    // 스플래시 화면 플러그인 추가
+    implementation "androidx.core:core-splashscreen:1.0.0"
 }

 apply from: 'capacitor.build.gradle'
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -1,3 +1,4 @@
+
 <?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android">

@@ -15,7 +16,8 @@
            android:label="@string/title_activity_main"
            android:theme="@style/AppTheme.NoActionBarLaunch"
            android:launchMode="singleTask"
-            android:exported="true">
+            android:exported="true"
+            android:screenOrientation="portrait">

            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
--- a/android/app/src/main/java/com/lovable/zellyfinance/MainActivity.java
+++ b/android/app/src/main/java/com/lovable/zellyfinance/MainActivity.java
@@ -1,5 +1,16 @@
+
 package com.lovable.zellyfinance;

+import android.os.Bundle;
 import com.getcapacitor.BridgeActivity;
+import com.getcapacitor.Plugin;

-public class MainActivity extends BridgeActivity {}
+public class MainActivity extends BridgeActivity {
+    @Override
+    public void onCreate(Bundle savedInstanceState) {
+        super.onCreate(savedInstanceState);
+        
+        // 스플래시 화면 처리를 위한 추가 초기화 코드
+        registerPlugin(com.capacitorjs.plugins.splashscreen.SplashScreenPlugin.class);
+    }
+}
--- a/android/app/src/main/res/values/ic_launcher_background.xml
+++ b/android/app/src/main/res/values/ic_launcher_background.xml
@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_background">#f2f2f2</color>
-</resources>
+    <color name="ic_launcher_background">#F0F4F8</color>
+</resources>
--- a/android/app/src/main/res/values/styles.xml
+++ b/android/app/src/main/res/values/styles.xml
@@ -1,3 +1,4 @@
+
 <?xml version="1.0" encoding="utf-8"?>
 <resources>

@@ -18,5 +19,6 @@

    <style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
        <item name="android:background">@drawable/splash</item>
+        <item name="android:statusBarColor">@color/ic_launcher_background</item>
    </style>
-</resources>
+</resources>
--- a/capacitor.config.ts
+++ b/capacitor.config.ts
@@ -11,10 +11,12 @@ const config: CapacitorConfig = {
  },
  plugins: {
    SplashScreen: {
-      launchShowDuration: 2000,
-      backgroundColor: "#f2f2f2",
+      launchShowDuration: 3000, // 스플래시 화면 표시 시간 3초로 증가
+      backgroundColor: "#F0F4F8", // 배경색 밝은 회색으로 변경
      androidScaleType: "CENTER_CROP",
-      showSpinner: false
+      showSpinner: true, // 로딩 스피너 표시
+      spinnerColor: "#6BCB77", // 스피너 색상 (브랜드 색상)
+      androidSpinnerStyle: "large" // 안드로이드 스피너 크기
    },
    Keyboard: {
      resize: "body",
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
        "@capacitor/core": "^7.1.0",
        "@capacitor/ios": "^7.1.0",
        "@capacitor/keyboard": "^7.0.0",
+        "@capacitor/splash-screen": "^7.0.0",
        "@hookform/resolvers": "^3.9.0",
        "@radix-ui/react-accordion": "^1.2.0",
        "@radix-ui/react-alert-dialog": "^1.1.1",
@@ -236,6 +237,15 @@
        "@capacitor/core": ">=7.0.0"
      }
    },
+    "node_modules/@capacitor/splash-screen": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/@capacitor/splash-screen/-/splash-screen-7.0.0.tgz",
+      "integrity": "sha512-y25WNRcl+MY/ltb3OZPZPpNmhVFW9270QneJY8tjY7FJc78zWEszj1cX84LJS4LeTHfHi4NcNW4y0/oewWG88A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": ">=7.0.0"
+      }
+    },
    "node_modules/@esbuild/aix-ppc64": {
      "version": "0.21.5",
      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
    "@capacitor/core": "^7.1.0",
    "@capacitor/ios": "^7.1.0",
    "@capacitor/keyboard": "^7.0.0",
+    "@capacitor/splash-screen": "^7.0.0",
    "@hookform/resolvers": "^3.9.0",
    "@radix-ui/react-accordion": "^1.2.0",
    "@radix-ui/react-alert-dialog": "^1.1.1",
--- a/src/components/RecentTransactionsSection.tsx
+++ b/src/components/RecentTransactionsSection.tsx
@@ -1,29 +1,27 @@
-
 import React, { useState } from 'react';
 import { Transaction } from './TransactionCard';
 import TransactionEditDialog from './TransactionEditDialog';
 import { ChevronRight } from 'lucide-react';
 import { useBudget } from '@/contexts/BudgetContext';
 import { Link } from 'react-router-dom';
-
 interface RecentTransactionsSectionProps {
  transactions: Transaction[];
  onUpdateTransaction?: (transaction: Transaction) => void;
 }
-
-const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({ 
+const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
  transactions,
-  onUpdateTransaction 
+  onUpdateTransaction
 }) => {
  const [selectedTransaction, setSelectedTransaction] = useState<Transaction | null>(null);
  const [isDialogOpen, setIsDialogOpen] = useState(false);
-  const { updateTransaction, deleteTransaction } = useBudget();
-
+  const {
+    updateTransaction,
+    deleteTransaction
+  } = useBudget();
  const handleTransactionClick = (transaction: Transaction) => {
    setSelectedTransaction(transaction);
    setIsDialogOpen(true);
  };
-
  const handleUpdateTransaction = (updatedTransaction: Transaction) => {
    if (onUpdateTransaction) {
      onUpdateTransaction(updatedTransaction);
@@ -31,16 +29,13 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
    // 직접 컨텍스트를 통해 업데이트
    updateTransaction(updatedTransaction);
  };
-
  const handleDeleteTransaction = (id: string) => {
    // 직접 컨텍스트를 통해 삭제
    deleteTransaction(id);
  };
-
  const formatCurrency = (amount: number) => {
    return amount.toLocaleString('ko-KR') + '원';
  };
-
  const getCategoryIcon = (category: string) => {
    switch (category) {
      case '식비':
@@ -61,9 +56,7 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
        return '💰';
    }
  };
-
-  return (
-    <div className="mt-6">
+  return <div className="mt-6 mb-[50px]">
      <div className="flex justify-between items-center mb-3">
        <h2 className="text-lg font-semibold">최근 지출</h2>
        <Link to="/transactions" className="text-sm text-neuro-income flex items-center">
@@ -71,44 +64,24 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
        </Link>
      </div>
      <div className="neuro-card divide-y divide-gray-100 w-full">
-        {transactions.length > 0 ? (
-          transactions.map((transaction) => (
-            <div 
-              key={transaction.id} 
-              className="flex justify-between py-3 px-4 cursor-pointer hover:bg-gray-50" 
-              onClick={() => handleTransactionClick(transaction)}
-            >
+        {transactions.length > 0 ? transactions.map(transaction => <div key={transaction.id} onClick={() => handleTransactionClick(transaction)} className="flex justify-between py-3 px-4 cursor-pointer hover:bg-gray-50">
              <div className="flex items-center">
                <span className="text-xl mr-3">{getCategoryIcon(transaction.category)}</span>
                <div>
-                  <h3 className="font-medium">{transaction.title}</h3>
+                  <h3 className="font-medium text-black">{transaction.title}</h3>
                  <p className="text-xs text-gray-500">{transaction.date}</p>
                </div>
              </div>
              <div className="text-right">
-                <p className="font-semibold text-red-500">-{formatCurrency(transaction.amount)}</p>
+                <p className="font-semibold text-neuro-income">-{formatCurrency(transaction.amount)}</p>
                <p className="text-xs text-gray-500">{transaction.category}</p>
              </div>
-            </div>
-          ))
-        ) : (
-          <div className="py-4 text-center text-gray-500">
+            </div>) : <div className="py-4 text-center text-gray-500">
            지출 내역이 없습니다
-          </div>
-        )}
+          </div>}
      </div>

-      {selectedTransaction && (
-        <TransactionEditDialog
-          transaction={selectedTransaction}
-          open={isDialogOpen}
-          onOpenChange={setIsDialogOpen}
-          onSave={handleUpdateTransaction}
-          onDelete={handleDeleteTransaction}
-        />
-      )}
-    </div>
-  );
+      {selectedTransaction && <TransactionEditDialog transaction={selectedTransaction} open={isDialogOpen} onOpenChange={setIsDialogOpen} onSave={handleUpdateTransaction} onDelete={handleDeleteTransaction} />}
+    </div>;
 };
-
 export default RecentTransactionsSection;
--- a/src/components/analytics/CategorySpendingList.tsx
+++ b/src/components/analytics/CategorySpendingList.tsx
@@ -12,11 +12,13 @@ interface CategorySpending {
 interface CategorySpendingListProps {
  categories: CategorySpending[];
  totalExpense: number;
+  className?: string;
 }

 const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
  categories,
-  totalExpense
+  totalExpense,
+  className = ""
 }) => {
  const isMobile = useIsMobile();
  
@@ -31,7 +33,7 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
  };

  return (
-    <div className="neuro-card mb-6 w-full">
+    <div className={`neuro-card mb-6 w-full ${className}`}>
      {categories.some(cat => cat.current > 0) ? (
        <div className="space-y-4">
          {categories.map((category) => (
--- a/src/pages/Analytics.tsx
+++ b/src/pages/Analytics.tsx
@@ -164,6 +164,7 @@ const Analytics = () => {
        <CategorySpendingList 
          categories={categorySpending}
          totalExpense={totalExpense}
+          className="mb-[50px]"
        />
      </div>

--- a/src/pages/Transactions.tsx
+++ b/src/pages/Transactions.tsx
@@ -155,7 +155,7 @@ const Transactions = () => {

        {/* Transactions By Date */}
        {!isLoading && transactions.length > 0 && (
-          <div className="space-y-6">
+          <div className="space-y-6 mb-[50px]">
            {Object.entries(groupedTransactions).map(([date, transactions]) => (
              <div key={date}>
                <div className="flex items-center gap-2 mb-3">