I have Google map implemented into my app (in fragment) when I open that fragment it just show gray screen while I am getting correct latitude, longitude

Code

override fun onCreateView(
  inflater: LayoutInflater, container: ViewGroup?,
  savedInstanceState: Bundle?
): View? {
  // Inflate the layout for this fragment
  val root = inflater.inflate(R.layout.fragment_map_to_customer, container, false)
  customerAddressArgument = requireArguments().getString("customerAddressArgument").toString()
  // Google Maps
  var mapView = root.findViewById(R.id.map) as MapView
  mapView.getMapAsync(this)
  mapView.onCreate(arguments)
  return root
}

override fun onMapReady(googleMap: GoogleMap) {
  mMap = googleMap
  // mMap.uiSettings.isZoomControlsEnabled = true

  val geoCoder = Geocoder(context)
  var address = geoCoder.getFromLocationName(customerAddressArgument, 1)!![0]
  val latLng = LatLng(address.latitude, address.longitude)
  mMap!!.addMarker(MarkerOptions().position(latLng).title("Location"))
  mMap!!.animateCamera(CameraUpdateFactory.newLatLng(latLng))
  Log.d("latLng20:", latLng.toString()) <-- return: **D/latLng20:: lat/lng: (-6.3946055,106.7947916)**
  Toast.makeText(
    context,
    address.latitude.toString() + " " + address.longitude,
    Toast.LENGTH_LONG
  ).show()
}

latLng in google maps website

Any idea?

The issue

During debugging process I found out that my map needs tapping on screen in order to load each individual part of it and it does not load elements by itself.

Solution

To fix the issue I've found and answer here that suggested to use onResume() function in order to load maps and here is how it's done.

var mapView: MapView? = null //<-- add this

override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment
        val root = inflater.inflate(R.layout.fragment_map_to_customer, container, false)
        customerAddressArgument = requireArguments().getString("customerAddressArgument").toString()

        // Google Maps
        mapView = root.findViewById(R.id.map) as MapView //<- define it here
        mapView!!.getMapAsync(this)
        mapView!!.onCreate(arguments)
        return root
}

override fun onResume() {
  mapView?.onResume() //<- get it in onResume()
  super.onResume()
}

And problem solved.