unity Aspect Ratio Fitter

### 实现 Unity 图片两边自适应布局的方法 为了使图片在不同屏幕分辨率下保持良好的视觉效果并实现两边自适应，可以采用特定的 UI 组件组合来完成这一目标。具体来说，`Image` 组件配合 `Aspect Ratio Fitter` 和 `Canvas Scaler` 可以很好地解决这个问题。 #### 使用 Aspect Ratio Fitter 控制宽高比例 当希望图像能够根据其原始宽高比自动调整大小时，可以在 Image 上添加 Aspect Ratio Fitter 组件。这允许图像在其父级容器内按比例缩放而不失真[^1]。 ```csharp // C# 脚本用于动态设置 Aspect Ratio Fitter 的模式和比率 using UnityEngine; using UnityEngine.UI; public class SetAspectRatio : MonoBehaviour { private void Start() { AspectRatioFitter arf = GetComponent<AspectRatioFitter>(); if (arf != null) { arf.aspectMode = AspectRatioFitter.AspectMode.FitInParent; // 或者 FitInsideParent arf.aspectRatio = 16 / 9f; // 设置期望的宽高比 } } } ``` #### 配置 Canvas Scaler 进行屏幕适配 对于整个 UI 布局而言，合理配置 Canvas Scaler 是非常重要的一步。选择合适的 Scale Mode 对于确保 UI 在各种设备上都能良好显示至关重要。通常情况下，推荐使用 **Scale With Screen Size** 模式，并适当调整 Match 参数以及 Reference Resolution 来达到最佳效果[^2]。 - 将 Canvas 下的 Canvas Scaler Component 的 Scale Mode 设定为 “Scale With Screen Size” - 根据设计稿设定好 Reference Resolution（例如：800x600） - 调整 Match 参数至适合的比例（一般建议设为 0.5） 这样做的好处是可以让 UI 元素按照一定的规则随屏幕尺寸变化而相应调整位置与大小，从而实现在不同屏幕上的一致体验。 #### 应用 Horizontal Or Vertical Layout Groups 为了让子对象能够在水平或垂直方向均匀分布，还可以考虑应用 `Horizontal Layout Group` 或 `Vertical Layout Group` 组件给包含这些元素的 GameObjects。同时启用 Child Force Expand 属性可以让所有子项填充可用空间，进一步增强自适应能力。 通过上述方法结合实际项目需求灵活运用各个组件特性，即可轻松创建出既美观又实用的画面布局方案。