基于Google Map API的Android应用UI优化：地图移动隐软键盘及定位按钮美化

Great questions! Let's tackle these two UI tweaks to make your app feel more polished and native to Android's design standards.

1. Auto-Hide Soft Keyboard on Map Interaction #

Since you already have a working method to hide the soft keyboard, we just need to trigger it whenever the user interacts with the map (tap, drag, or gesture). Here's how to hook into Google Maps' built-in listeners:

• In your onMapReady callback, attach these listeners to your GoogleMap instance:

  override fun onMapReady(googleMap: GoogleMap) {
      this.googleMap = googleMap
  
      // Hide keyboard when user taps the map
      googleMap.setOnMapClickListener {
          yourExistingHideKeyboardMethod()
      }
  
      // Hide keyboard when user starts dragging the map
      googleMap.setOnMapDragListener(object : GoogleMap.OnMapDragListener {
          override fun onMapDragStart() {
              yourExistingHideKeyboardMethod()
          }
  
          override fun onMapDrag(p0: Point?) {}
          override fun onMapDragEnd() {}
      })
  
      // Optional: Hide keyboard on gesture-based camera moves (pinch to zoom, rotate)
      googleMap.setOnCameraMoveStartedListener { reason ->
          if (reason == GoogleMap.OnCameraMoveStartedListener.REASON_GESTURE) {
              yourExistingHideKeyboardMethod()
          }
      }
  }
  

• If you need a quick refresher on a robust hide keyboard method, here's a standard implementation:

  private fun yourExistingHideKeyboardMethod() {
      val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
      currentFocus?.let { view ->
          imm.hideSoftInputFromWindow(view.windowToken, 0)
      }
  }
  

2. Replicate Google Maps' Native "Fly to Current Location" Button #

To match Google's clean, circular location button style, we'll use Material Design components for an authentic look and feel:

Step 1: Add Material Design Dependency #

Ensure your app-level build.gradle.kts (or build.gradle) includes the latest Material library:

dependencies {
    implementation "com.google.android.material:material:1.11.0" // Use the latest version
}

Step 2: Replace Your Button in Layout #

Swap your current button with this styled MaterialButton in your layout file:

<com.google.android.material.button.MaterialButton
    android:id="@+id/btn_fly_to_location"
    android:layout_width="56dp"
    android:layout_height="56dp"
    android:layout_margin="16dp"
    android:icon="@drawable/ic_my_location" // Use Material's official location icon
    android:iconTint="@color/white"
    android:backgroundTint="@color/google_blue" // Match Google's blue (#4285F4)
    app:shapeAppearance="@style/ShapeAppearance.App.Circle"
    app:layout_anchor="@id/map_view"
    app:layout_anchorGravity="bottom|end" />

• Get the ic_my_location drawable via Android Studio's Vector Asset Studio (search for "my location" in Material Icons).
• Define @color/google_blue as #4285F4 in your colors.xml for an exact match.

Step 3: Add Smooth Camera Animation Logic #

In your activity/fragment, set up the click listener to animate the camera to the user's location (mimicking Google's native behavior):

btn_fly_to_location.setOnClickListener {
    val currentLocation = googleMap.myLocation // Or use your location provider
    currentLocation?.let { location ->
        val targetLatLng = LatLng(location.latitude, location.longitude)
        googleMap.animateCamera(
            CameraUpdateFactory.newLatLngZoom(targetLatLng, 15f), // Adjust zoom level as needed
            1000, // 1-second animation (matches Google's speed)
            object : GoogleMap.CancelableCallback {
                override fun onFinish() {}
                override fun onCancel() {}
            }
        )
    }
}

Bonus: Ensure Native Touch Feedback #

Make sure your app uses a Material Component theme (like Theme.MaterialComponents.DayNight.DarkActionBar) to enable the built-in ripple effect on button taps—this completes the native feel.

内容的提问来源于stack exchange，提问作者justunkn0wn