[안드로이드 스튜디오] 네이버지도 #3 - 플래그먼트에서 표출하기

이번 포스팅에서는 네이버 클라우드 플랫폼에서 제공하는 네이버지도를 Activity가 아닌 플래그먼트에서 표출하는 방법을 살펴보도록 하겠습니다.

 

이전 포스트에서 MapView를 사용하여 네이버 지도를 Activity에 표출하는 방법을 설명하였으니 참조하세요.

 

2020/06/15 - [안드로이드스튜디오 개발] - [안드로이드 스튜디오] 네이버 지도 #2 - MapView 활용하기

[안드로이드 스튜디오] 네이버 지도 #2 - MapView 활용하기

이번 포스트에서는 Activity가 아닌 Fragment에서 네이버 지도를 표출하는 방법을 알아보겠습니다.

기본적으로 Activity나 Fragment나 표출하는 방법은 별 차이가 없습니다.

 

먼저 activity_main.xml에 버튼을 추가해서 버튼이 클릭됐을때 Fragment를 표출하도록 하겠습니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:id="@+id/btnfragment"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="플래그먼트 띄우기"
        android:layout_gravity="center"/>
</LinearLayout>

 

새로운 Fragment가 표출되는 영역을 잡기위하여 LinearLayout에 id를 fragment_container로 지정했습니다.

그리고 밑에 Fragment를 띄우기 위해 버튼을 하나 추가했습니다.

 

MainActivity는 아래처럼 코딩합니다.

package com.test.navermap;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity
{

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = (Button) findViewById(R.id.btnfragment);

        button.setOnClickListener(new Button.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {

            }
        });
    }
}

 

버튼을 사용하기 위하여 button이라는 변수를 생성하고 클릭이벤트를 받기위하여 위와 같이 코딩하였습니다.

 

이제 Fragment를 추가합니다.

Fragment 추가

그냥 Java Class를 추가하고 코딩해도 되지만 New -> Fragment -> Fragment(Blank)를 선택하여 추가합니다.

Fragment 추가

Fragment 이름을 주고 Finish 버튼 클릭!!!

그럼 아래와 같이 기본적인 부분이 코딩되어 나오네요

NaverFragment

여기서는 파라메타가 필요없으므로 싹다 지워줄겁니다. (깔끔하게~~~)

NaverFragment

깔끔해졌네요~~~

 

이제 layout의 fragment_naver.xml을 코딩합니다.

여기도 이전 포스팅과 같이 LinearLayout에 MapView만 추가할 겁니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.naver.maps.map.MapView
        android:id="@+id/navermap"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
        
</LinearLayout>

 

 

이제 NaverFragment에 네이버 지도를 위한 코딩을 추가합니다.

package com.test.navermap;

import android.content.Context;
import android.os.Bundle;

import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.naver.maps.geometry.LatLng;
import com.naver.maps.map.CameraPosition;
import com.naver.maps.map.MapView;
import com.naver.maps.map.NaverMap;
import com.naver.maps.map.OnMapReadyCallback;

public class NaverFragment extends Fragment implements OnMapReadyCallback
{
    //지도 객체 변수
    private MapView mapView;

    public NaverFragment() { }

    public static NaverFragment newInstance()
    {
        NaverFragment fragment = new NaverFragment();
        return fragment;
    }

    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState)
    {
        // Inflate the layout for this fragment
        ViewGroup rootView = (ViewGroup) inflater.inflate(R.layout.fragment_naver,
                container, false);

        mapView = (MapView) rootView.findViewById(R.id.navermap);
        mapView.onCreate(savedInstanceState);
        mapView.getMapAsync(this);

        return rootView;
    }

    @Override
    public void onMapReady(@NonNull NaverMap naverMap)
    {
        //배경 지도 선택
        naverMap.setMapType(NaverMap.MapType.Satellite);

        //건물 표시
        naverMap.setLayerGroupEnabled(naverMap.LAYER_GROUP_BUILDING, true);

        //위치 및 각도 조정
        CameraPosition cameraPosition = new CameraPosition(
                new LatLng(33.38, 126.55),   // 위치 지정
                9,                                     // 줌 레벨
                45,                                       // 기울임 각도
                45                                     // 방향
        );
        naverMap.setCameraPosition(cameraPosition);
    }

    @Override
    public void onStart()
    {
        String addr;

        super.onStart();
        mapView.onStart();
    }

    @Override
    public void onResume()
    {
        super.onResume();
        mapView.onResume();
    }

    @Override
    public void onPause()
    {
        super.onPause();
        mapView.onPause();
    }

    @Override
    public void onSaveInstanceState(Bundle outState)
    {
        super.onSaveInstanceState(outState);
        mapView.onSaveInstanceState(outState);
    }

    @Override
    public void onStop()
    {
        super.onStop();
        mapView.onStop();
    }

    @Override
    public void onDestroyView()
    {
        super.onDestroyView();
        mapView.onDestroy();
    }

    @Override
    public void onLowMemory()
    {
        super.onLowMemory();
        mapView.onLowMemory();
    }

}

 

기본적인 코딩은 Activity와 차이가 없습니다. 다만 프래그먼트의 onCreateView() 또는 onViewCreated()에서 onCreate()를, onDestroyView()에서 onDestroy()를 호출하는 것만 조금 달라졌네요. 하지만  Activity나 Fragment의 라이프 사이클을 생각하면 동일한거로 봐도 무방합니다.

 

이제 MainActivity의 클릭 이벤트를 마져 코딩합니다.

package com.test.navermap;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity
{

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = (Button) findViewById(R.id.btnfragment);

        button.setOnClickListener(new Button.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                NaverFragment naverFragment = new NaverFragment();
                getSupportFragmentManager().beginTransaction()
                        .add(R.id.fragment_container, naverFragment).commit();
            }
        });
    }
}

 

버튼의 클릭 이벤트 시 플래그먼트를 생성하고 fragment_container에 플래그먼트를 추가하도록 하였습니다.

 

그럼 이제 실행해 보면

=====> 버튼클릭

 

플래그먼트에서도 네이버 지도가 잘 뜨는게 확인됩니다.

 

 

PS. 매번 프로젝트만 진행하다가 개인적으로 앱을 하나 출시했습니다.

비록 허접한 앱이기는 하지만 이걸 토대로 몇몇가지 팁에 대해 포스팅을 작성하려고 하오니 아래 포스팅 글 한번 읽어봐 주시면 감사하겠습니다. ^^

andro-jinu.tistory.com/entry/todaysaying1

[안드로이드 스튜디오] 앱 출시 소식 - 오늘의 명언(명언, 고사성어, 속담)