什么是Xcode 8中的“特征变化”？ [英] What is 'Vary for Traits' in Xcode 8?

问题描述

我正在使用AutoLayout和Size类，但随着iOS 10和新Xcode 8.0的发布，有一个新选项 Vary for Traits 。这是替换尺寸Classe的不同宽度和高度的设备。

通过选择 width 复选框，它会显示不同的14个紧凑宽度设备。

选择 height 复选框，显示不同的18个紧凑高度设备。

通过选中这两个复选框，它会显示变化的11个紧凑宽度常规高度设备。

如何使用此选项？
我们可以像Xcode7.0一样使用大小类的AutoLayout吗？
如果任何人有深入的知识，那么请解释一下。

解决方案

这只是如何扩展在项目中快速使用Vary Traits为iPad和iPhone添加不同的布局。

请阅读本文以了解有关Size类的更多信息。

如果您正在跳过下面的示例，请阅读最后的摘要。

---

• 目标：

你需要一个iPhone宽度不同的按钮和iPad。前者宽度为80，后者宽度为300.

• 方法1：

对于安装了多个约束的特征不一致。

• 步骤

  
  
  1. 首先添加常见约束，例如水平和垂直居中按钮。
  
  

2. 选择VaryForTraits和iPhone屏幕按照尺寸等级指南，C * R尺寸等级适合模型，我们检查宽度和宽度的刻度线。 PopUp中的高度。点击屏幕上的任意位置即可关闭弹出窗口。

< a href =https://i.stack.imgur.com/Vyd1V.png =noreferrer>

3. 添加宽度常量并检查是否为C添加了约束* R尺寸级。添加约束后，选择Done Varying按钮。

4. 对于iPad屏幕，再次选择任何iPad设备并选择VaryForTraits，这次点击高度宽度时，它应显示R * R变化。

5. 再次添加宽度约束，最后添加的iPhone WIDT h限制必须在屏幕截图中不突出显示。此次添加的值将是大小等级R * R.

6. 切换回iPhone布局，需要宽度为80，iPad为300.

结论：

请注意，总共添加了两个约束，并且在两个约束中，值根据所选的大小等级而有所不同。

---

• 方法2：

对于具有单一约束的特征，安装了多个尺寸级别不一致

• 步骤：
  
  
  
  
  1. 添加正常的宽度约束。然后选择该约束并选择常量值旁边的+按钮。
  
  

< a href =https://i.stack.imgur.com/688N0.png =noreferrer>

2. 添加特征变异，对于iPhone，我们选择C * R和将常数值设置为100.

3. 对于跟随R * R的特征变化的iPad，我们再添加另一个变体再次单击+按钮并将值设置为300.

4. 选择一个iPad，宽度将自动取为300并返回iPhone需要100值。

结论：

这似乎是一个更好的选择，而不是在仅需要单个约束且常数值不同时添加两个约束。

什么时候使用，使用什么：

两种方法基本上都是这样做的同样的事情，将值设置为Size-classes。

但是，当您想要专门为设备添加约束时使用＃Method1 说大小等级。例如，在iPhone中按钮应该来自前50个点，而在iPad中它应该水平和垂直居中。在这种情况下，您需要使用VaryForTraits，因为它会为特定大小的类添加约束。

＃Method2 在您使用时想要相同约束类型的不同常量值。

PS：所有那些无法获得工作示例的人

请确保您只添加所需的约束作为已安装。针对Installed的复选框应仅针对大小类所需的约束显示。这是关键！

只需添加一个顶级约束&在视图中导致uiButton。选择顶部约束并使用加号取消选中基本已安装选项。现在，通过单击加号，将变体添加到C R并检查该选项。现在，使用各种方向组合将设备从iPhone更改为iPad。此约束仅适用于纵向为iPhone的C R size类。如果选中了基本已安装的复选框（带有加号的符号），则表示该约束应适用于所有大小类。

摘要：

Trait Variation是对基于设备配置的用户界面显示的更改。 Trait Variations用户界面不仅限于约束，还可以应用于更多。例如，当设备设置为暗色时，更改背景颜色和其他元素。变体可以应用于用户界面的元素，例如移除约束，或视图类或约束的属性，例如标签的字体。您可以更改：

• 视图的大小或位置




• 安装视图




• 安装约束




• 约束常量




• 字体




• 字体，色调或背景的颜色




• 布局边距




• 图像文件

您可以改变的特定属性集取决于元素的类。在这个例子中，我们已经演示了如何使用 - 安装约束& - 约束常数。其他，非常简单，可以很容易地推断出来。

I am using AutoLayout and Size classes, but with release of iOS 10 and new Xcode 8.0, there is one new option Vary for Traits. Is this replacement of Size Classe for different width and height of devices.

By selection of width checkbox, it displays varying 14 compact width devices.

By selection of height checkbox, it displays varying 18 compact height devices.

By selection of both checkbox, it displays varying 11 compact width regular height devices.

How to make use of this options ? Can we use AutoLayout with size classes as like Xcode7.0 ? If any one has in depth knowledge then please explain it.

解决方案

This is just an extension as to how to use "Vary Traits" quickly in your project for adding different layouts for iPad and iPhones.

Please read this for understanding more on the Size classes.

https://developer.apple.com/reference/uikit/uitraitcollection

If you are skipping the example which follows below, do read the Summary in the end.

---

• OBJECTIVE :

You need a button having different widths in iPhone and iPad. The former having width of 80 and latter having a width of 300.

• METHOD 1 :

Vary for Traits with Multiple Constraints as installed.

• STEPS :

  1. Add the common constraints first like Center the button horizontally and vertically.

2. Choose VaryForTraits and for iPhone screens as per the size class guidelines , a C*R size class fits the model and this we check the tickmarks of Width & Height in PopUp. Dismiss the pop-up by clicking anywhere on screen.

3. Add the width constant and check whether the constraint is added for C*R size-class. After adding constraints, choose Done Varying button.

4. For iPad screens, again select any iPad device and choose VaryForTraits and this time on clicking height-width, it should show R*R variation.

5. Again add a width constraint, the last added iPhone width constraint must be unhighlighted as in the screenshot. The value added will be for the size-class R*R this time.

6. Switch back to iPhone layout and it takes 80 as width and iPad will take 300.

CONCLUSION :

Please notice that there are total of two constraints added and in both the constraints, the values differ according to the size-class chosen.

---

• METHOD 2 :

Vary for Traits with Single Constraint , Multiple Size-Class installed

• STEPS :
  1. Add the normal width constraint. Then select that constraint and choose the + button besides the Constant value.

2. Add trait variation, and for iPhone we choose C*R and set the constant value as 100.

3. Again for iPad which follows a trait variation as R*R, we add another variation by clicking again on + button and set the value as 300.

4. Select an iPad and the width will be automatically taken as 300 and coming back to iPhone it takes 100 as value.

CONCLUSION :

This seems to be a better option rather than adding two constraints when a single constraint is only required and the constant value differs.

WHEN TO USE, WHAT TO USE :

Both the approaches are basically doing the same thing, setting values to Size-classes.

But, #Method1 is used when you want to add a constraint specifically for a device or say size-class. For example, in iPhone the button should be from Top 50 pts and in iPad it should be centered horizontally and vertically. In such situations, you need to use VaryForTraits as it opens doors to add constraints for a specific size class.

#Method2 is used when you want different constant values for a same constraint type.

P.S : TO ALL THOSE WHO ARE NOT ABLE TO GET THE EXAMPLE WORKING

Please make sure, you are adding only the required constraints as Installed. The checkbox against Installed should only appear for the constraint that you need for a size class. That is the key!

Just add a top constraint & a leading to an uiButton in a view. Select the top constraint and uncheck the basic Installed option with Plus sign. Now, by clicking on the Plus sign, add variation to CR and check that option. Now, change the device from iPhone to iPad with various orientation combinations. This constraint will be applied only for CR size class which is iPhone in portrait orientation. If the checkbox against the basic Installed (the one with Plus symbol) was checked that means the constraint should be applied to all size classes.

SUMMARY :

Trait Variation is a change to the presentation of your user interface that is based on a device configuration. Trait Variations of the user interface is not just limited to constraints but can be applied to much more. Such as changing the color of the background and other elements when the device is set to a dark style. A variation can apply to an element of the user interface, such removing a constraint, or to a property of a view class or constraint, such as the font for a label. You can vary:

• Size or position of a view

• Installation of a view

• Installation of a constraint

• Constraint constant

• Font

• Color for the font, tint, or background

• Layout margins

• Image file

The specific set of properties you can vary depends on the class of the element. In the example, we have demonstrated the use of- Installation of a constraint & - Constraint constant . Others, are quite simple and can be easily inferred.

这篇关于什么是Xcode 8中的“特征变化”？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！