Android中ViewPager内Mapbox v8.0.0无法完整显示问题

我之前在项目里也碰到过一模一样的情况——普通Fragment里的MapView显示正常，但嵌套进ViewPager后，v8.0.0及以上版本的MapView底部就会出现黑块，低版本反而没问题。结合我的排查经验，给你几个靠谱的解决方案：

可能的原因 #

Mapbox从v8.0.0开始调整了MapView的布局测量和渲染逻辑，在ViewPager这种动态切换的容器里，MapView有时候不能正确感知父布局的边界，导致底部区域没有被正确渲染。

方案1：调整布局结构，确保MapView能正确填充父容器 #

如果你的tabs.xml用的是RelativeLayout，很容易出现布局层级冲突，建议改用ConstraintLayout来精确控制ViewPager和MapView的布局范围，避免出现控件覆盖或者高度计算错误：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Tab栏 -->
    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent" />

    <!-- ViewPager 填充Tab栏下方的全部空间 -->
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@id/tab_layout"
        app:layout_constraintBottom_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

同时，在包含MapView的Fragment布局里，给MapView设置android:layout_width="match_parent"和android:layout_height="match_parent"，不要用固定高度。

方案2：手动触发MapView的重新布局和渲染 #

在MapView加载完成后，监听布局完成事件，强制MapView重新计算边界并刷新渲染：

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    MapView mapView = view.findViewById(R.id.map_view);
    mapView.onCreate(savedInstanceState);
    
    mapView.getMapAsync(mapboxMap -> {
        // 加载地图样式等常规操作
        // 监听布局完成后重置地图视口
        mapView.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                // 移除监听避免重复触发
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                    mapView.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                } else {
                    mapView.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                }
                // 重置padding并强制重新布局
                mapboxMap.getViewport().setPadding(0, 0, 0, 0);
                mapView.requestLayout();
                // 刷新地图样式确保渲染完整
                mapboxMap.getStyle().ifPresent(style -> style.refresh());
            }
        });
    });
}

方案3：检查ViewPager的预加载设置 #

如果你的ViewPager设置了较大的offscreenPageLimit，预加载的Fragment里的MapView可能会因为提前初始化但没有正确获取布局参数，导致渲染异常。可以把这个值调整为1或者2，只保留当前页面和相邻页面的预加载：

viewPager.setOffscreenPageLimit(1);

方案4：确保MapView生命周期方法正确调用 #

Mapbox v8+对生命周期的依赖比旧版本更严格，一定要在Fragment的对应方法里调用MapView的生命周期方法：

@Override
public void onResume() {
    super.onResume();
    mapView.onResume();
}

@Override
public void onPause() {
    super.onPause();
    mapView.onPause();
}

@Override
public void onDestroyView() {
    super.onDestroyView();
    mapView.onDestroy();
}

@Override
public void onSaveInstanceState(@NonNull Bundle outState) {
    super.onSaveInstanceState(outState);
    mapView.onSaveInstanceState(outState);
}

以上几个方案我都试过，大部分情况下方案1和方案2组合起来就能解决问题，如果还是不行，可以试试调整ViewPager的动画或者切换逻辑，避免布局切换时的计算冲突。

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