Unity Learning Week 5

Canvas

Canvas (Canvas) is the area that should hold all UI elements, and all UI elements are subclasses of Canvas.

Canvas Group

Canvas Group (Canvas Group) can centrally control certain aspects of the entire set of UI elements. If there are too many canvases, you can manage some properties of the canvas in a unified manner by adding a canvas group.
Alpha
The opacity of UI elements in this group. The value is between 0 and 1, where 0 is completely transparent and 1 is completely opaque.
Interactable
determines whether this component accepts input. When set to false, interaction is disabled.
Whether Block Raycasts
accepts the detection of graphics events, if accepted, the graphics events cannot be changed. Whether the current self-set of
Ignore Parent Groups will be affected by the parent set. Note: Canvas Group needs to be manually searched and added in Add Component.

rendering mode

Screen Space - Overlay

This rendering mode places UI elements on the screen rendered on top of the scene. If the screen is resized or the resolution changes, the canvas will automatically resize to accommodate this.

Pixel PrefabsWhether the UI should be rendered accurately without aliasing.
Sort Orderfor the sort order.

Screen Space - Camera

This rendering mode is similar to Screen Space - Overlay , but in this mode the canvas is placed at a given distance in front of the specified __camera__. UI elements are rendered by this camera, which means that camera settings affect the appearance of the UI. If the camera is set to __orthographic view__, UI elements will be rendered in perspective, and the amount of perspective distortion can be controlled by the camera __field of view__. If the screen is resized, the resolution changes, or the camera frustum changes, the canvas will automatically resize to accommodate.

In this mode there will beRender CameraUI can be rendered to the camera.
World Space

This mode renders the UI as a flat object in the scene. However, unlike Screen Space - Camera mode, the plane does not need to face the camera and can be oriented however you like. The size of the canvas can be set using a rectangle transform, but the size of the canvas on the screen will depend on the camera's perspective and distance. Other scene objects can be behind the canvas, through the canvas, or in front of the canvas.

displayables

text

TextNot interactive per se but can display or illustrate other text.
character

Attributes Function
Font The font used to display text.
Font Style The style to apply to the text. Options include Normal (normal), Bold (bold), Italic (italic), and Bold And Italic (bold and italic)
Font Size display text size
Line Spacing Vertical spacing between lines of text
Rich Text Whether to choose rich text

Paragraph

Attributes Function
Alignment horizontal and vertical alignment of text
Align By Geomery Horizontal alignment is performed using ranges of glyph geometries instead of glyph metrics
Horizontal Overflow Method to handle the case where the text is too wide to fit within the rectangle. The options provided are Wrap and Overflow
Vertical Overflow Method to handle the case where the wrapped text is too tall to fit within the rectangle. The options provided are Truncate and Overflow
Best Fit Should Unity ignore the size property and try to fit the text directly into the control's rectangle
Color the color to use for rendering text
Material The material used to render the text
Raycast Padding Raycasting, clicking on it may increase memory

image

Rect Transform
With, Hight image size (pixels).
Anchors (anchor points) determine the positional relationship between the image and the background.
Pivot (center point) is related to Pos position.

Attributes Function
Source Image A texture representing the image to display (must be imported as a sprite)
Color the color to apply to the image
Material The material used to render the image
Raycast Target Whether this image should be treated as a raycast target
Preserve Aspect Make sure the image keeps its existing size
Set Native Size Use this button to set the dimensions of the image box to the texture's native pixel size

ImageType
ImageType needs to be displayed after the image is attached to the Image.
The red box is displayed after insertion
There are four options for ImageTypeSimple,Sliced,Tiled,Filled
Simple
Set Native SizeThe button is to restore the original image size of the image.
Sliced
​​is turned off when the picture is divided into nine (nine squares)Fill CenterThe part in the middle will be removed.
Pixels Per Unit MulpitlerPixels per unit.
Filled
is used to achieve the effect of skill CD in the game.
inFill MethodThe Horizontal in it means that the effect is realized in the horizontal direction, and Vertical represents the realization in the vertical direction.
Rdial90, Rdial80, and Rdial360 are realized at 90 degrees, 180 degrees, and 360 degrees, respectively.
insert image description here
Fill Origin represents the position where the implementation starts

Raw image (RawImage)

Attributes Function
Texture A texture representing the image to display
Color the color to apply to the image
Material The material used to render the image
UV Rectangle The offset and size of the image within the control's rectangle, expressed in normalized coordinates (range 0.0 to 1.0). The edges of the image will be stretched to fill the space around the UV rectangle

RawImage can make frame animation
UV RectAmong them, x is the width and length of the picture, y is the length of the height,
H represents the ratio of the height of the changed picture to the original image;
W represents the ratio of the length of the changed picture to the original image.

Mask

After using the Mask, the part selected by the Mask can be displayed, while other parts will not be displayed.
Mask is generally not used frequently because Mask consumes computer performance. The reason is that Mask itself is a component of UI, but Mask itself will take away a UI and thus increase performance consumption.
Advantages of RectMask2D
: Compared with Mask, it consumes less performance.
Disadvantages: Can only be used for 2D layers, some minor bugs may appear.

Guess you like

Origin blog.csdn.net/AD_GOD/article/details/123292225