jjzjj

ios - 不同 iPhone 屏幕的布局

coder 2024-01-22 原文

在学习了一些教程后，我正在构建我的第一个真实世界的应用程序，但我遇到了布局问题。调整 UI 布局以适应不同的屏幕尺寸类别非常简单，但我还没有找到任何关于如何在相同尺寸类别内调整布局的信息。

例如，我有一个标签，其顶部空间约束设置为 40 pt form top of view。它在 iPhone 8 Plus 的大屏幕上看起来很整洁:

但是在较小的 iPhone SE 屏幕上(令人困惑的是相同尺寸的屏幕)这个 40 pt 的约束将标签推到中间的一半，在它下面留下相当少有用的空间:

所以我想知道是否有一种方法可以为不同的 iPhone 设置不同的限制:例如，iPhone 8 Plus 为 40 pt，iPhone 8 为 30 pt，iPhone SE 为 20 pt。将其他 View 定位在标签下方也是如此:我希望它们在小 iPhone 屏幕上在垂直方向上更紧凑，而在大屏幕上它们之间有更多空间。我知道这最后一部分可以通过堆栈 View 来解决，但使用起来并不总是很方便。

更新。这是 8 Plus 屏幕上 View 的完整布局:

它有 3 个固定约束: 1. 从“标题”标签到 View 顶部 - 50 pt 2. 从“百分比”标签到“标题”标签底部 - 60 pt 3. 从“详细信息”标签到 View 底部 - 80 pt。

我在所有标签中使用了文本自动收缩 + 每个标签的高度与 View 的高度成正比。这使得布局更加灵活，但在小型 SE 屏幕上仍然存在一个明显的问题:

如您所见，“详细信息”被压缩到“百分比”标签。在这一点上，将“百分比”标签向上移动并靠近“标题”会很棒，但与高度不同的是，约束不能按比例设置(至少在 IB 中不能)到 Superview 高度。

我看到的选项之一是在顶部和中间标签之间放置一个空白 View ，使其高度成比例并将“百分比”标签顶部约束设置为 0 到此空白 View 。不确定使用这样的“拐杖”是否是一个好习惯。

最佳答案

您可能通过使用单个 UILabel 并设置属性文本来获得最满意的结果，而不是尝试获取多个标签和字体大小配合。

试试这个:

  • 创建一个新的 View Controller
  • 添加一个普通的UILabel
  • 将约束设置为宽度的 85% 和高度的 80%，并在两侧居中
  • 将标签连接到 IBOutlet

然后:

class ScalingViewController: UIViewController {

    @IBOutlet weak var theLabel: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()

        let titleFont = UIFont.systemFont(ofSize: 80.0, weight: UIFontWeightThin)
        let pctFont = UIFont.systemFont(ofSize: 100.0, weight: UIFontWeightThin)
        let paraFont = UIFont.systemFont(ofSize: 30.0, weight: UIFontWeightLight)

        // for blank lines between Title and Percent and between Percent and Body
        let blankLineFont = UIFont.systemFont(ofSize: 36.0, weight: UIFontWeightLight)

        let sTitle = "Title"
        let sPct = "78%"
        let sBody = "A detailed text explaining the meaning of percentage above and what a person should do to make it lower or higher."

        // create the Attributed String by combining Title, Percent and Body, plus blank lines
        let attText = NSMutableAttributedString()

        attText.append(NSMutableAttributedString(string: sTitle, attributes: [NSFontAttributeName: titleFont]))
        attText.append(NSMutableAttributedString(string: "\n\n", attributes: [NSFontAttributeName: blankLineFont]))
        attText.append(NSMutableAttributedString(string: sPct, attributes: [NSFontAttributeName: pctFont]))
        attText.append(NSMutableAttributedString(string: "\n\n", attributes: [NSFontAttributeName: blankLineFont]))
        attText.append(NSMutableAttributedString(string: sBody, attributes: [NSFontAttributeName: paraFont]))

        // these properties can be set in Interface Builder... or set them here to make sure.
        theLabel.textAlignment = .center
        theLabel.numberOfLines = 0
        theLabel.adjustsFontSizeToFitWidth = true
        theLabel.minimumScaleFactor = 0.05

        // set the label content
        theLabel.attributedText = attText

    }

}

这为我提供了 7+、6s 和 SE 的这些结果:

并且，仅出于演示的目的，它在“正文”段落中添加其他文本时的外观:

关于ios - 不同 iPhone 屏幕的布局，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46734175/

iPhoneiosimagenoreferrerNSMutableAttributedStringautolayoutinterface-builder

有关ios - 不同 iPhone 屏幕的布局的更多相关文章

  1. ruby - 如何验证 IO.copy_stream 是否成功 - 2

    这里有一个很好的答案解释了如何在Ruby中下载文件而不将其加载到内存中:https://stackoverflow.com/a/29743394/4852737require'open-uri'download=open('http://example.com/image.png')IO.copy_stream(download,'~/image.png')我如何验证下载文件的IO.copy_stream调用是否真的成功——这意味着下载的文件与我打算下载的文件完全相同，而不是下载一半的损坏文件？documentation说IO.copy_stream返回它复制的字节数，但是当我还没有下

  2. Ruby 文件 IO 定界符？ - 2

    我正在尝试解析一个文本文件，该文件每行包含可变数量的单词和数字，如下所示:foo4.500bar3.001.33foobar如何读取由空格而不是换行符分隔的文件？有什么方法可以设置File("file.txt").foreach方法以使用空格而不是换行符作为分隔符？ 最佳答案 接受的答案将slurp文件，这可能是大文本文件的问题。更好的解决方案是IO.foreach.它是惯用的，将按字符流式传输文件:File.foreach(filename,""){|string|putsstring}包含“thisisanexample”结果的

  3. ruby - nanoc 和多种布局 - 2

    是否可以为特定(或所有)项目使用多个布局？例如，我有几个项目，我想对其应用两种不同的布局。一个是绿色的，一个是蓝色的(但是)。我想将它们编译到我的输出目录中的两个不同文件夹中(例如v1和v2)。我一直在玩弄规则和编译block，但我不知道这是怎么回事。因为，每个项目在编译过程中只编译一次，我不能告诉nanoc第一次用layout1编译，第二次用layout2编译。我试过这样的东西，但它导致输出文件损坏。compile'*'doifitem.binary?#don’tfilterbinaryitemselsefilter:erblayout'layout1'layout'layout2'

  4. 屏幕录制为什么没声音？检查这2项，轻松解决 - 2

    相信很多人在录制视频的时候都会遇到各种各样的问题，比如录制的视频没有声音。屏幕录制为什么没声音？今天小编就和大家分享一下如何录制音画同步视频的具体操作方法。如果你有录制的视频没有声音，你可以试试这个方法。 一、检查是否打开电脑系统声音相信很多小伙伴在录制视频后会发现录制的视频没有声音，屏幕录制为什么没声音？如果当时没有打开音频录制，则录制好的视频是没有声音的。因此，建议在录制前进行检查。屏幕上没有声音，很可能是因为你的电脑系统的声音被禁止了。您只需打开电脑系统的声音，即可录制音频和图画同步视频。操作方法：步骤1：点击电脑屏幕右下侧的“小喇叭”图案，在上方的选项中，选择“声音”。 步骤2：在“声

  5. Get https://registry-1.docker.io/v2/: net/http: request canceled while waiting - 2

    1.错误信息：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:requestcanceledwhilewaitingforconnection(Client.Timeoutexceededwhileawaitingheaders)或者：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:TLShandshaketimeout2.报错原因：docker使用的镜像网址默认为国外，下载容易超时，需要修改成国内镜像地址（首先阿里

  6. java - 为什么 ruby​​ modulo 与 java/other lang 不同？ - 2

    我基本上来自Java背景并且努力理解Ruby中的模运算。(5%3)(-5%3)(5%-3)(-5%-3)Java中的上述操作产生，2个-22个-2但在Ruby中，相同的表达式会产生21个-1-2.Ruby在逻辑上有多擅长这个？模块操作在Ruby中是如何实现的？如果将同一个操作定义为一个web服务，两个服务如何匹配逻辑。 最佳答案 在Java中，模运算的结果与被除数的符号相同。在Ruby中，它与除数的符号相同。remainder()在Ruby中与被除数的符号相同。您可能还想引用modulooperation.

  7. ruby-on-rails - 在 RSpec 中，如何以任意顺序期望具有不同参数的多条消息？ - 2

    RSpec似乎按顺序匹配方法接收的消息。我不确定如何使以下代码工作:allow(a).toreceive(:f)expect(a).toreceive(:f).with(2)a.f(1)a.f(2)a.f(3)我问的原因是a.f的一些调用是由我的代码的上层控制的，所以我不能对这些方法调用添加期望。 最佳答案 RSpecspy是测试这种情况的一种方式。要监视一个方法，用allowstub，除了方法名称之外没有任何约束，调用该方法，然后expect确切的方法调用。例如:allow(a).toreceive(:f)a.f(2)a.f(1)

  8. ruby - 为什么不能使用类IO的实例方法noecho？ - 2

    print"Enteryourpassword:"pass=STDIN.noecho(&:gets)puts"Yourpasswordis#{pass}!"输出:Enteryourpassword:input.rb:2:in`':undefinedmethod`noecho'for#>(NoMethodError) 最佳答案 一开始require'io/console'后来的Ruby1.9.3 关于ruby-为什么不能使用类IO的实例方法noecho？，我们在StackOverflow上

  9. ruby-on-rails - 如何用不同的用户运行nginx主进程 - 2

    A/ctohttp://wiki.nginx.org/CoreModule#usermaster进程曾经以root用户运行，是否可以以不同的用户运行nginxmaster进程？ 最佳答案 只需以非root身份运行init脚本(即/etc/init.d/nginxstart)，就可以用不同的用户运行nginxmaster进程。如果这真的是你想要做的，你将需要确保日志和pid目录(通常是/var/log/nginx&/var/run/nginx.pid)对该用户是可写的，并且您所有的listen调用都是针对大于1024的端口(因为绑定(

  10. ruby - 从 sinatra 中的 before do block 返回不同的值 - 2

    有没有办法在sinatra的beforedoblock中停止执行并返回不同的值？beforedo#codeishere#Iwouldliketo'return"Message"'#Iwouldlike"/home"tonotgetcalled.end//restofthecodeget'/home'doend 最佳答案 beforedohalt401,{'Content-Type'=>'text/plain'},'Message!'end如果你愿意，你可以只指定状态，这里有状态、标题和正文的例子

随机推荐