Skip to content

Feat/#69 - 맵 레이어 Sheet UI구현 및 현재 위치 이동 기능 추가 #75

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
MuchanKim merged 11 commits into from
Nov 12, 2025
Merged

Feat/#69 - 맵 레이어 Sheet UI구현 및 현재 위치 이동 기능 추가 #75

MuchanKim merged 11 commits into from
Nov 12, 2025

Conversation

@MuchanKim
Copy link
Collaborator

@MuchanKim MuchanKim commented Nov 9, 2025 •
edited
Loading

#60 작업과 이어지는 작업입니다. 앞에꺼 머지 돼야 함.

📝 Summary

맵 레이어 Sheet UI구현 및 현재 위치 이동 기능 추가하였습니다.
맵과 연결은 시켜놓은 상태이나 실제 레이어는 표시되지 않습니다. 다음 작업인 #70 에서 레이어 표시 기능을 붙일 예정입니다.
현재 위치 이동 기능도 추가해써요

🔨 What

pr.MP4

동작 원리는 커밋메시지에 상세하게 적어놨습니다!! 간단하게 플로우만 남길게요!

맵과 레이어 버튼 플로우

[사용자]
   │ 레이어/필터 버튼 탭
   ▼
[MapLayerContainer]
   │ store.send(.toggleMapLayerSheet / .selectFilter / ...)
   ▼
[MapFeature]
   │ 상태 갱신
   │  - isMapLayerSheetPresented
   │  - mapLayerCoverageRange
   │  - isCCTVLayerEnabled / isBaseStationLayerEnabled
   │  - 필터 선택 상태(MapFilterType 기반)
   ▼
[MapView]
   │ 상태 바인딩
   │  - MapLayerContainer(isLayerActive: ...)
   │  - MapLayerSettingSheet(...)
   │  - NaverMapView(cameraTargetCoordinate: ...)
   ▼
[NaverMapView]
   │ updateUIView → moveCamera(to:) (필요 시)
   └─ onCameraMoveConsumed → store.send(.clearCameraTarget) → 상태 초기화

현재 위치 이동 플로우

[사용자]
   │ 현위치 버튼 탭
   ▼
[MapLayerContainer]
   │ store.send(.requestFocusMyLocation)
   ▼
[MapFeature]
   │ shouldFocusMyLocation = true
   ▼
[MapView]
   │ NaverMapView(shouldFocusMyLocation: true)
   ▼
[NaverMapView]
   │ updateUIView → focusCameraOnMyLocation()
   └─ onMyLocationFocusConsumed → store.send(.clearFocusMyLocationFlag)
        ▼
     [MapFeature] shouldFocusMyLocation = false (상태 초기화)

👀 Review Notes

맵과 피처가 더 비대해 질 것 같은데 책임 분리에 대한 고민을 조금씩 하게 됩니다.

테스트코드는 별도로 없구요! 실 기기에서 현재위치 버튼 눌러서 테스트 해주시고, 버튼 동작 확인만 잘 해주십시오!!

@MuchanKim
[Chore] #69 - cctv, layer 뷰에 쓰일 Assets 추가 및 리터럴 업데이트
0fb140d 
What?
- SVG로 모두 추가했습니다. 싱글 스케일 적용 완료.
- String 리터럴 다 업데이트 했어요.
- 폰트 적용 안된 거 하나 추가했습니다.!!

Why?
- 커버리지 이미지를 PNG를 해야하나!!!! 아님 그려야하나 !! 싶었는데 SVG로 올려보니 괜찮아서 이대로 갑니다.
@MuchanKim
[Feat] #69 - MapLayerSettingSheet 구현
8d471c3 
What?
- 우측에 보이는 맵레이어 설정 버튼을 누르면 나오는 시트를 구현하였습니다.
- 헤더, 커버리지 섹션, 토글 섹션으로 분리하였고 각 뷰에서 분리가 필요한 경우 더 분리해서 사용했습니다.
- 서브뷰에서는 Binding으로 처리하도록 하였습니다.
- 커버리지 이미지 SVG로 추가했습니다. 싱글 스케일 적용 완료 함.
- enum타입으로 타이틀과 이미지 리소스 관리를 할 수 있도록 하였습니다.
@MuchanKim
[Feat] #69 - MapView와 MapLayerSettingSheet 연동 작업
6e804d8 
What?
- 추가된 지도 레이어 설정 로직을 위해 MapFeature.State에 CoverageRangeType, isCCTVEnabled, isBaseStationEnabled, isMapLayerSheetPresented 상태를 정의하고 대응 액션(setMapLayerCoverage, setCCTVLayerEnabled, setBaseStationLayerEnabled, setMapLayerSheetPresented)을 구현했습니다.
- MapView의 레이어 설정 시트를 Store 바인딩으로 연결해 토글·반경 선택·시트 표시 상태가 즉시 리듀서로 전달되도록 했습니다.
- MapLayerSettingSheet는 CoverageRangeType을 받아 커버리지 이미지/라벨을 출력하고, 토글 섹션을 그대로 바인딩에 물려 UI 변경이 상태에 반영됩니다.

Why?
- 지도 레이어 옵션을 사용자의 선택과 즉시 동기화해 향후 CCTV/기지국 뷰 데이터 및 지도 오버레이 로직을 쉽게 확장하기 위함입니다.
- Store 기반으로 모든 상태를 관리함으로써 UI와 비즈니스 로직을 일관된 단일 소스에 유지하고, 이후 API 연동 시 토글/범위 값에 따른 네트워크 호출을 Reducer에서 통제하기 쉽게 만들었습니다.

앞으로 CCTV/기지국 레이어를 실제로 켜고 끄려면 MapFeature의 setCCTVLayerEnabled, setBaseStationLayerEnabled, setMapLayerCoverage 액션 처리부에 데이터 로딩 및 지도 오버레이 갱신 로직을 추가할 예정입니다. 현재 PR은 UI와 상태만 연결해 두고, 추후 이 액션들 안에 구체적인 구현을 채워 넣는 구조입니다!!!!
@MuchanKim
[Refactor] #69 - 맵레이어 터치 범위 변경
0b82a02 
What?
- 터치 영역이 이미지에서 버튼 프레임 자체로 변경하였습니다.

Why?
- 안그래도 작은데 터치 제대로 안눌리면 위치정보시트 올라옴!!!!! -> 이거 맵 특정 범위 실행 안시키도록 해야할 듯
@MuchanKim
[Refactor] #69 PlaceSheet 기존 버튼을 공용 컴포넌트로 교체
bd7ed4d 
What?
- 지난 작업단위에서 구현한 버튼을 공용 컴포넌트 활용으로 변경하였습니다.

Why?
- 재활용 할 수 있어서!
@MuchanKim
[Feat] #69 - 현재 위치 이동하기 버튼 기능 구현
01e823d 
What?
- 현재 위치로 이동하기 버튼을 구현하였습니다.
- 점점 맵과 맵피처가 거대해지고 있어서 같은 동작/목적을 가진 녀석들끼리 주석으로 분리해주었습니다.

[동작 방식]
1. 사용자 액션 ! 현 위치 이동하기 버튼을 누른다! -> store.send(.requestFocusMyLocation)을 호출
2. 상태 업데이트 ! MapFeature의 .requestFocusMyLocation 액션에서 state.shouldFocusMyLocation = true로 플래그를 변경
3. MapView 갱신 ! MapView는 store.state.shouldFocusMyLocation를 NaverMapView의 shouldFocusMyLocation에 전달합니다. SwiftUI가 상태 변화를 감지해 updateUIView 트리거 실행
4. 네이버 지도에서 처리 ! NaverMapView.updateUIView에서 shouldFocusMyLocation이 true면 focusCameraOnMyLocation()을 호출해 SDK 위치 오버레이 좌표로 카메라를 이동시킵니다.
5. 마무으리 ! 이동이 끝나면 onMyLocationFocusConsumed 콜백이 MapView로 올라가고, MapView는 store.send(.clearFocusMyLocationFlag)를 호출합니다. 이후 MapFeature가 플래그를 다시 false로 내려 다음 버튼 탭을 기다리도록 합니다.
@MuchanKim MuchanKim self-assigned this Nov 9, 2025
@MuchanKim MuchanKim added ✨ Feature 새로운 기능 구현 🥬 Moo 김무찬 바 ~ 보 labels Nov 9, 2025
YooGyeongMo
YooGyeongMo approved these changes Nov 10, 2025
View reviewed changes
Copy link
Collaborator

@YooGyeongMo YooGyeongMo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

p1. 있어요 일단 어프루브

@MuchanKim
Merge branch 'main' of https://github.com/DeveloperAcademy-POSTECH/20…
7d93bf3 
…25-C6-M6-DreamWorms into feat/#69
@MuchanKim
[Refactor] #69 - MapView Coordinator 카메라 위치 초기화 안되는 부분 수정
58b5e2e 
What?
- Demian이 리뷰 준 Coorindator.lastCameraTarget이 초기화 되지않고 있는 문제를 수정했습니다.
- cameraTargetCoordinate는 상태 반영을 해주고 있으므로, 해당 값에 따라 분기처리를 해주었습니다.
@MuchanKim
Merge branch 'main' of https://github.com/DeveloperAcademy-POSTECH/20…
a4e72af 
…25-C6-M6-DreamWorms into feat/#69

# Conflicts:
#	SUSA24-iOS/SUSA24-iOS/Resources/Literals/Localizable.xcstrings
@MuchanKim
Merge branch 'main' of https://github.com/DeveloperAcademy-POSTECH/20…
f6e2040 
…25-C6-M6-DreamWorms into feat/#69
@MuchanKim
[Feat] #69 - SwiftFormat 적용
7e092ef 
What?
- main에 다시 swiftforamt 스크립트가 풀려서 다시 적용한 거 올립니다.
@MuchanKim MuchanKim merged commit af6ac0a into main Nov 12, 2025
@mini-min mini-min deleted the feat/#69 branch November 12, 2025 03:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@YooGyeongMo YooGyeongMo YooGyeongMo approved these changes

@delightPIP delightPIP Awaiting requested review from delightPIP

@mini-min mini-min Awaiting requested review from mini-min

Assignees

@MuchanKim MuchanKim

Labels

✨ Feature 새로운 기능 구현 🥬 Moo 김무찬 바 ~ 보

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[✨ Feat] MapView 레이어 시트 UI 구현 및 현재 위치 버튼 기능 붙이기

3 participants

@MuchanKim @YooGyeongMo