Android custom Baidu map scaling icon, android Scaling

Source: Internet
Author: User

Android custom Baidu map scaling icon, android Scaling

To customize the scaling icon for Android Baidu map, you need to customize a scaling control. The effect is as follows:

The zoom effect enables you to zoom in and out the map by clicking the button. You can also control the available status of the zoom icon by using gestures. The specific implementation is as follows:

The first is the two xml configuration files under the drawable directory:

Zoom_selector_in.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item android:state_pressed="true" android:drawable="@drawable/zoomin_press"/>    <item android:state_enabled="false" android:drawable="@drawable/zoomin_disable"/>    <item android:drawable="@drawable/zoomin_normal"/></selector>

Zoom_selector_out.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item android:state_pressed="true" android:drawable="@drawable/zoomout_press"/>    <item android:state_enabled="false" android:drawable="@drawable/zoomout_disable"/>    <item android:drawable="@drawable/zoomout_normal"/></selector>

Zoom_controls_in_out.xml layout file in layout:

<?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"     android:orientation="vertical">    <Button        android:id="@+id/btn_zoom_in"        android:layout_width="32dp"        android:layout_height="32dp"        android:background="@drawable/zoom_selector_in" />    <Button        android:id="@+id/btn_zoom_out"        android:layout_width="32dp"        android:layout_height="32dp"        android:background="@drawable/zoom_selector_out" /></LinearLayout>

Main configuration file main_activity.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <com.baidu.mapapi.map.MapView        android:id="@+id/mv_map"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:clickable="true" />    <com.example.map.view.ZoomControlsView         android:id="@+id/zcv_zoom"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentRight="true"        android:layout_alignParentBottom="true"        android:layout_marginBottom="10dp"        android:layout_marginRight="10dp"/></RelativeLayout>
The relevant xml files are all here. The specific implementation code is as follows:

ZoomControlsView. java

Package com. example. map. view; import com. baidu. mapapi. map. baiduMap; import com. baidu. mapapi. map. mapStatus; import com. baidu. mapapi. map. mapStatusUpdateFactory; import com. baidu. mapapi. map. mapView; import com. example. map. activity. r; import android. content. context; import android. util. attributeSet; import android. widget. button; import android. widget. linearLayout; import android. view. layoutInflater; import androi D. view. view; import android. view. view. onClickListener; public class ZoomControlsView extends LinearLayout implements OnClickListener {private Button inBtn; // enlarge the private Button outBtn; // zoom out the private BaiduMap baiduMap; // Baidu map object controller private MapStatus mapStatus; // Baidu map State private float minZoomLevel; // map minimum private float maxZoomLevel; // map maximum level public ZoomControlsView (Context context, attributeSet attrs) {super (co Ntext, attrs, 0); init ();} public ZoomControlsView (Context context, AttributeSet attrs, int defStyle) {super (context, attrs, defStyle );} /*** initialize */private void init () {// obtain the Layout view LinearLayout view = (LinearLayout) LayoutInflater. from (getContext ()). inflate (R. layout. zoom_controls_in_out, null); // obtain the enlarged Button inBtn = (Button) view. findViewById (R. id. btn_zoom_in); // obtain the zoom-out Button outBtn = (Button) view. findViewById (R. id. btn_zoom _ Out); // set the Click Event inBtn. setOnClickListener (this); outBtn. setOnClickListener (this); // Add ViewaddView (view) ;}@ Overridepublic void onClick (View v) {this. mapStatus = this. baiduMap. getMapStatus (); // obtain the MAP status switch (v. getId () {case R. id. btn_zoom_in: // Changes the MAP status this. baiduMap. setMapStatus (MapStatusUpdateFactory. zoomTo (mapStatus. zoom + 1); controlZoomShow (); // change the zoom button break; case R. id. btn_zoom_out: // Changes the MAP status this. baiduMap. setMapS Tatus (MapStatusUpdateFactory. zoomTo (mapStatus. zoom-1); controlZoomShow (); // change the zoom button break; default: break;} // re-obtain the status mapStatus = this. baiduMap. getMapStatus ();}/*** set Map view * @ param mapView */public void setMapView (MapView mapView) {// get Baidu Map controller this. baiduMap = mapView. getMap (); // sets the map gesture event this. baiduMap. setOnMapStatusChangeListener (onMapStatusChangeListener); // obtain the maximum and minimum level of Baidu map maxZoomLevel = baiduMap. getMaxZoomLevel (); m InZoomLevel = baiduMap. getMinZoomLevel (); controlZoomShow (); // change the zoom button}/*** control the zoom icon display */private void controlZoomShow () {// obtain the current map status float zoom = this. baiduMap. getMapStatus (). zoom; // if the current state is greater than or equal to the maximum state of the map, the zoom-in button is invalid if (zoom> = maxZoomLevel) {inBtn. setBackgroundResource (R. drawable. zoomin_press); inBtn. setEnabled (false);} else {inBtn. setBackgroundResource (R. drawable. zoom_selector_in); inBtn. setEnabled (true);} // if the current status is less than or equal to the map's most If (zoom <= minZoomLevel) {outBtn. setBackgroundResource (R. drawable. zoomout_press); outBtn. setEnabled (false);} else {outBtn. setBackgroundResource (R. drawable. zoom_selector_out); outBtn. setEnabled (true) ;}}/*** MAP status change interface implementation */BaiduMap. onMapStatusChangeListener onMapStatusChangeListener = new BaiduMap. onMapStatusChangeListener () {/*** operations such as map operations and MAP status settings start to change the MAP status. * @ Param status map status changed at the beginning */@ Overridepublic void onMapStatusChangeStart (MapStatus arg0) {}/*** @ */@ Overridepublic void onMapStatusChangeFinish (MapStatus arg0) {}/ *** MAP status changing * @ param status current map status */@ Overridepublic void onMapStatusChange (MapStatus arg0) {controlZoomShow ();}};}

MainActivity. java:

Package com. example. map. activity; import com. baidu. mapapi. SDKInitializer; import com. baidu. mapapi. map. baiduMap; import com. baidu. mapapi. map. mapView; import com. example. map. view. zoomControlsView; import android. app. activity; import android. OS. bundle; public class MainActivity extends Activity {private MapView mvMap; // Baidu map control private BaiduMap baiduMap; // map object controller private ZoomControlsView zcvZomm; // zoom control @ Overrideprotected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); // You must SDKInitializer before setContentView. initialize (getApplicationContext (); setContentView (R. layout. main_activity); initMap (); // initialization}/*** initialize map */private void initMap () {// obtain map control mvMap = (MapView) findViewById (R. id. mv_map); mvMap. showZoomControls (false); // hide the zoom control // obtain the map object controller baiduMap = mvMap. getMap (); baiduMap. setBuildingsEnabled (true); // set to display the building baiduMap. setMapStatus (MapStatusUpdateFactory. zoomTo (19f); // sets the MAP status // gets the zcvZomm = (ZoomControlsView) findViewById (R. id. zcv_zoom); zcvZomm. setMapView (mvMap); // set Baidu map control} @ Overrideprotected void onPause () {super. onPause (); mvMap. onPause () ;}@ Overrideprotected void onResume () {super. onResume (); mvMap. onResume () ;}@ Overrideprotected void onDestroy () {super. onDestroy (); mvMap. onDestroy (); // destroy MAP }}

In this way, the custom zoom icon is implemented.




How can I adjust the position of the android Baidu map zoom control?

The position of the zoom control on the mobile Baidu map page seems to be fixed. As a common user, there is no way to adjust it. Unless the program is modified by a program designer or programmer. As for the possibility of overwriting during use, you should be able to show the zoom control through the drop-down, push-up, or other key operations.

How can I zoom in and zoom out a map with two fingers when developing Baidu map js version Android?

Baidu map js version. Currently, only slide is supported on Androids, and slide and dual-finger scaling are supported on IOS.
This is not a problem with Baidu map, but a browser on the Android device that does not fully support multi-touch.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.