新版UGUI组建手册.doc

-独立-unity3dRect Transform以方波变换以方波转换组件的2 d对应转换组件用于3 d图形。它用于指定大小,位置和旋转控制UI系统Properties 属性Property: 属性Function: 功能 函数 作用 Pos (X, Y and Z) 分(X、Y和Z)Position of the rectangles pivot point relative to the anchors.矩形的支点的位置相对于锚。Width/Height n. 宽/高Width and height of the rectangle. 矩形的宽度和高度。Left, Top, Right, Bottom左,右,底部Positions of the rectangles edges relative to their anchors. This can be thought of as padding inside the rectangle defined by the anchors. Shown in place of Pos and Width/Height when the anchors are separated (see below). 矩形的边的位置相对于他们的锚。这可以被认为是填充矩形内定义的锚。Pos和宽度/高度的地方所示当主播分离(见下文)。Anchors Min锚最小The anchor point for the lower left corner of the rectangle defined as a fraction of the size of the parent rectangle. 0,0 corresponds to anchoring to the lower left corner of the parent, while 1,1 corresponds to anchoring to the upper right corner of the parent. 的锚点左下角的矩形定义为父矩形的大小的一小部分。0,0对应于锚定母公司的左下角,而1,1对应于锚定的右上角的父母。Anchors Max锚马克斯The anchor point for the upper right corner of the rectangle defined as a fraction of the size of the parent rectangle. 0,0 corresponds to anchoring to the lower left corner of the parent, while 1,1 corresponds to anchoring to the upper right corner of the parent. 的锚点右上角的矩形定义为父矩形的大小的一小部分。0,0对应于锚定母公司的左下角,而1,1对应于锚定的右上角的父母Pivot支点 枢轴 枢轴量 Location of the pivot point around which the rectangle rotates, defined as a fraction of the size of the rectangle itself. 0,0 corresponds to the lower left corner while 1,1 corresponds to the upper right corner. 矩形旋转轴心点的位置,定义为矩形的大小本身的一小部分。0,0对应于1时,左下角1对应于右上角。Rotation旋转 自转 轮换 Angle of rotation (in degrees) of the object around its pivot point along the X, Y and Z axis. 旋转角度(度)的对象在其轴心点沿着X,Y和Z轴。Scale音阶 规模 比例 Scale factor applied to the object in the X, Y and Z dimensions. 比例因子应用于对象的X,Y和Z维度。描述扩展和调整用于布局一般建议您调整UI元素,而不是规模。这个调整不会影响字体大小,边界切片图像,等等。扩展可以用于动画效果或其他特殊效果,当你想要整个元素比例,包括字体和边框。记住,UI元素成为无形的如果你给他们一个消极的大小。消极的扩展支持虽然(就像其他游戏对象),这可以用于e。g翻转对象。Canvas Components画布上的组件All UI Components are placed within a Canvas. 所有UI组件被放置在一个画布 Canvas CanvasGroup CanvasRenderer Reference Resolution Physical ResolutionCanvas帆布 画布 马尾衬The Canvas is the area for all UI elements to be inside. The Canvas is a Game Object with a Canvas component on it, and all UI elements must be children of such a Canvas.When you create a new UI element, such as an Image using the menu GameObject UI Image, a Canvas is automatically created too, if there isnt already a Canvas in the scene. The UI element is created as a child to this Canvas.The Canvas area is shown as a rectangle in the Scene View. This makes it easy to position UI elements without needing to have the Game View visible at all times.The Canvas has a Render Mode setting which can be used to make it render in screen space or world space.画布是所有UI元素的区域内。画布是一个游戏对象与一个画布组件,和所有UI元素必须孩子这样的画布。当您创建一个新的UI元素,如图像UI使用菜单GameObject 的形象,也会自动创建一个画布,如果没有已经在现场一个画布。创建的UI元素是作为一个孩子,这个画布。画布区域显示为一个矩形在场景视图中。这使它容易UI元素,而不需要有游戏视图可见。画布上呈现模式设置,可以用来使它呈现在屏幕空间或世界空间。Screen Space - Overlay屏幕空间,覆盖This render mode places UI elements on the screen rendered on top of the scene. If the screen is resized or changes resolution, the Canvas will automatically change size to match as well. 这种渲染模式UI元素的地方在屏幕上呈现的场景。如果屏幕大小或更改分辨率,画布会自动改变大小匹配UI in screen space overlay canvas用户界面在屏幕空间叠加画布Screen Space - Camera屏幕空间摄像头This is similar to Screen Space - Overlay, but in this render mode, the Canvas is placed a given distance in front of a specified Camera. The UI elements are rendered by this camera, which means that the Camera settings affect the appearance of the UI. If the Camera is set to Perspective, the UI elements will be rendered with perspective, and the amount of perspective distortion can be controlled by the Camera Field of View. If the screen is resized or changes resolution, or the camera frustrum changes, the Canvas will automatically change size to match as well. 这类似于屏幕空间覆盖,但在这个渲染模式下,前面的画布上放置一个给定距离指定的相机。UI元素呈现了这款相机,这意味着相机设置影响UI的外观。如果相机设置为视角,UI元素将会呈现的角度,透视失真的数量可以控制相机的视野。如果屏幕大小或更改分辨率,或者相机frustrum变化,画布会自动改变大小匹配。UI in screen space camera canvas用户界面在屏幕空间相机画布World Space自然空间This render mode makes the Canvas behave as any other object in the scene. The size of the Canvas can be set manually using its Rect Transform, and UI elements will render in front of or behind other objects in the scene based on 3D placement. This is useful for UIs that are meant to be a part of the world, also sometimes referred to as diegetic interfaces. 这种呈现方式使得画布像场景中的任何其他对象。画布的大小可以设置手动使用其矩形转换和UI元素将呈现在场景中其他物体的前面还是后面基于3 d位置。这是用于ui,是世界的一部分,有时也被称为根据叙事空间接口。UI in world space canvas UI在世界空间画布Basic Layout基本布置图In this section well look at how you can position UI elements relative to the Canvas and each other. If you want to test yourself while reading, you can create an Image using the menu GameObject UI Image. 在本节中,我们将看看如何位置UI元素相对于画布和对方。如果你想要测试自己在阅读时,你可以使用菜单创建一个图像GameObject UI 形象The Rect Tool的矩形工具Every UI element is represented as a rectangle for layout purposes. This rectangle can be manipulated in the Scene View using the Rect Tool in the toolbar. The Rect Tool is used both for Unitys 2D features and for UI, and in fact can be used even for 3D objects as well. 每个UI元素表示为一个矩形布局的目的。这个矩形可以操纵在场景视图中使用矩形工具栏中的工具。使用矩形工具为统一的二维特性和UI,甚至实际上可以使用3 d对象。Toolbar buttons with Rect Tool selected工具栏按钮的矩形选择工具The Rect Tool can be used to move UI element around, resize them, and rotate them, all in one. Once you have selected a UI element, you can move it by clicking anywhere inside the rectangle and dragging. You can resize it by clicking on the edges or corners and dragging. The element can be rotated by hovering the cursor slightly away from the corners until the mouse cursor indicates a rotation symbol. You can then click and drag in either direction to rotate.Just like the other tools, the Rect Tool uses the current pivot mode and space, set in the toolbar. When working with UI its usually a good idea to keep those set to Pivot and Local. 的矩形工具可以用来移动UI元素,调整它们,并旋转,尽在其中。一旦你选择的UI元素,您可以将它通过点击矩形内的任何地方和拖动。你可以通过点击调整边缘或角落和拖动。元素可以旋转光标稍微远离角落徘徊,直到鼠标光标显示旋转的象征。然后您可以单击并拖动两个方向旋转。就像其他工具,矩形工具使用当前的主模式和空间,在工具栏设置。在处理UI通常是一个好主意保持这些枢轴和地方。Toolbar buttons set to Pivot and Local工具栏按钮设置为枢轴和地方Rect Transform以方波变换The Rect Transform is a new transform component that is used for all UI elements instead of the regular Transform component. 以方波变换是一种新的变换组件,用于所有UI元素,而不是定期转换组件Rect Transforms have position, rotation, and scale just like regular Transforms, but it also has a width and height, used to specify the dimensions of the rectangle. 以方波转换位置,旋转,和规模就像定期转换,但它也有一个宽度和高度,用于指定矩形的尺寸。Resizing Versus Scaling调整与扩展When the Rect Tool is used to change the size of an object, normally for Sprites in the 2D system and for 3D objects it will change the local scale of the object. However, when its used on an object with a Rect Transform on it, it will instead change the width and the height, keeping the local scale unchanged. This resizing will not affect font sizes, border on sliced images, and so on. 当矩形工具用于改变对象的大小,通常为精灵2 d系统和3 d对象,它将改变对象的局部范围。然而,当它是使用一个对象有一个矩形变换,它将改变宽度和高度,保持当地的规模不变。这个调整不会影响字体大小,边界切片图像,等等Pivot支点 枢轴 枢轴量 Rotations, size, and scale modifications occur around the pivot so the position of the pivot affects the outcome of a rotation, resizing, or scaling. When the toolbar Pivot button is set to Pivot mode, the pivot of a Rect Transform can be moved in the Scene View. 旋转、大小和规模的修改发生在枢轴所以支点的位置影响旋转的结果,调整,或扩展。当工具栏枢轴按钮设置为枢轴模式,枢轴的矩形变换可以移动在场景视图中。Anchors下锚 两个锚 三个锚 Rect Transforms include a layout concept called anchors. Anchors are shown as four small triangular handles in the Scene View and anchor information is also shown in the Inspector.If the parent of a Rect Transform is also a Rect Transform, the child Rect Transform can be anchored to the parent Rect Transform in various ways. For example, the child can be anchored to the center of the parent, or to one of the corners. 以方波转换包括布局概念称为锚。锚点显示为四个小三角形在场景视图和锚信息处理也是检查员所示。如果父的矩形转换也是一个矩形转换,孩子矩形变换可以被锚定到父矩形改变以不同的方式。例如,孩子可以被锚定中心的家长,或的一个角落。UI element anchored to the center of the parent. The element UI元素固定在中心的家长。的元素maintains a fixed offset to the center. 保持一个固定的中心偏移。 UI element anchored to the lower right corner of the parent. The element maintains a fixed offset to the lower right corner. The anchoring also allows the child to stretch together with the width or height of the parent. Each corner of the rectangle has a fixed offset to its corresponding anchor, i.e. the top left corner of the rectangle has a fixed offset to the top left anchor, etc. This way the different corners of the rectangle can be anchored to different points in the parent rectangle. 元素固定在右下角的父母。元素保持一个固定的偏移到右下角。锚定还允许孩子伸展与母公司的宽度或高度。每个矩形的角落都有一个固定的抵消其相应的锚,即矩形的左上角有一个固定的抵消左上角锚,等。这种方式的不同角落矩形可以固定在不同的点在父长方形。UI element with left corners anchored to lower left corner of the parent UI元素左角固定在左下角的父母 and right corners anchored to lower right. The corners of the element maintains fixed offsets to their respective anchors. The positions of the anchors are defined in fractions (or percentages) of the parent rectangle width and height. 0.0 (0%) corresponds to the left or bottom side, 0.5 (50%) to the middle, and 1.0 (100%) to the right or top side. But anchors are not limited to the sides and middle; they can be anchored to any point within the parect rectangle. 和右角落固定在右下角。元素的角落保持各自锚固定的偏移量。锚的位置中定义分数(或百分比)父矩形的宽度和高度。左边或底部对应0.0(0%),0.5(50%),中间,和1.0(100%)向右或板面。但锚不限于两边和中间;他们可以被锚定parect矩形内任意点。UI element with left corners anchored to a point a certain percentage UI元素左角落与一点一一定比例from the left side of the parent and right corners anchored to a point a certain percentage from the right side of the parent rectangle. You can drag each of the anchors individually, or if they are together, you can drag them together by clicking in the middle in between them and dragging. If you hold down Shift key while dragging an anchor, the corresponding corner of the rectangle will move together with the anchor.A useful feature of the anchor handles is that they automatically snap to the anchors of sibling rectangles to allow for precise positioning. 从父母和正确的左边角落锚定一定比例从一点一的右侧父矩形。你可以拖动每个单独的锚,或如果他们在一起,你可以把它们拖在一起通过点击在他们之间和拖动。如果你拖动锚时按住Shift键,相应的矩形的角落将锚。锚处理的一个有用的特性是,他们自动对齐到兄弟姐妹矩形的锚允许精确定位。Anchor presets锚点预设 In the Inspector, the Anchor Preset button can be found in the upper left corner of the Rect Transform component. Clicking the button brings up the Anchor Presets dropdown. From here you can quickly select from some of the most common anchoring options. You can anchor the UI element to the sides or middle of the parent, or stretch together with the parent size. The horizontal and vertical anchoring is independent. 检查员,锚预设按钮可以显示在左上角的矩形变换组件。单击按钮将显示锚预设下拉。从这里您可以快速选择一些最常见的锚定选项。可以锚UI元素双方或父,或伸展与父母一起大小。水平和垂直锚定是独立的。The Anchor Presets buttons displays the currently selected preset option if there is one. If the anchors on either the horizontal or vertical axis are set to different positions than any of the presets, the custom options is shown. 锚预设按钮显示当前选择的如果有一个预设选项。如果锚在水平或垂直轴将比任何预设的不同位置,显示自定义选项。Anchor and position fields in the Inspector巡查员锚和位置字段You can click the Anchors expansion arrow to reveal the anchor number fields if they are not already visible. Anchor Min corresponds to the lower left anchor handle in the Scene View, and Anchor Max corresponds to the upper right handle.The position fields of rectangle are shown differently depending on whether the anchors are together (which produces a fixed width and height) or separated (which causes the rectangle to stretch together with the parent rectangle). 您可以单击箭头显示锚锚扩张数量字段如果他们不是已经可见。锚最小值对应于左下角锚柄在场景视图中,并锚定马克斯右上角对应处理。矩形的位置字段显示不同取决于锚在一起(产生一个固定宽度和高度)或分离(使矩形拉伸与父矩形)。When all the anchor handles are together the fields displayed are Pos X, Pos Y, Width and Height. The Pos X and Pos Y values indicate the position of the pivot relative to the anchors. 当所有的锚处理在一起显示的字段是Pos X,Y Pos,宽度和高度。Pos X和Pos Y值表明支点的位置相对于锚。When the anchors are separated the fields can change partially or completely to Left, Right, Top and Bottom. These fields define the padding inside the rectangle defined by the anchors. The Left and Right fields are used if the anchors are separated horizontally and the Top and Bottom fields are used if they are separated vertically.Note that changing the values in the anchor or pivot fields will normally counter-adjust the positioning values in order to make the rectangle stay in place. If cases where this is not desired, the Raw Mode can be enabled using a small button in the Inspector. This causes the anchor and pivot value to be able to be changed without any other values changing as a result. This will likely cause the rectangle to be visually moved or resized, since its position and size is dependent on the anchor and pivot values. 当主持人把字段可以更改部分或完全离开,顶部和底部。这些字段定义内的填充矩形定义的锚。左边和右边字段如果锚分开使用水平和顶部和底部字段如果他们使用的垂直距离。注意改变锚或枢轴字段中的值通常counter-adjust定位值为了使矩形呆在的地方。如果这不是理想的情况下,原始模式可以使用一个小按钮启用检查员。这导致锚和枢轴值可以改变没有任何其他值变化的结果。这可能会导致视觉上的矩形移动或缩放,因为其位置和大小取决于锚和枢轴值。Suggest a change Visual Components可视化组件There are new components and gameObjects that have been added with UI that allow for ease of creation and GUI specific functionality. This section will cover the basics of the new gameObjects that can be created. 有新的组件和gameObjects添加界面,允许轻松地创建和GUI的特定功能。本节将介绍基本的可以创建新的gameObjects。TextThe Text component, which is also known as a Label, has a Text area for entering the text that will be displayed. It is possible to set the font, font style, font size and whether or not the text has rich text capability.There are options to set the alignment of the text and its Wrap mode. The Wrap mode specifies what will happen if the text is too large to fit the label. The Wrap option means the text will wrap onto the next line if there is room otherwise any overlapping text will be cleared. The ResizeBounds option makes the label fit the text size automatically and dynamically. Finally the ShrinkText option shrinks the text to fit the label down to a certain size then it behaves like wrap.Text effects are currently limited but include Shadow which creates a shadow of a specified colour around the text, a direction/distance can also be defined. The other option is Outline which creates an equal outline around the text where the distance and colour can be changed. 文本组件,也被称为一个标签,一个文本区域输入的文本将显示出来。可以设置字体、字体样式、字体大小和是否具有丰富的文本功能的文本。有选项可以设置文本的对齐和它的包装模式。包装方式指定了将会发生什么如果文本太大以适应标签。包装的选择意味着文本将包装到下一行如果有房间否则任何重叠的文本将被清除。ResizeBounds选项使标签符合文本大小自动和动态。最后ShrinkText选项缩小文本以适应标签到一定规模就像包装一样。文本效果目前有限但包括影子,创建一个影子指定颜色的文本,一个方向/距离也可以被定义。另一个选择是cre大纲Image图像 像 形象 A Toggle has a Rect Transform component and an Image component. A sprite can be applied to the Image component under the Target Graphic field, and its colour can be set in the Color field. A material can also be applied to the Image component. The Image Type field defines how the applied sprite will appear, the options are: 切换有矩形转换组件和一个图像组件。雪碧可以应用于图像组件根据目标图形字段,和它的颜色在颜色领域可以设置。材料还可以应用于图像组件。图像类型字段定义了如何应用雪碧将出现的选项是: Simple - Scales the whole sprite equally. 简单整个精灵同样尺度。 Sliced - Utilises the 3x3 sprite division so that resizing does not distort corners. 切片,利用3 x3雪碧部门,以便调整不扭曲角。 Tiled - Repeats the sprite within the gameObject bounds. 瓦-重复gameObject边界内的雪碧。Filled - Shows the sprite in the same way as Simple does except that it fills in the sprite from an origin in a defined direction, method and amount. The option to Set native size resets the image to the original sprite size. 了显示了雪碧一样简单,除了它填写的雪碧起源定义方向,方法和数量。的选项设置本机大小重置图像原始雪碧的大小。Images can be imported as UI sprites by selecting Sprite( 2D / UI) from the Texture Type settings. Sprites have extra import settings compared to the old GUI sprites, the biggest difference is the addition of the sprite editor. The sprite editor provides the option of 9-slicing the image, this splits the image into 9 areas so that if the sprite is resized the corners are not stretched or distorted. 图像可以作为UI进口精灵通过选择雪碧(2 d / UI)的结构类型的设置。精灵有多余的导入设置与旧的GUI精灵相比,最大的区别是雪碧的编辑。雪碧编辑器提供了选择9-slicing图像,将图像分为9个区域,如果雪碧大小角落不拉伸或扭曲。Raw Image原始影像 如原始图像 原始图象 The Image component takes a sprite but Raw Image takes a texture (no borders etc). Raw Image should only be used if necessary otherwise Image will be suitable in the majority of cases. 图像组件需要一个雪碧但原始图像纹理(无边界等)。原始图像在必要时只能使用否则图像将适合在大多数情况下。Mask罩 面具 面膜 A Mask is not a visible UI control but rather a way to modify the appearance of a controls child elements. The mask restricts (ie, “masks”) the child elements to the shape of the parent. So, if the child is larger than the parent then only the part of the child that fits within the parent will be visible. 一个面具不是可见的UI控件,而是一种修改控件的子元素的外观。面具限制(即“面具”)母公司的形状的子元素。所以,如果孩子比父母唯一的孩子适合在父将可见。Effects效果 特效 效果器 TODO describe how effects are used and what they can be applied to. 待办事项描述如何使用效果和他们可以应用于什么。Shadow影子 阴影 影 TODO待办事项 备忘录 土豆太郎 Outline轮廓线 大纲 轮廓 TODO待办事项 备忘录 土豆太郎 Position As UV1 UV1地位TODO待办事项 备忘录 土豆太郎 Suggest a change建议改变Interaction Components交互组件This section covers components in the UI system that handles interaction, such as mouse or touch events and interaction using a keyboard or controller. 本节讨论组件处理交互的UI系统,如使用键盘或鼠标或触摸事件和交互控制器。Selectable Base Class可选择的基类All the interaction components have some things in common. They are all selectables, and that means they all have shared built-in functionality for visualising transitions between states, and for navigation to other selectables using keyboard or controller. This shared functionality is described here.Within a selectable component there are several transition options depending on what state the selectable is currently in. The different states ar