[All Platform, New Feature] Flutter Side User Control Interface Implementation

[note11g]

Background

Platform View를 통해, 지도 화면을 보여주는 것 이외에 지도 조작에 필요한 인터페이스인 줌 컨트롤러, 나침반(방위표시계), 내 위치 모드 변경 버튼 인터페이스를 사용하려고 할 때, 이슈가 발생함 (주로 Android). 하지만, 해당 UI들은 사용자가 쉽게 구현 가능할 것으로 예상하였으나, 생각보다 사용에 있어 불편하다는 의견이 많이 나오는 상황임.
따라서 개발 경험(DX)를 향상시키기 위해, 해당 UI들을 플러터 UI로 구현하고자 함.

TODO

(할당되지 않은 것들은 기여 가능합니다)

• Native Side Camera Update with reason method add internally in plugin. (@note11g )
• 내 위치 버튼 구현
• 내 위치 추적 기능 구현 (패키지 사용 여부는 검토 필요)
• 줌 컨트롤러 구현
• 나침반 UI 구현 (Optional: UI 난이도가 높음)

*추가될 수 있음.

Reference

Android : https://navermaps.github.io/android-map-sdk/guide-ko/4-1.html
iOS : https://navermaps.github.io/ios-map-sdk/guide-ko/4-1.html

[chochoq]

안녕하세요 김노트님,
투두에 할당하신
내 위치 버튼 구현, 줌 컨트롤러 구현, 내 위치 추적 기능 구현, 나침반 UI 구현 가능합니다.
구체적인 설계 부탁드립니다!

[note11g]

@chochoq 님, 기여 요청에 감사드립니다.

1. mapControlUI Branch에서 작업하시면 됩니다.
2. 해당 Branch에 작업해둔, NCameraUpdate.setReason을 알맞게 지정해주시어 구현하시면 됩니다.
3. 요구사항은 다음과 같습니다.
   • 내 위치 버튼: 레퍼런스(기존 네이티브) 구현과 똑같이 부탁드립니다. 바라보고 있는 방위 표시까지 부탁드릴게요.
   • 내 위치 추적 기능 구현: 하위 호환성을 위해, MapController에서 사용하는 메서드인 setLocationTrackingMode에도 구현 부탁드릴게요. 이때, 사용하실 외부 패키지가 있다면 알려주세요. 위젯 dispose시 위치 추적 해제까지 처리하셔야 합니다(#171)
   • 나침반 UI, 줌 컨트롤러 UI : 레퍼런스를 보고 참고해서 만들어주세요. 비슷할 수록 좋습니다. 인터렉션까지 카피 부탁드릴게요.

자세한 설계는 오늘 내로 드래프트 하겠습니다. 감사합니다.

[note11g]

@chochoq
설계에는 1안과 2안이 있습니다.
바텀업 방식으로 설계하다보니, 어떤 구조로 API가 나오면 좋을지 먼저 여쭙고 싶습니다.

1안: 외부에서 사용자가 위젯을 배치할 수 있도록 지정
(dafd6b7)
장점: 위젯을 마음대로 배치할 수 있음, 단점: 사용하기 복잡해질 수 있음.

NaverMapController? mapController;

// ... some codes
return Stack(
  children: [
    NaverMap(
      onMapReady: (controller) {
        mapController = controller;
      }
    ),
    Positioned(
      top: 0, 
      bottom: 0,
      right: 12,
      child: NaverMapZoomControlWidget(mapController: mapController),
    )
  ])

2안: 기존 실내지도 및 네이버 맵 SDK에서 조작하는 방식과 동일하게 NaverMapViewOptions객체의 속성으로 활성화/비활성화
장점: 사용하기 쉬움, 일관적임, 단점: 배치 위치가 한정됨

NaverMap(
  options: NaverMapViewOptions(
    zoomButtonEnable: true,
  )
),

[chochoq]

제가 사용할 때도 2안을 선호하는 편이지만, 커스텀 가능한 것이 결국은 더 사용성이 더 좋은게 아닐까 하는데 어떻게 생각하실까요?

[note11g]

@chochoq
커스텀이 필요한 경우, 직접 만들어 쓰는 것은 어렵지 않다고 생각하고 있긴 합니다.
2안이 좀 더 나을 것 같기도 하네요. 괜찮으시다면 2안으로 진행해주시면 될 것 같습니다.

[note11g]

@chochoq 안녕하세요, 혹시 현재 진행상황 공유 부탁드려도 될까요?

[note11g]

@chochoq 1.2.0 버전이 릴리즈되며, 이 작업은 이후 버전의 작업으로 처리됩니다.
구현 범위, 그리고 예상 기간을 알려주시면, 해당 범위에 맞추어 개발을 진행하도록 하겠습니다.

[note11g]

내 위치 구현 예제 추가 (참고하실 수 있습니다)
https://github.com/note11g/flutter_naver_map_pure_example/tree/mylocation

[chochoq]

추가해주신 예제 확인했습니다.(늦어서죄송합니다ㅜㅜ)
최대한 빨리 구현하도록 하겟습니다!

[note11g]

@chochoq 구현 난이도를 낮추기 위한 작업들을 진행했었습니다.
8a7b64c d950661
확인하시고 작업해주세요. 감사합니다.

[chochoq]

네 알겟습니다. 감사합니다!!

[note11g]

@chochoq 각 구현마다 작업 시작/종료 정도만 노티 부탁드려도 될까요?

[note11g]

작업 할당 변경 @chochoq -> @mrkim0425

[mrkim0425]

Just to let you know
I'm not completely confident, but I'm currently planning to complete these features by the end of April or in May. : )

[note11g]

진행상황 확인 브랜치 : https://github.com/note11g/flutter_naver_map/tree/mapControlUI

[note11g]

@mrkim0425 남은 작업은 따로 논의 되었었던 위치 추적 관련 플러그인 내재화 작업이 마지막인가요?

[mrkim0425]

@note11g 넵

[note11g]

@mrkim0425 내 위치 버튼 제외하고, 이번 릴리즈에 포함시킬까 싶은데, 어떻게 생각하시나요?

[mrkim0425]

넵 좋습니다
오히려 제가 죄송할따름...

[note11g]

상위 이슈로 이전하고, 작업 시기에 다시 이슈를 재생성합니다.
#301