title: Android Tabs with Maps
body: <p>I am trying to create an application for android with three tabs (which i already did with this tutorial: <a href="http://wptrafficanalyzer.in/blog/creating-navigation-tabs-using-tabhost-and-fragments-in-android/" rel="nofollow">http://wptrafficanalyzer.in/blog/creating-navigation-tabs-using-tabhost-and-fragments-in-android/</a> because it should work on a big number of devices) and two of them should show maps.</p>
  
  <p>I looked up for tutorials for this case but i did not find something fitting. So how do i do that?
  Can someone please help me or give a link which explains something like that?
  I hope the question is easy to answer for you and i am grateful for every answer. </p>
  
  <p><strong>Update:
  i tried something out now but the way i try does not work:
  Full code:</strong></p>
  
  <p>xml:</p>
  
  <pre><code>&lt;TabHost
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@android:id/tabhost"
  android:layout_width="match_parent"
  android:layout_height="match_parent"&gt;
  
  &lt;LinearLayout
      android:orientation="vertical"
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;TabWidget
          android:id="@android:id/tabs"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_weight="0"/&gt;
  
      &lt;FrameLayout
          android:id="@android:id/tabcontent"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:layout_weight="0"/&gt;
  
      &lt;FrameLayout
          android:id="@+id/realtabcontent"
          android:layout_width="match_parent"
          android:layout_height="0dp"
          android:layout_weight="1"/&gt;
  
      &lt;FrameLayout 
          android:id="@+id/realtabcontent"
          android:layout_width="match_parent"
          android:layout_height="0dp"
          android:layout_weight="2"/&gt;
  
          &lt;fragment
              android:id="@+id/map"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:layout_below="@id/tv_location"
              class="com.google.android.gms.maps.SupportMapFragment"
      /&gt;
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p></p>
  
  <p>MainActivity.java:</p>
  
  <pre><code>package com.example.navigationtabdemo;
  
  import android.os.Bundle;
  import android.support.v4.app.FragmentActivity;
  import android.widget.TabHost;
  
  public class MainActivity extends FragmentActivity {
      TabHost tHost;
  
  
  @Override
  public void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
  
      tHost = (TabHost) findViewById(android.R.id.tabhost);
      tHost.setup();
  
      /** Defining Tab Change Listener event. This is invoked when tab is changed */
      TabHost.OnTabChangeListener tabChangeListener = new TabHost.OnTabChangeListener() {
  
          @Override
          public void onTabChanged(String tabId) {
              android.support.v4.app.FragmentManager fm =   getSupportFragmentManager();
              AndroidFragment androidFragment = (AndroidFragment) fm.findFragmentByTag("android");
              AppleFragment appleFragment = (AppleFragment) fm.findFragmentByTag("apple");
              MapsFragment mapsFragment = (MapsFragment) fm.findFragmentByTag("maps");
              android.support.v4.app.FragmentTransaction ft = fm.beginTransaction();
  
              /** Detaches the androidfragment if exists */
              if(androidFragment!=null)
                  ft.detach(androidFragment);
  
              /** Detaches the applefragment if exists */
              if(appleFragment!=null)
                  ft.detach(appleFragment);
  
              /** Detaches the mapsfragment if exists */
              if(mapsFragment!=null)
                  ft.detach(mapsFragment);
  
              /** If current tab is android */
              if(tabId.equalsIgnoreCase("android")){
  
                  if(androidFragment==null){
                      /** Create AndroidFragment and adding to fragmenttransaction */
                      ft.add(R.id.realtabcontent,new AndroidFragment(), "android");
                  }else{
                      /** Bring to the front, if already exists in the fragmenttransaction */
                      ft.attach(androidFragment);
                  }
  
              }else{    /** If current tab is apple */
                  if(appleFragment==null){
                      /** Create AppleFragment and adding to fragmenttransaction */
                      ft.add(R.id.realtabcontent,new AppleFragment(), "apple");
                   }else{
                      /** Bring to the front, if already exists in the fragmenttransaction */
                      ft.attach(appleFragment);
                  }
  
            /**  }else{ */        /** If current tab is maps */
                  if(mapsFragment==null){
                      /** Create MapsFragment and adding to fragmenttransaction */
                      ft.add(R.id.realtabcontent,new MapsFragment(), "maps");
                   }else{
                      /** Bring to the front, if already exists in the fragmenttransaction */
                      ft.attach(mapsFragment);
                  }
              }
              ft.commit();
          }
      };
  
      /** Setting tabchangelistener for the tab */
      tHost.setOnTabChangedListener(tabChangeListener);
  
      /** Defining tab builder for Android tab */
      TabHost.TabSpec tSpecAndroid = tHost.newTabSpec("android");
      tSpecAndroid.setIndicator("Android");
      tSpecAndroid.setContent(new DummyTabContent(getBaseContext()));
      tHost.addTab(tSpecAndroid);
  
      /** Defining tab builder for Apple tab */
      TabHost.TabSpec tSpecApple = tHost.newTabSpec("apple");
      tSpecApple.setIndicator("Apple");
      tSpecApple.setContent(new DummyTabContent(getBaseContext()));
      tHost.addTab(tSpecApple);
  
      /** Defining tab builder for Maps tab */
      TabHost.TabSpec tSpecMaps = tHost.newTabSpec("maps");
      tSpecMaps.setIndicator("Maps");
      tSpecMaps.setContent(new DummyTabContent(getBaseContext()));
      tHost.addTab(tSpecMaps);
  
  }
  }
  </code></pre>
  
  <p>DummyTabContent:</p>
  
  <pre><code>package com.example.navigationtabdemo;
  
  import android.content.Context;
  import android.view.View;
  import android.widget.TabHost.TabContentFactory;
  
  public class DummyTabContent implements TabContentFactory{
      private Context mContext;
  
      public DummyTabContent(Context context){
          mContext = context;
      }
  
      @Override
      public View createTabContent(String tag) {
          View v = new View(mContext);
          return v;
      }
  }
  </code></pre>
  
  <p>AndroidFragment:</p>
  
  <pre><code>package com.example.navigationtabdemo;
  
  import android.os.Bundle;
  import android.support.v4.app.ListFragment;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.ArrayAdapter;
  import android.widget.ListView;
  
  public class AndroidFragment extends ListFragment{
  
      /** An array of items to display in ArrayList */
      String android_versions[] = new String[]{
          "Jelly Bean",
          "IceCream Sandwich",
          "HoneyComb",
          "Ginger Bread",
          "Froyo"
      };
  
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  
          /** Creating array adapter to set data in listview */
          ArrayAdapter&lt;String&gt; adapter = new ArrayAdapter&lt;String&gt;(getActivity().getBaseContext(), android.R.layout.simple_list_item_multiple_choice, android_versions);
  
          /** Setting the array adapter to the listview */
          setListAdapter(adapter);
  
          return super.onCreateView(inflater, container, savedInstanceState);
      }
  
      @Override
      public void onStart() {
          super.onStart();
  
          /** Setting the multiselect choice mode for the listview */
          getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
      }
  }
  </code></pre>
  
  <p>AppleFragment:</p>
  
  <pre><code>package com.example.navigationtabdemo;
  
  import android.os.Bundle;
  import android.support.v4.app.ListFragment;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.ArrayAdapter;
  import android.widget.ListView;
  
  public class AppleFragment extends ListFragment{
  
      /** An array of items to display in ArrayList */
      String apple_versions[] = new String[]{
          "Mountain Lion",
          "Lion",
          "Snow Leopard",
          "Leopard",
          "Tiger",
          "Panther",
          "Jaguar",
          "Puma"
      };
  
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  
          /** Creating array adapter to set data in listview */
          ArrayAdapter&lt;String&gt; adapter = new ArrayAdapter&lt;String&gt;(getActivity().getBaseContext(), android.R.layout.simple_list_item_multiple_choice, apple_versions);
  
          /** Setting the array adapter to the listview */
          setListAdapter(adapter);
  
          return super.onCreateView(inflater, container, savedInstanceState);
      }
  
      @Override
      public void onStart() {
          super.onStart();
  
          /** Setting the multiselect choice mode for the listview */
          getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
      }
  }
  </code></pre>
  
  <p>MapsFragment.java:</p>
  
  <pre><code>package com.example.navigationtabdemo;
  
  import android.app.Dialog;
  import android.location.Location;
  import android.os.Bundle;
  import android.support.v4.app.FragmentActivity;
  import android.view.Menu;
  import android.widget.TextView;
  
  import com.google.android.gms.common.ConnectionResult;
  import com.google.android.gms.common.GooglePlayServicesUtil;
  import com.google.android.gms.maps.CameraUpdateFactory;
  import com.google.android.gms.maps.GoogleMap;
  import com.google.android.gms.maps.GoogleMap.OnMyLocationChangeListener;
  import com.google.android.gms.maps.SupportMapFragment;
  import com.google.android.gms.maps.model.LatLng;
  
  public class MapsActivity extends FragmentActivity implements OnMyLocationChangeListener {
  
  GoogleMap googleMap;
  
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
  
      // Getting Google Play availability status
      int status = GooglePlayServicesUtil.isGooglePlayServicesAvailable(getBaseContext());
  
      // Showing status
      if(status!=ConnectionResult.SUCCESS){ // Google Play Services are not available
          int requestCode = 10;
          Dialog dialog = GooglePlayServicesUtil.getErrorDialog(status, this, requestCode);
          dialog.show();
  
      }else {    // Google Play Services are available
  
          // Getting reference to the SupportMapFragment of activity_main.xml
          SupportMapFragment fm = (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
  
          // Getting GoogleMap object from the fragment
          googleMap = fm.getMap();
  
          // Enabling MyLocation Layer of Google Map
          googleMap.setMyLocationEnabled(true);
  
          // Setting event handler for location change
          googleMap.setOnMyLocationChangeListener(this);
  
      }
  
  }
  
  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
      // Inflate the menu; this adds items to the action bar if it is present.
      getMenuInflater().inflate(R.menu.main, menu);
      return true;
  }
  
  @Override
  public void onMyLocationChange(Location location) {
      TextView tvLocation = (TextView) findViewById(R.id.tv_location);
  
      // Getting latitude of the current location
      double latitude = location.getLatitude();
  
      // Getting longitude of the current location
      double longitude = location.getLongitude();
  
      // Creating a LatLng object for the current location
      LatLng latLng = new LatLng(latitude, longitude);
  
      // Showing the current location in Google Map
      googleMap.moveCamera(CameraUpdateFactory.newLatLng(latLng));
  
      // Zoom in the Google Map
      googleMap.animateCamera(CameraUpdateFactory.zoomTo(15));
  
      // Setting latitude and longitude in the TextView tv_location
      tvLocation.setText("Latitude:" +  latitude  + ", Longitude:"+ longitude );
  
  }
  }
  </code></pre>
  
  <p>Manifest:</p>
  
  <pre><code>    &lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.example.navigationtabdemo"
      android:versionCode="1"
      android:versionName="1.0" &gt;
  
  &lt;uses-sdk
      android:minSdkVersion="8"
      android:targetSdkVersion="16" /&gt;
  
  &lt;permission
      android:name="com.example.navigationtabdemo.permission.MAPS_RECEIVE"
      android:protectionLevel="signature"/&gt;
  
  &lt;uses-permission android:name="com.example.navigationtabdemo.permission.MAPS_RECEIVE"/&gt;
  &lt;uses-permission android:name="android.permission.INTERNET"/&gt;
  &lt;uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/&gt;
  &lt;uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/&gt;
  &lt;uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/&gt;
  &lt;uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/&gt;       
  
  &lt;uses-feature
      android:glEsVersion="0x00020000"
      android:required="true"/&gt;    
  
  &lt;application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" &gt;
      &lt;activity
          android:name="com.example.navigationtabdemo.MainActivity"
          android:label="@string/app_name" &gt;
          &lt;intent-filter&gt;
              &lt;action android:name="android.intent.action.MAIN" /&gt;
  
              &lt;category android:name="android.intent.category.LAUNCHER" /&gt;
          &lt;/intent-filter&gt;
      &lt;/activity&gt;
  
      &lt;meta-data
          android:name="com.google.android.maps.v2.API_KEY"
          android:value="AIzaSyAw4me2T-HBcFiTocAucxdbhVxLD1u3n6g"/&gt;        
  
  &lt;/application&gt;
  </code></pre>
  
  <p></p>