ngày 12-05-2016
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="tranduythanh.com.learngooglemap.MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Chọn kiểu Map:" />
<Spinner
android:id="@+id/spinner_map_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
<fragment
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.MapFragment"
/>
</LinearLayout>
|
Tiếp tục bổ sung string-array cho strings.xml để lưu trữ các cách hiển thị Map, đặt tên array này là maps_type:
<string-array name="maps_type">
<item >MAP_TYPE_NONE</item>
<item >MAP_TYPE_NORMAL</item>
<item >MAP_TYPE_SATELLITE</item>
<item >MAP_TYPE_HYBRID</item>
<item >MAP_TYPE_TERRAIN</item>
</string-array>
|
Cuối cùng trong MainActivity, tiến hành hiệu chỉnh coding để tương tác với Spinner, tương ứng với kiểu chọn lựa nào thì hiển thị Map với chế độ đó:
Spinner spinner_maps_type=(Spinner) findViewById(R.id.spinner_map_type);
String arrMap[]=getResources().getStringArray(R.array.maps_type);
ArrayAdapter<String> adapterMap=new ArrayAdapter<>
(this, android.R.layout.simple_spinner_item, arrMap);
adapterMap.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
spinner_maps_type.setAdapter(adapterMap);
spinner_maps_type.setOnItemSelectedListener(new OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> arg0, View arg1,
int arg2, long arg3) {
int type=GoogleMap.MAP_TYPE_NORMAL;
switch(arg2)
{
case 0:
type=GoogleMap.MAP_TYPE_NONE;
break;
case 1:
type=GoogleMap.MAP_TYPE_NORMAL;
break;
case 2:
type=GoogleMap.MAP_TYPE_SATELLITE;
break;
case 3:
type=GoogleMap.MAP_TYPE_TERRAIN;
break;
case 4:
type=GoogleMap.MAP_TYPE_HYBRID;
break;
}
map.setMapType(type);
}
@Override
public void onNothingSelected(AdapterView<?> arg0) {
}
});
|
Khi chạy ứng dụng lên ta sẽ có các kết quả sau:
– Tiến hành vẽ các đối tượng Shape lên Google Map: Tui sẽ hướng dẫn cách vẽ Polyline, Polygons, Circle trên Map, dưới đây là một số hình minh họa:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context="tranduythanh.com.learngooglemap.MainActivity" >
<item android:id="@+id/mnuveduongthang" android:title="Vẽ đường thẳng"></item>
<item android:id="@+id/mnuvepolyline" android:title="Vẽ polyline"></item>
<item android:id="@+id/mnuvepolygon" android:title="Vẽ Polygon"></item>
</menu>
|
Xử lý coding chọn menu Item trong MainActivity:
PolylineOptions plOption=new PolylineOptions();
int typedraw;
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;
}
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId()==R.id.mnuveduongthang)
typedraw=0;
else if (item.getItemId()==R.id.mnuvepolyline)
typedraw=1;
else
typedraw=2;
latPrevious=null;
return super.onOptionsItemSelected(item);
}
|
Tiếp theo bổ sung sự kiện OnMapClickListener cho Map:
map.setOnMapClickListener(new OnMapClickListener() {
@Override
public void onMapClick(LatLng arg0) {
if(typedraw==0)
{
CircleOptions optionCircle=new CircleOptions();
optionCircle.center(arg0).radius(50);
Circle cir=map.addCircle(optionCircle);
cir.setFillColor(Color.RED);
cir.setStrokeColor(Color.BLUE);
if(latPrevious==null)
latPrevious=arg0;
//xử lý vẽ đường thẳng
else if(latPrevious!=null)
{
PolylineOptions optionLine=new PolylineOptions();
optionLine.add(latPrevious);
optionLine.add(arg0);
Polyline line=map.addPolyline(optionLine);
line.setColor(Color.BLUE);
line.setWidth(1);
latPrevious=null;
}
}
else if(typedraw==1)
{
if(latPrevious==null)
plOption=new PolylineOptions();
if(latPrevious!=null)
{
plOption.add(latPrevious);
plOption.add(arg0);
Polyline polyline= map.addPolyline(plOption);
polyline.setColor(Color.RED);
}
latPrevious=arg0;
}
else if(typedraw==2)
{
PolygonOptions pgOption=new PolygonOptions();
double h1=0.5;
double h2=0.25;
LatLng center=arg0;
LatLng p1=new LatLng(center.latitude-h1, center.longitude);
LatLng p2=new LatLng(center.latitude-h2, center.longitude-h2);
LatLng p3=new LatLng(center.latitude-h2, center.longitude-h1);
LatLng p4=new LatLng(center.latitude+h2, center.longitude-h2);
LatLng p5=new LatLng(center.latitude+h1, center.longitude-h1);
LatLng p6=new LatLng(center.latitude+h2, center.longitude);
LatLng p7=new LatLng(center.latitude+h1, center.longitude+h1);
LatLng p8=new LatLng(center.latitude+h2, center.longitude+h2);
LatLng p9=new LatLng(center.latitude-h2, center.longitude+h1);
LatLng p10=new LatLng(center.latitude-h2, center.longitude+h2);
pgOption.add(p1);
pgOption.add(p2);
pgOption.add(p3);
pgOption.add(p4);
pgOption.add(p5);
pgOption.add(p6);
pgOption.add(p7);
pgOption.add(p8);
pgOption.add(p9);
pgOption.add(p10);
pgOption.add(p1);
Polygon polyGon= map.addPolygon(pgOption);
polyGon.setFillColor(Color.YELLOW);
polyGon.setStrokeColor(Color.BLUE);
polyGon.setStrokeWidth(5);
}
}
});
}
|