android - 如何调整屏幕的纵向和横向模式，以便可以看到所有 UI 元素？

Question

我正在构建一个应用程序。我将引用分辨率游戏 View 设置保留为(800 x 1200)。 Canvas 设置如下所示 当我检查 Iphone6(750 x 1334)分辨率时，我可以看到内容，但某些组件在宽度方面被裁剪。游戏 View 如下所示。我在我的应用程序中使用面板、垂直布局组、水平布局组许多 UI 组件。

现在我将游戏 View 分辨率更改为 ipad pro(2224 x 1668)。现在我看不到我的图像。游戏 View 如下所示

我不知道如何根据不同的屏幕尺寸调整 UI 元素。我观察到的一些答案是我应该将设置保留为“随屏幕尺寸缩放”、“匹配宽度或高度”以及“匹配 slider ”至 0.5。我保留了这些设置(参见第一张图片)。但它仍然没有根据不同的屏幕尺寸而改变。

我在父元素(Showdata)中尝试了宽高比调整器，但没有用。我应该如何根据不同的屏幕尺寸更改屏幕？是否是因为我没有以正确的方式锚定 UI 元素？你将如何锚定这样的东西( Canvas >面板(沿XY拉伸(stretch))>面板(垂直布局)>许多UI元素)

我看过很多关于如何使用图像和按钮 anchor 的教程，但如何使用嵌套元素或当我们使用垂直或水平布局并且它包含许多 UI 元素时。

下面给出了每个 UI 元素的矩形变换。

Answer 1

以下是提示的简短列表，从最紧急到最不紧急:

• 将 Canvas 缩放设置为恒定物理尺寸。在 iPhone X 设备上，缩放系数为 3 倍。 Find other physical scale factors here 。这样做的目的是使 Canvas 的布局坐标与设备点相对应，同时以设备的 native 分辨率进行渲染。这是你痛苦的最紧迫的根源。
• 对于RectTransform对应全屏的组件，将其 anchor 设置为 (0, 0) , (1, 1 )，即填充父级。玩Top , Right等属性。但看来你已经知道了。
• 垂直/水平布局组的子元素应具有 LayoutElement并且通常在非滚动轴上应具有固定大小，即不要使用 ContentSizeFitter现在在行上，让它以固定高度工作。无论如何，这在移动设备上几乎总是正确的行为。
• 使用 LayoutElement 进行实验的忽略布局标志。
• 正确设置纹理的“每单位像素”设置。
• 在移动设备上，您可能会错过角落中的切口和斜角等问题。使用NotchSolution对于 Unity 2019.2 及更早版本，以及新的 Device Simulator对于 2019.3 及更高版本，可视化并适应这些问题。
• 使用回收 ScrollView 组件，例如 Optimized ScrollView Adapter 。这还将包括有关如何布局的深思熟虑的教程。如果您需要在回收 ScrollView 中内容适合高度元素，您将需要此资源。
• 要根据屏幕布局一般触发更改，请使用 OnRectTransformDimensionsChanged() 。 没有别的，不检查 Screen 中的更改!您应该熟悉EventSystem一般来说。
• 熟悉各种设备的宽高比，并使用Camera.main.aspect以在这些长宽比的手动调整布局之间正确切换。 iOS 中有 4 个。

以下是平台 Canvas 缩放器的示例:

using UnityEngine;
using UnityEngine.EventSystems;
#if UNITY_IPHONE
using UnityEngine.iOS;
#endif
using UnityEngine.UI;

namespace StackOverflow
{
    [ExecuteInEditMode]
    public sealed class PlatformCanvasScaler : UIBehaviour
    {
        public static PlatformCanvasScaler instance { get; private set; }


        public float scaleFactor
        {
            get
            {
                if (m_CanvasScaler != null)
                {
                    return m_CanvasScaler.scaleFactor;
                }

                return 1.0f;
            }
        }

        [SerializeField] private CanvasScaler m_CanvasScaler;
        [SerializeField] private float m_PhoneScaleFactor = 1.15f;

        private PlatformCanvasScaler()
        {
            instance = this;
        }

        protected override void Awake()
        {
            base.Awake();

            if (!enabled)
            {
                return;
            }

            Refresh();
        }

        private void Refresh()
        {
            var scaleFactor = 1f;
            var isMobile = PlatformCanvasScaler.isMobile;
            if (isMobile)
            {
#if UNITY_IPHONE
                switch (Device.generation)
                {
                    case DeviceGeneration.iPhoneX:
                    case DeviceGeneration.iPhoneXSMax:
                    case DeviceGeneration.Unknown:
                    case DeviceGeneration.iPadUnknown:
                    case DeviceGeneration.iPodTouchUnknown:
                        scaleFactor = 3f;
                        break;
                    case DeviceGeneration.iPhone5:
                    case DeviceGeneration.iPhoneSE1Gen:
                    case DeviceGeneration.iPhone5C:
                    case DeviceGeneration.iPhone5S:
                    case DeviceGeneration.iPhone6:
                    case DeviceGeneration.iPhone6S:
                    case DeviceGeneration.iPhone7:
                    case DeviceGeneration.iPhone8:
                    case DeviceGeneration.iPhoneXR:
                    case DeviceGeneration.iPhoneUnknown:
                        scaleFactor = 2f;
                        break;
                    case DeviceGeneration.iPhone6Plus:
                    case DeviceGeneration.iPhone7Plus:
                    case DeviceGeneration.iPhone8Plus:
                    case DeviceGeneration.iPhone6SPlus:
                        scaleFactor = 3f / 1.15f;
                        break;
                    case DeviceGeneration.iPhone:
                    case DeviceGeneration.iPhone3G:
                    case DeviceGeneration.iPhone3GS:
                    case DeviceGeneration.iPad1Gen:
                    case DeviceGeneration.iPad2Gen:
                    case DeviceGeneration.iPad3Gen:
                        scaleFactor = 1f;
                        break;
                    default:
                        scaleFactor = 2f;
                        break;
                }

                scaleFactor *= m_PhoneScaleFactor;
#else
                scaleFactor = 2f * Screen.dpi / 326f;
#endif
            }
            else
            {
                if (Screen.dpi > 140)
                {
                    scaleFactor = 2.0f;
                }
                else
                {
                    scaleFactor = 1.0f;
                }
            }

            m_CanvasScaler.scaleFactor = scaleFactor;
        }

        public static bool isMobile
        {
            get
            {
                var isPhone = false;
#if UNITY_IPHONE
                isPhone = true;
#endif
                var isMobile = Application.platform == RuntimePlatform.IPhonePlayer ||
                               (Application.isEditor && isPhone);
                return isMobile;
            }
        }

#if UNITY_EDITOR
        private void OnValidate()
        {
            Refresh();
        }
#endif

        // Update is called once per frame
        private void Update()
        {
        }
    }
}

请注意，我对 HiDPI 设备的定义做出了一些决定。

不幸的是，我最喜欢的屏幕管理 UI 资源 MaterialUI ，已弃用。希望有人可以评论他们与他人的经历。