Hire enCypher Technologies Pvt. Ltd.

How to attach a map fragment in ListView Header in android?

How to attach a map fragment in ListView Header in android?

android, android application, How to, initiative, installation, mobile, mobile application, Technology 13 Comments
How to attach a map fragment in ListView Header in android

Adding a header in listView is not difficult. But when we add a map fragment as a listView header then map fragment functionality is not working properly. So our goal is to add a map fragment in listview with it’s all functionality.
There are some initial steps to add Google Map in project.
1. we generate API KEY from google developer console.
2. Now we create an activity Name is MainActivity.
3.In MainActvity Layout file we add a listview.
4.For map fragment we create another layout file called listview_header.xml file.

There are the files:
listview_header.xml
<?xml version=“1.0″ encoding=“utf-8″?>
<RelativeLayout
android:id=“@+id/main_content”
xmlns:android=“http://schemas.android.com/apk/res/android”
android:layout_width=“match_parent”
android:layout_height=“match_parent”>
<fragment
android:name=“com.google.android.gms.maps.SupportMapFragment”
android:layout_width=“fill_parent”
android:layout_height=“400dp”
android:clickable=“true”
android:id=“@+id/headerListFragment”
/>
<ImageView
android:id=“@+id/transparent_image”
android:layout_width=“match_parent”
android:layout_height=“400dp”
android:src=“@color/transparent”
android:contentDescription=“dsc” />
</RelativeLayout>

Now there is MainActivity.java

import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.BitmapDescriptorFactory;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MarkerOptions;
import java.util.ArrayList;

public class MainActivity extends AppCompatActivity implements AbsListView.OnScrollListener,OnMapReadyCallback {
ListView listView;
GoogleMap googleMap;
ArrayList<String>  arrayList=new ArrayList<>();

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView= (ListView) findViewById(R.id.listView);
arrayList.add(“SuperMan”);
arrayList.add(“BatMan”);
arrayList.add(“IronMan”);
arrayList.add(“SpiderMan”);

LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
ViewGroup header = (ViewGroup) inflater.inflate(R.layout.listview_header, listView, false);listView.addHeaderView(header, null, false);
SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.headerListFragment);
mapFragment.getMapAsync(this);
ImageView   transparentImageView = (ImageView) header.findViewById(R.id.transparent_image);
//
transparentImageView.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
// Disallow ScrollView to intercept touch events.
listView.requestDisallowInterceptTouchEvent(true);
// Disable touch on transparent view
return false;
case MotionEvent.ACTION_UP:
// Allow ScrollView to intercept touch events.
listView.requestDisallowInterceptTouchEvent(false);
return true;
case MotionEvent.ACTION_MOVE:
listView.requestDisallowInterceptTouchEvent(true);
return false;
default:
return true;
}
}
});
//
//You can use customAdapter also…
listView.setAdapter(new ArrayAdapter<>(MainActivity.this, android.R.layout.simple_list_item_1,arrayList));
listView.setOnScrollListener(this);
}
@Override
public void onScrollStateChanged(AbsListView absListView, int i) {
}
@Override
public void onScroll(AbsListView absListView, int i, int i1, int i2) {
}
@Override
public void onMapReady(GoogleMap googleMap) {
final LatLng latLng=new LatLng(28.581056,77.3175023);
googleMap.addMarker(new MarkerOptions().position(latLng));
googleMap.moveCamera(CameraUpdateFactory.newLatLng(latLng));
googleMap.animateCamera(CameraUpdateFactory.zoomTo(15));
googleMap.setOnMapClickListener(new GoogleMap.OnMapClickListener() {
@Override
public void onMapClick(LatLng latLng) {
listView.requestDisallowInterceptTouchEvent(true);
}
});
}
}

Now in the last activity_main.xml

<?xml version=“1.0″ encoding=“utf-8″?>
<RelativeLayout xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:tools=“http://schemas.android.com/tools”
android:layout_width=“match_parent”
android:layout_height=“match_parent”
tools:context=“com.legolas.maponlistview.MainActivity”>
<ListView
android:layout_width=“match_parent”
android:layout_height=“match_parent”
android:id=“@+id/listView”>
</ListView>
</RelativeLayout>

And transparent color code id

<color name=“transparent”>#00000000</color>

so all is set. Go and bulid your project.

There is the screenshots of project:

How to attach a map fragment in ListView Header in android 2

Image Source: github.com

Written by:


Like it? Share it
Tweet this! Share on Facebook. Vote on Reddit Stumble it Digg this! Share on LinkedIn share on Google+ pinterest

Tags: No tag[s] associated with this article


BLOG SEARCH


RECENT POSTS

READ RECENT POSTS

  • The IoT world – naive opinions! March 9, 2017 / 2:05 PM
  • A few Lines about story: Real stories and incidents happened when someone pretending to know about IoT. Disclaimer: This article is not a fiction and is based on real incidents which I have faced till now. Identities of all the characters and companies appearing in this article have not been shared just to prevent their “privacy” […]

  • What is Wget? (Part-2) March 8, 2017 / 8:07 PM
  • In my last article, I introduced you all to the internet downloading tool- Wget. We have already seen the installation procedure and few basic commands. Today, we are going to explore more custom uses of this simple yet powerful tool. The method we are going to follow is, we’ll discuss a use case and then […]