[Android] Tablayout에서 Fragment로 Google Map 사용방법

Tablayout > 3개의 Fragment를 Tab을 누를 때마다 이동하게 만든다

먼저 MainActivity에서는 Tablayout와 ViewPager를 통해 3개의 Fragment가 생성될 수 있도록 한다.

MainActivity / activity_main.xml 

activity_main.xml

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

<android.support.design.widget.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
app:tabGravity="fill"
app:tabIndicatorColor="@color/colorIndicator"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/colorPrimary"
app:tabTextColor="#c9c9c9"></android.support.design.widget.TabLayout>


<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></android.support.v4.view.ViewPager>
</LinearLayout>

MainActivity.java

package com.example.shine.myapplication;

import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v4.app.FragmentStatePagerAdapter;

public class MainActivity extends AppCompatActivity {
TabLayout tabLayout;
ViewPager vp;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

vp = (ViewPager)findViewById(R.id.viewpager);
vp.setAdapter(new pagerAdapter(getSupportFragmentManager()));
tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.addTab(tabLayout.newTab().setText("첫 번째"),0,true);
//true라고 된 부분은 setSeleted로 첫번째 페이지 설정과 같은 효과
//addTab을 통해 Tab을 생성
tabLayout.addTab(tabLayout.newTab().setText("두 번째"),1);
tabLayout.addTab(tabLayout.newTab().setText("세 번째"),2);
tabLayout.addOnTabSelectedListener(pagerListener);
//Tab을 눌렀을 때 이벤트 추가
vp.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));//손으로 넘길때 반응
}

TabLayout.OnTabSelectedListener pagerListener = new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
vp.setCurrentItem(tab.getPosition());
}

@Override
public void onTabUnselected(TabLayout.Tab tab) {

}

@Override
public void onTabReselected(TabLayout.Tab tab) {

}
};

private class pagerAdapter extends FragmentStatePagerAdapter
//pagerAdapter class생성
{
private pagerAdapter(android.support.v4.app.FragmentManager fm)
{
super(fm);
}
@Override
public android.support.v4.app.Fragment getItem(int position)
{
switch(position)
{
case 0:
return new HomeFragment();
case 1:
return new MapFragment();
case 2:
return new ContactFragment();
default:
return null;
}
}
@Override
public int getCount()
{
return 3; //띄워지는 화면 개수
}
}

}

Fragment 3개를 만드는 데 가장 어려운 Google Map을 Fragment에 사용하는 방법을 포스팅하겠다.

1. HomeFragment.java / fragment_home.xml
2. MapFragment.java / fragment_map.xml
3. ContactFragment.java / fragment_contact.xml

MapFragment.java / fragment_map.xml

<?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">
   <com.google.android.gms.maps.MapView
 android:id="@+id/mapview"
 android:layout_width="match_parent"
 android:layout_height="match_parent" />
   </LinearLayout>

package com.example.shine.myapplication;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.MapView;
import com.google.android.gms.maps.MapsInitializer;
import com.google.android.gms.maps.OnMapReadyCallback;

public class MapFragment extends Fragment implements OnMapReadyCallback {
GoogleMap mMap;
MapView mapView;
View mView;

@Override
public void onMapReady(GoogleMap googleMap) {
MapsInitializer.initialize(getContext());
mMap = googleMap;
mMap.setMapType(GoogleMap.MAP_TYPE_NORMAL);
}

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
mView = inflater.inflate(R.layout.map, container, false);
return mView;
}

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);

mapView = (MapView) mView.findViewById(R.id.mapview);
if (mapView != null) {
mapView.onCreate(null);
mapView.onResume();
mapView.getMapAsync(this);
}
}
}