在上篇文章中,我们已经申请了高德地图开发KEY,并在android studio中部署了高德地图开发环境,这篇文章介绍如何显示地图和自定义控件。
1.地图显示
1.1本篇文章主要用Fragment显示地图,定义布局文件fragment_map:
android:layout_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/gaodemap" android:layout_width="match_parent" android:layout_height="match_parent"> <CheckBox android:id="@+id/louk_btn" android:layout_margin="20dp" android:layout_alignParentRight="true" android:layout_width="52dp" android:button="@color/transparent" android:background="@drawable/map_traffic" android:layout_height="52dp" />
1.2 继承Fragment,创建MapFragment
1.2.1在OncreatView初始化高德地图
@Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { mView = inflater.inflate( R.layout.fragment_map, container, false); init(); initView(); return mView; } /* * 初始化控件 * */ private void initView(){ //路况图层控制控件 mCBLouk=(CheckBox)mView.findViewById(R.id.louk_btn); //自定义放大缩小控件 mIBzoomIn=(ImageButton)mView.findViewById(R.id.map_zoomin); mIBzoomOut=(ImageButton)mView.findViewById(R.id.map_zoomout); } /** * 初始化高德地图SupportMapFragment对象 */ private void init() { //高德地图条件 AMapOptions aOptions = new AMapOptions(); //aOptions.zoomGesturesEnabled(false);// 禁止通过手势缩放地图 // aOptions.scrollGesturesEnabled(false);// 禁止通过手势移动地图 aOptions.tiltGesturesEnabled(false);// 禁止通过手势倾斜地图 point =new LatLng(31.2993790000,120.6195830000); //苏州市中心点坐标(注意是高德坐标) CameraPosition LUJIAZUI = new CameraPosition.Builder() .target(point).zoom(17).build(); aOptions.camera(LUJIAZUI); if (aMapFragment == null) { aMapFragment = SupportMapFragment.newInstance(aOptions); FragmentTransaction fragmentTransaction =getActivity(). getSupportFragmentManager() .beginTransaction(); fragmentTransaction.add(R.id.gaodemap, aMapFragment, "gaodemap"); fragmentTransaction.commit(); } }
1.2.2 在onResume()初始化高德地图AMap对象
@Override public void onResume() { super.onResume(); initMap(); } /** * 初始化高德地图AMap对象 */ private void initMap() { if (aMap == null) { aMap = aMapFragment.getMap();// amap对象初始化成功 //设置地图参数 setUpMap(); } }
2.自定义放大缩小控件
由于高德地图自带的布局按钮太丑,我们隐藏默认放大缩小控件,自定义新的控件:
2.1在上面的fragment_map布局文件中加入放大缩小布局按钮
<LinearLayout android:id="@+id/map_zoom" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentBottom="true" android:layout_marginRight="10dp" android:layout_marginBottom="5dp" android:padding="8dp" android:background="@drawable/bg_zoom" android:orientation="vertical" > <ImageButton android:id="@+id/map_zoomin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:contentDescription="@null" android:src="@drawable/ic_map_zoomin" android:background="@null" />android:layout_height="0.5dp" android:layout_marginTop="8dp" android:layout_marginBottom="8dp" android:background="@android:color/darker_gray"/> <ImageButton android:id="@+id/map_zoomout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:contentDescription="@null" android:src="@drawable/ic_map_zoomout" android:background="@null" />
2.2 在initMap中自定义控件,如下:
/** * 设置地图参数 * @author */ private void setUpMap() { //隐藏高德地图默认的放大缩小控件 aMap.getUiSettings().setZoomControlsEnabled(false); //开始定位 //startPostion();//路况图层触发事件 mCBLouk.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub //判断路况图层是否显示 if (mCBLouk.isChecked()){ aMap.setTrafficEnabled(true); mCBLouk.setBackgroundColor(getResources().getColor(R.color.light_gery)); mCBLouk.setButtonDrawable(getResources().getDrawable(R.drawable.map_traffic_hl)); }else{ aMap.setTrafficEnabled(false); mCBLouk.setBackgroundColor(getResources().getColor(R.color.light_gery)); mCBLouk.setButtonDrawable(getResources().getDrawable(R.drawable.map_traffic)); } } });//放大缩小事件触发 mIBzoomIn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub aMap.animateCamera(CameraUpdateFactory.zoomIn()); } }); mIBzoomOut.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub aMap.animateCamera(CameraUpdateFactory.zoomOut()); } }); }