UI 10

[7/14] Canvas 위가 아닌 Camera 배경으로 배경 이미지와 캐릭터 넣기

🎮 오늘 한 일UI Canvas 위가 아닌 Camera 배경으로 배경 이미지와 캐릭터를 넣고 싶어서 실험 진행Quad 오브젝트를 생성하여 씬에 배치Material 을 생성하여 배경 이미지를 넣음 (캐릭터도 마찬가지)해당 Material 을 Quad 오브젝트에 드래그해서 적용배경과 캐릭터가 월드 공간에서 자연스럽게 카메라에 보임🧠 배운 점 / 느낀 점Canvas의 Render Mode를 Screen Space - Overlay로 하면 UI와 배경/캐릭터가 완전히 분리됨.UI를 World Space로 하려면 카메라 거리, 크기 모두 신경써야한다.2D 스타일 배경이나 캐릭터 쓸 때는 Albedo만 잘 써도 충분히 자연스러워 보인다.

TIL 2025.07.16

[7/10] 기존 UI 구조에 외부 에셋 통합 작업

🎮 오늘 한 일기존 UI 구조에 외부 에셋 통합 작업 진행MessagePopup 기능 테스트 및 AnimationRect와의 병행 여부 실험팝업 애니메이션 연출 방식 결정 (MessagePopup의 DOTween만 사용하기로 정리)하이어라키 구조 정리에 따라 팝업 오브젝트 재배치 및 정돈TMP SubMeshUI 컴포넌트 자동 생성 현상 확인 및 원리 파악🧠 배운 점 / 느낀 점TMP SubMeshUI는 TextMeshPro의 내부 렌더링용 오브젝트이며 삭제해도 자동 생성되므로 신경 쓸 필요 없음SetActive(true) → alpha = 0 → DOFade(1) 순서로 써도 무방하지만, alpha 설정을 먼저 하면 깜빡임을 줄일 수 있음AnimationRect는 여러 UI의 순차 등장에 유용하지만,..

TIL 2025.07.11

[6/24] 다용도로 쓸 팝업 제작 및 여러 UI 세팅들 실험

🎮 오늘 한 일로딩 씬LoadingSceneController 내 최소 대기 시간을 2 초 → 1 초로 축소Setting 팝업 완성SettingPanel(반투명 배경) + SettingPopup(창)로 분리배경 클릭 시 CloseSetting() / 팝업 내부 클릭은 무시UI 리소스·스크립트 정리Scripts/UI/ 폴더로 이동, 이미지 LeftArrow → BackButton 등 명명 통일Canvas & 3D 테스트Overlay 모드가 카메라 시야와 무관하게 렌더링됨을 확인3D Object가 UI 뒤에 가릴 때 해결책 실험🧠 배운 점Raycast TargetON : 클릭 이벤트를 가로채고 처리OFF : 이벤트를 통과시켜 뒤 UI로 전달팝업 외부 클릭 닫기 = 배경(Button + Raycast ON..

TIL 2025.07.02

ATM 입출금 기능 전체 구현 및 입력 처리 완성

✅ 작업한 내용입금 UI 구성 (STEP 5)Deposit 오브젝트 구성Vertical Layout Group + Content Size Fitter로 버튼 정렬10,000 / 30,000 / 50,000 버튼 + 직접 입력 InputField + 뒤로 가기 버튼 구성출금 UI 구성 (STEP 6)Withdraw 오브젝트 구성입금 UI와 동일한 구조로 출금 화면 구성UI 전환 기능 구현 (STEP 7)PopupBank.cs에 ShowATM(), ShowDeposit(), ShowWithdraw() 함수 작성버튼 이벤트에 OnClick()으로 연결Start()에서 ShowATM() 호출로 기본화면 설정버튼을 통한 입금 기능 구현 (STEP 8)Deposit(int amount) 메서드에서 금액 계산 및 U..

TIL 2025.06.05

ATM 시스템 UI 구성 및 데이터 연동 구현

✅ 작업한 내용기본 UI 구현 (STEP 1)Sparta Bank, ATM, 현금, 잔액, 입출금 버튼 배치현금: 기본 100,000원 / 잔액: 기본 50,000원string.Format("{0:#,0}") 사용해 금액 3자리마다 쉼표 표시 처리UserData 클래스 작성 (STEP 2)이름, 현금, 잔액 필드 보유MonoBehaviour로 작성해 빈 오브젝트에 붙여 Inspector에서 설정 가능하도록 구성GameManager 제작 및 싱글톤 패턴 적용 (STEP 3)public static GameManager Instance 구조로 싱글톤 패턴 구현[System.Serializable] 사용하여 UserData 클래스 인스펙터에서 표시되도록 설정생성자 이용한 초기화 시도 → Inspector에서 ..

TIL 2025.06.05

Pause / GameOver UI 기능 안정화 및 반복 사용 대응 개선

🎮 오늘 한 일1. Pause UI 개선Pause → Resume → Pause 루프에서 두 번째 Pause 시 UI가 뜨지 않던 버그 수정UIManager.Open() 호출 시 Open() 함수에서 버튼 패널 상태를 초기화하도록 수정PauseUI.Open() 오버라이드하여 buttonPanel, resumePanel, countdownText 상태 초기화 추가2. Resume 버튼 이벤트 방식 통일OnClick()을 코드에서 할당하도록 변경하여 Prefab 내 미리 연결해둔 함수 제거Awake()에서 resumeButton.onClick.AddListener(OnClickResume) 명시적으로 할당3. GameOver UI 버튼 기능 수정GameOverUI.cs에서 홈 / 리트라이 버튼을 직접 Ad..

TIL 2025.05.29

Unity에서 씬 리로드 후 UI 재생성 및 충돌 처리 문제 해결

🎮 게임 기능 구현 및 디버깅게임 씬 리로드 시 UI가 사라지는 문제 해결GameManager가 DontDestroyOnLoad로 유지되면서 씬 재시작 후 UI가 다시 생성되지 않는 문제를 해결하기 위해 SceneManager.sceneLoaded 이벤트에 OnSceneLoaded(Scene, LoadSceneMode) 메서드를 등록해 UI를 강제로 재생성함.이 때 SceneManager.sceneLoaded += OnSceneLoaded; 형식으로 델리게이트를 등록하면 Unity가 자동으로 (Scene scene, LoadSceneMode mode) 파라미터를 넘겨주는 구조라는 것도 학습함.Unity의 델리게이트 자동 파라미터 전달 이해SceneManager.sceneLoaded += OnSceneL..

TIL 2025.05.28

인게임 UI 구성 및 코인 연동

✅ 오늘 한 일InGameUI 프리팹 구성코인 아이콘과 TMP 텍스트로 구성된 InGameUI 프리팹 제작Canvas 안에 배치하고 UI 형태만 우선 완성코인 스프라이트 이미지 제작직접 그린 오징어 동전 그림을 PNG로 저장하고 투명 배경 처리Unity에서 Sprite로 설정 후 InGameUI에 삽입하여 구성 완료GameManager에서 InGameUI 초기화게임 시작 시 자동으로 UIManager.Instance.Open() 실행되도록 설정GameManager 오브젝트가 하이어라키에 없어서 Start()가 실행되지 않는 문제를 발견하고 해결하이어라키에 GameManager 수동 배치하여 정상 작동 확인Point.cs와 InGameUI 연결코인 획득 시 InGameUI의 텍스트가 실시간으로 증가하도록 ..

TIL 2025.05.28

제네릭 기반 UI 시스템 구축 및 Resources 오류 해결

🎯 오늘 목표Unity 팀 프로젝트에서 UI 시스템의 기반을 잡고,제네릭 기반 UIManager 구조를 이용한 UI 열고 닫기 기능을 구현했다.✅ 오늘 한 일UI 관리 시스템 설계UIBase 라는 추상 클래스 생성 → 모든 UI의 기본 구조 제공 (Open/Close)테스트로 MainUI 를 만들어 UIBase 를 상속해서 간단한 UI 프리팹으로 제작제네릭 기반 UIManager 구현UIManager 클래스는 싱글톤 패턴으로 설계Open() 과 Close() 메서드로 UI를 제네릭하게 관리내부적으로는 Dictionary 를 통해 중복 생성 방지 및 재사용Resources.Load 문제 해결처음엔 Resources/UI/MainUI 프리팹을 찾을 수 없다는 오류 발생원인은 프리팹이 Resources 폴더..

TIL 2025.05.26

UI 코드 제어와 델리게이트 활용으로 유연한 UI 시스템 구현하기

✅ 오늘 한 일UICondition, DamageIndicator 등 UI를 직접 드래그 앤 드롭하지 않고 코드로 연결하는 방식으로 구현CharacterManager를 통해 플레이어 컴포넌트에 접근하고, UI 요소들을 동적으로 초기화DamageIndicator는 PlayerCondition에서 발생하는 데미지 이벤트를 델리게이트로 구독하여 이미지 효과 실행🔥 오늘 배운 점UI를 코드로 제어하는 방식의 중요성: 프리팹으로 만들었을 때 인스펙터 연결이 깨질 수 있으므로, 코드로 연결하는 방식이 유지보수에 유리함UI와 게임 로직의 분리: UICondition은 PlayerCondition을 직접 참조하지 않고, CharacterManager를 통해 접근함으로써 결합도를 낮춤델리게이트 기반 이벤트 시스템을 사..

TIL 2025.05.19