Android ScrollView内嵌ImageView点击调整尺寸实现全屏显示解决方案

问题根源 #

你当前代码失效的核心原因有2个：

• ImageView的直接父布局是LinearLayout，你却使用了ScrollView.LayoutParams来设置布局参数，参数类型不匹配导致设置不生效
• 你填写的高度值为原始像素值，没有根据设备密度做dp转换，不同设备上显示高度差异会非常大

现有逻辑修复方案 #

先修正点击事件代码，调整布局参数类型并做dp转像素处理：

itemImage.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        // 将dp值转换为当前设备对应的像素值
        int height192dp = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 192, getResources().getDisplayMetrics());
        int targetFullHeight = getResources().getDisplayMetrics().heightPixels; // 直接取屏幕高度实现真正全屏
        if(isImageFitToScreen) {
            isImageFitToScreen = false;
            // 父布局为LinearLayout，使用对应类型的LayoutParams
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, height192dp);
            itemImage.setLayoutParams(layoutParams);
            itemImage.setScaleType(ImageView.ScaleType.CENTER);
            // 恢复Toolbar和系统栏显示
            htab_toolbar.setVisibility(View.VISIBLE);
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
                getActivity().getWindow().setDecorFitsSystemWindows(true);
                getActivity().getWindow().getInsetsController().show(WindowInsets.Type.statusBars() | WindowInsets.Type.navigationBars());
            } else {
                getActivity().getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);
            }
        } else {
            isImageFitToScreen = true;
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, targetFullHeight);
            itemImage.setLayoutParams(layoutParams);
            itemImage.setScaleType(ImageView.ScaleType.CENTER_CROP);
            // 隐藏Toolbar和系统栏实现真正的全屏效果
            htab_toolbar.setVisibility(View.GONE);
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
                getActivity().getWindow().setDecorFitsSystemWindows(false);
                getActivity().getWindow().getInsetsController().hide(WindowInsets.Type.statusBars() | WindowInsets.Type.navigationBars());
            } else {
                getActivity().getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
            }
        }
    }
});

更优的推荐方案 #

直接修改原有页面布局的方式容易打乱页面结构，还会导致下方内容被挤出可视区域，更推荐使用悬浮预览方案：

• 点击图片时弹出一个全屏的Dialog/DialogFragment
• 在Dialog中加载图片，可额外支持手势缩放、双击放大、保存图片等扩展功能
• 关闭Dialog即可直接回到原页面，不会影响原有页面的布局和滚动状态

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