Open Source3 [Flutter] GoogleMap에 방향 지시자 추가하는 패키지 만들기 - 3 구현 로직 설명 - 위젯 부분 1. 지도 위에 방향 지시자 겹쳐놓기 Stack 위젯 안에 google_maps_flutter에서 제공하는 GoogleMap위젯을 위치시키고 그 위에 방향 지시자 위젯들이 렌더링되도록 한다. Stack( children: [ GoogleMap( ... ), if (widget.isIndicatorVisible && widget.markers.isNotEmpty) ..._indicatorOffsetList.map((el) { return Positioned( ... ); }).toList(), ], ); 2. GoogleMap 위젯이 받는 파라미터 대신 받기 패키지에서 제공하는 위젯이 구글맵 위젯의 부모 위젯이 되기 때문에 부모 위젯에서 구글맵 위젯이 받는 파라미터를 대신 .. 2024. 1. 29. [Flutter] GoogleMap에 방향 지시자 추가하는 패키지 만들기 - 2 패키지를 만들기 위한 템플릿 생성 flutter create --template=package [패키지명] 의존성 추가 google_maps_flutter 에서 구현한 GoogleMap 위젯 위에 방향 지시자를 겹쳐서 보여줄 계획이므로 google_maps_flutter 의존성을 추가한다. dependencies: flutter: sdk: flutter google_maps_flutter: ^2.5.3 디렉토리 구조 디렉토리 구조는 간단하다. 구글맵 위에 위치시킬 방향 지시자의 위치와 각도를 계산하는 서비스(CaculateService) 파일과 위젯을 작성한 파일 두개가 있다. lib/google_map_with_direction_indicator.dart 이 파일을 library 표기와 다른 파일의 e.. 2024. 1. 29. [Flutter] GoogleMap에 방향 지시자 추가하는 패키지 만들기 - 1 패키지를 만든 이유 google_maps_flutter 패키지를 사용하여 구글 지도 기능을 사용하다가 지도 밖에 마커들이 위치해 있을 경우 그 마커들을 가리키는 방향 지시자가 구현하고 싶다는 생각이 들었다. 내가 구상중인 프로젝트에서는 사용자는 지도를 움직일 수 없고 오직 주변 마커들의 위치를 짐작할 수 있는 힌트만 주고 싶었기 때문에 마커를 가리키는 방향 지시자가 필요했다. 그리고 만드는 김에 오픈 소스로 공유할 수 있는 패키지 형태로 만들어볼까 생각을 하게 되었다. pub.dev 링크 https://pub.dev/packages/google_map_with_direction_indicator google_map_with_direction_indicator | Flutter package A Flutt.. 2024. 1. 29. 이전 1 다음
