如何让自定义View根据自身宽高比适配横竖屏资源而非设备方向？

核心思路 #

针对每个自定义View，根据自身最终宽高比而非设备屏幕方向选择对应资源（布局、尺寸等），在View首次布局完成时加载匹配的资源，设备旋转重建View时自动重新匹配。

步骤1：统一资源命名规范 #

为竖屏（View高度>宽度）和横屏（View宽度>高度）资源设置统一命名后缀，便于代码中动态选择：

• 布局文件：
  • 竖屏：res/layout/component_portrait.xml
  • 横屏：res/layout/component_landscape.xml
• 尺寸资源（res/values/dimens.xml）：

  <dimen name="component_title_size_portrait">16sp</dimen>
  <dimen name="component_title_size_landscape">24sp</dimen>
  

步骤2：在自定义View中实现资源选择逻辑 #

在View的onLayout方法中（此时已获取最终实际宽高），判断宽高比并加载对应资源，确保只在首次布局时执行：

代码示例（Java） #

public class CustomComponent extends ViewGroup {
    public CustomComponent(Context context) {
        super(context);
        init();
    }

    public CustomComponent(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CustomComponent(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        // 初始化通用逻辑，不加载布局
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        // 仅在首次布局或尺寸变更时加载对应资源
        if (changed && getChildCount() == 0) {
            int viewWidth = getWidth();
            int viewHeight = getHeight();
            loadMatchingResources(viewWidth, viewHeight);
        }
    }

    private void loadMatchingResources(int width, int height) {
        LayoutInflater inflater = LayoutInflater.from(getContext());
        int layoutRes;
        int titleSizeRes;

        if (height > width) {
            // View为竖屏形态，加载竖屏资源
            layoutRes = R.layout.component_portrait;
            titleSizeRes = R.dimen.component_title_size_portrait;
        } else {
            // View为横屏形态，加载横屏资源
            layoutRes = R.layout.component_landscape;
            titleSizeRes = R.dimen.component_title_size_landscape;
        }

        // 加载布局
        inflater.inflate(layoutRes, this, true);
        // 应用尺寸资源
        float titleSize = getResources().getDimension(titleSizeRes);
        TextView titleTv = findViewById(R.id.component_title);
        titleTv.setTextSize(TypedValue.COMPLEX_UNIT_PX, titleSize);
    }
}

代码示例（Kotlin + ViewBinding） #

使用ViewBinding简化布局加载操作：

class CustomComponent @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : ViewGroup(context, attrs, defStyleAttr) {

    init {
        // 初始化通用逻辑
    }

    override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
        super.onLayout(changed, left, top, right, bottom)
        if (changed && childCount == 0) {
            val viewWidth = width
            val viewHeight = height
            loadMatchingResources(viewWidth, viewHeight)
        }
    }

    private fun loadMatchingResources(width: Int, height: Int) {
        val binding = if (height > width) {
            ComponentPortraitBinding.inflate(LayoutInflater.from(context), this, true)
        } else {
            ComponentLandscapeBinding.inflate(LayoutInflater.from(context), this, true)
        }

        val titleSize = resources.getDimension(
            if (height > width) R.dimen.component_title_size_portrait 
            else R.dimen.component_title_size_landscape
        )
        binding.componentTitle.setTextSize(TypedValue.COMPLEX_UNIT_PX, titleSize)
    }
}

步骤3：处理设备旋转场景 #

当用户切换设备方向时，View会随页面重建，此时onLayout会再次触发，根据新的自身宽高比重新加载对应资源，完全符合需求。

关键注意事项 #

• 避免在onMeasure中过早加载资源：onMeasure可能多次执行，且首次测量可能未得到最终尺寸，onLayout能确保获取到View的实际显示宽高。
• 限制资源加载次数：通过getChildCount() == 0判断，确保仅在首次布局时加载资源，避免重复加载导致的性能问题。
• 资源命名一致性：严格遵循命名规范，减少代码中硬编码的错误概率。

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