时间戳

首页 > 解决方案 > 如何调整纵向和横向模式的屏幕，以便可以看到所有 UI 元素？

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

问题描述

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

Iphone6 分辨率()750 x 1334

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

我不知道如何根据不同的屏幕尺寸调整 UI 元素。我观察到的一些答案是我应该保持设置为 Scale with screen size、match width or height 和 Match slider to 0.5。我保留了这些设置（见第一张图片）。它仍然没有根据不同的屏幕尺寸而改变。

我在父元素（Showdata）中尝试了纵横比调整器，但没有用。我应该怎么做才能根据不同的屏幕尺寸更改屏幕？是因为我没有以正确的方式锚定 UI 元素吗？你将如何锚定这样的东西（画布>面板（沿 XY 拉伸）>面板（垂直布局）>许多 UI 元素）

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

下面给出了每个 UI 元素的 Rect 变换。 等级制度

标签： androidiosunity3dscreen-resolution

解决方案

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

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

这是平台画布缩放器的示例：

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已弃用。希望有人可以评论他们与他人的经历。

推荐阅读