Xcode 8 中的 'Vary for Traits' 是什么?
What is 'Vary for Traits' in Xcode 8?
我正在使用 AutoLayout 和 Size 类,但是随着 iOS 10 和新 Xcode 8.0 的发布,有一个新选项 Vary for Traits
。这是针对不同宽度和高度的设备替换Size Classe。
通过选择 width
复选框,显示 varying 14 compact width devices
。
通过选择 height
复选框,显示 varying 18 compact height devices
。
通过选择两个复选框,它显示 varying 11 compact width regular height devices
。
如何使用这个选项?
我们可以像 Xcode7.0 那样使用大小为 类 的 AutoLayout 吗?
如果哪位有深入的了解,请解释一下。
它只不过是 size classes
它本身,但具有不同的表示形式。直到 xcode 7
我们使用大小 类 并且我们以 regular,compact and any
的方式考虑 height-width
,在 vary for traits
中概念相同但 xcode 具体解释 exact device
.在旧版本中,我们知道 for every iphone in portraint
等信息,在这里我们可以知道确切的设备!
查看下面的屏幕截图,
您应该参考 wwdc2016 - video 了解更多信息!
参考:This So Post
这只是关于如何在项目中快速使用 "Vary Traits" 为 iPad 和 iPhone 添加不同布局的扩展。
请阅读此内容以了解有关大小 class 的更多信息。
https://developer.apple.com/reference/uikit/uitraitcollection
如果您要跳过下面的示例,请务必阅读最后的摘要。
- OBJECTIVE :
您需要在 iPhone 和 iPad 中具有不同宽度的按钮。前者宽度为 80,后者宽度为 300。
- 方法一:
因安装的具有多个约束的特征而异。
步骤:
- 首先添加常用约束,例如将按钮水平和垂直居中。
- 选择 VaryForTraits,对于 iPhone 屏幕,根据尺寸 class 指南,C*R 尺寸 class 适合模型,我们检查宽度和高度的标记弹出。单击屏幕上的任意位置关闭弹出窗口。
- 添加宽度常量,检查C*R size-class是否添加约束。添加约束后,选择 Done Varying 按钮。
- 对于 iPad 屏幕,再次 select 任何 iPad 设备并选择 VaryForTraits,这次点击高度-宽度,它应该显示 R*R 变化。
- 再次添加宽度约束,最后添加的 iPhone 宽度约束必须取消突出显示,如屏幕截图所示。这次加的值就是size-classR*R.
- 切换回iPhone布局,宽度为80,iPad宽度为300。
结论:
请注意,总共添加了两个约束,并且在两个约束中,值根据选择的大小而有所不同-class。
- 方法二:
因具有单一约束的特征而异,安装了多个尺寸-Class
- 步骤:
- 添加正常宽度约束。然后 select 该约束并选择常量值旁边的 + 按钮。
- 添加性状变异,iPhone我们选择C*R,常数值设为100。
- 同样,对于 iPad,它遵循作为 R*R 的特征变异,我们通过再次单击 + 按钮添加另一个变异并将值设置为 300。
- Select 和 iPad 并且宽度将自动取为 300 并返回到 iPhone 它取 100 作为值。
结论:
当只需要一个约束且常量值不同时,这似乎是一个更好的选择,而不是添加两个约束。
何时使用,使用什么:
这两种方法基本上都在做同样的事情,将值设置为 Size-classes。
但是,#Method1 用于专门为设备添加约束或说大小-class。例如,在 iPhone 中,按钮应来自前 50 个点,而在 iPad 中,按钮应水平和垂直居中。在这种情况下,您需要使用 VaryForTraits,因为它打开了为特定大小添加约束的大门 class.
#Method2 用于相同约束类型的不同常量值。
P.S:致所有无法使示例正常工作的人
请确保您只添加了已安装的必需约束。 Installed 的复选框应该只针对大小 class 所需的约束出现。这就是关键!
只需在视图中添加顶部约束和指向 uiButton 的前导。 Select 顶部约束并取消选中带加号的基本已安装选项。现在,通过单击加号,将变体添加到 CR 并选中该选项。现在,将设备从 iPhone 更改为具有各种方向组合的 iPad。此约束仅适用于 CR 尺寸 class,即纵向 iPhone。如果针对基本已安装的复选框(带有加号的那个)被选中,则意味着约束应应用于所有大小 classes.
摘要:
Trait Variation 是基于设备配置对用户界面呈现的更改。用户界面的 Trait Variations 不仅限于约束,还可以适用于更多。例如在设备设置为深色风格时更改背景和其他元素的颜色。变体可以应用于用户界面的元素,例如删除约束,或应用于视图 class 或约束的 属性,例如标签的字体。你可以改变:
视图的大小或位置
安装视图
安装约束
约束常量
字体
字体、色调或背景的颜色
布局边距
图像文件
您可以更改的特定属性集取决于元素的 class。在示例中,我们演示了使用 - 安装约束和 - 约束常量。其他的,很简单,可以很容易地推断出来。
Vary for traits 是大小 类 选项的演变,该选项存在于过去版本的 Xcode 中。它允许根据特征进行更巧妙和精确的变化。当然,它不仅限于 iPad/iPhone 变体,您还可以根据方向和不同设备指定变体。
本帖中的其他回答有一些不足和不准确的地方,也许最有效的回答方式就是举个例子。为了清楚起见,我们将我们的示例限制为只有一个按钮和两个布局。但是,如下所述,您可以根据需要扩展以下示例。我们的目标是调整按钮在两种不同布局之间的位置:所有设备上的横向和纵向。
注意:如果不启用“vary for traits”选项,所有布局和ui界面调整均指所有特征(即所有尺寸类)。
让我们从在故事板上放置一个按钮开始。由于未启用“因特征而异”,因此该按钮将出现在所有不同的布局中。相反,如果我们启用了 vary for traits,按钮将只被引用到特定的特征 selected.
现在,让我们启用“因特征而异”并根据身高选择一个变体。您应该看到底部屏幕将变为蓝色,并且根据 selection,您将看到所有受影响的设备。到目前为止,一切都很好。
Select 再次单击按钮并照常添加约束条件。在我们的示例中,我们将添加顶部和左侧前导 space 以及宽度和高度。之后,单击“完成变化”。您会看到屏幕底部再次变灰。发生的事情是我们已经告诉接口 Builder 只为 (w:C h:R) 类 添加上述约束。
现在 select 屏幕底部的横向模式。您会看到 Button 是红色的,因为它缺少您仅为某些特征添加的约束。 Select 再次因特征而异,select 再次因身高变化而异。添加以下约束:
然后按完成变化。现在,无论是横向还是纵向,该按钮在屏幕上都能很好地识别。
Build 和 运行。您会看到按钮会根据屏幕的方向而变化。
您可以按照此模式创建更高级的布局。例如,您可以 select 在开始时改变特征并仅针对特定特征丢弃 UIKit 对象。该对象将仅出现在指定的变体中,并且在其他变体中将变灰,允许您根据特征创建完全不同的用户界面。
我正在使用 AutoLayout 和 Size 类,但是随着 iOS 10 和新 Xcode 8.0 的发布,有一个新选项 Vary for Traits
。这是针对不同宽度和高度的设备替换Size Classe。
通过选择 width
复选框,显示 varying 14 compact width devices
。
通过选择 height
复选框,显示 varying 18 compact height devices
。
通过选择两个复选框,它显示 varying 11 compact width regular height devices
。
如何使用这个选项? 我们可以像 Xcode7.0 那样使用大小为 类 的 AutoLayout 吗? 如果哪位有深入的了解,请解释一下。
它只不过是 size classes
它本身,但具有不同的表示形式。直到 xcode 7
我们使用大小 类 并且我们以 regular,compact and any
的方式考虑 height-width
,在 vary for traits
中概念相同但 xcode 具体解释 exact device
.在旧版本中,我们知道 for every iphone in portraint
等信息,在这里我们可以知道确切的设备!
查看下面的屏幕截图,
您应该参考 wwdc2016 - video 了解更多信息!
参考:This So Post
这只是关于如何在项目中快速使用 "Vary Traits" 为 iPad 和 iPhone 添加不同布局的扩展。
请阅读此内容以了解有关大小 class 的更多信息。
https://developer.apple.com/reference/uikit/uitraitcollection
如果您要跳过下面的示例,请务必阅读最后的摘要。
- OBJECTIVE :
您需要在 iPhone 和 iPad 中具有不同宽度的按钮。前者宽度为 80,后者宽度为 300。
- 方法一:
因安装的具有多个约束的特征而异。
步骤:
- 首先添加常用约束,例如将按钮水平和垂直居中。
- 选择 VaryForTraits,对于 iPhone 屏幕,根据尺寸 class 指南,C*R 尺寸 class 适合模型,我们检查宽度和高度的标记弹出。单击屏幕上的任意位置关闭弹出窗口。
- 添加宽度常量,检查C*R size-class是否添加约束。添加约束后,选择 Done Varying 按钮。
- 对于 iPad 屏幕,再次 select 任何 iPad 设备并选择 VaryForTraits,这次点击高度-宽度,它应该显示 R*R 变化。
- 再次添加宽度约束,最后添加的 iPhone 宽度约束必须取消突出显示,如屏幕截图所示。这次加的值就是size-classR*R.
- 切换回iPhone布局,宽度为80,iPad宽度为300。
结论:
请注意,总共添加了两个约束,并且在两个约束中,值根据选择的大小而有所不同-class。
- 方法二:
因具有单一约束的特征而异,安装了多个尺寸-Class
- 步骤:
- 添加正常宽度约束。然后 select 该约束并选择常量值旁边的 + 按钮。
- 添加性状变异,iPhone我们选择C*R,常数值设为100。
- 同样,对于 iPad,它遵循作为 R*R 的特征变异,我们通过再次单击 + 按钮添加另一个变异并将值设置为 300。
- Select 和 iPad 并且宽度将自动取为 300 并返回到 iPhone 它取 100 作为值。
结论:
当只需要一个约束且常量值不同时,这似乎是一个更好的选择,而不是添加两个约束。
何时使用,使用什么:
这两种方法基本上都在做同样的事情,将值设置为 Size-classes。
但是,#Method1 用于专门为设备添加约束或说大小-class。例如,在 iPhone 中,按钮应来自前 50 个点,而在 iPad 中,按钮应水平和垂直居中。在这种情况下,您需要使用 VaryForTraits,因为它打开了为特定大小添加约束的大门 class.
#Method2 用于相同约束类型的不同常量值。
P.S:致所有无法使示例正常工作的人
请确保您只添加了已安装的必需约束。 Installed 的复选框应该只针对大小 class 所需的约束出现。这就是关键!
只需在视图中添加顶部约束和指向 uiButton 的前导。 Select 顶部约束并取消选中带加号的基本已安装选项。现在,通过单击加号,将变体添加到 CR 并选中该选项。现在,将设备从 iPhone 更改为具有各种方向组合的 iPad。此约束仅适用于 CR 尺寸 class,即纵向 iPhone。如果针对基本已安装的复选框(带有加号的那个)被选中,则意味着约束应应用于所有大小 classes.
摘要:
Trait Variation 是基于设备配置对用户界面呈现的更改。用户界面的 Trait Variations 不仅限于约束,还可以适用于更多。例如在设备设置为深色风格时更改背景和其他元素的颜色。变体可以应用于用户界面的元素,例如删除约束,或应用于视图 class 或约束的 属性,例如标签的字体。你可以改变:
视图的大小或位置
安装视图
安装约束
约束常量
字体
字体、色调或背景的颜色
布局边距
图像文件
您可以更改的特定属性集取决于元素的 class。在示例中,我们演示了使用 - 安装约束和 - 约束常量。其他的,很简单,可以很容易地推断出来。
Vary for traits 是大小 类 选项的演变,该选项存在于过去版本的 Xcode 中。它允许根据特征进行更巧妙和精确的变化。当然,它不仅限于 iPad/iPhone 变体,您还可以根据方向和不同设备指定变体。
本帖中的其他回答有一些不足和不准确的地方,也许最有效的回答方式就是举个例子。为了清楚起见,我们将我们的示例限制为只有一个按钮和两个布局。但是,如下所述,您可以根据需要扩展以下示例。我们的目标是调整按钮在两种不同布局之间的位置:所有设备上的横向和纵向。
注意:如果不启用“vary for traits”选项,所有布局和ui界面调整均指所有特征(即所有尺寸类)。
让我们从在故事板上放置一个按钮开始。由于未启用“因特征而异”,因此该按钮将出现在所有不同的布局中。相反,如果我们启用了 vary for traits,按钮将只被引用到特定的特征 selected.
现在,让我们启用“因特征而异”并根据身高选择一个变体。您应该看到底部屏幕将变为蓝色,并且根据 selection,您将看到所有受影响的设备。到目前为止,一切都很好。
Select 再次单击按钮并照常添加约束条件。在我们的示例中,我们将添加顶部和左侧前导 space 以及宽度和高度。之后,单击“完成变化”。您会看到屏幕底部再次变灰。发生的事情是我们已经告诉接口 Builder 只为 (w:C h:R) 类 添加上述约束。
现在 select 屏幕底部的横向模式。您会看到 Button 是红色的,因为它缺少您仅为某些特征添加的约束。 Select 再次因特征而异,select 再次因身高变化而异。添加以下约束:
然后按完成变化。现在,无论是横向还是纵向,该按钮在屏幕上都能很好地识别。
Build 和 运行。您会看到按钮会根据屏幕的方向而变化。
您可以按照此模式创建更高级的布局。例如,您可以 select 在开始时改变特征并仅针对特定特征丢弃 UIKit 对象。该对象将仅出现在指定的变体中,并且在其他变体中将变灰,允许您根据特征创建完全不同的用户界面。