Object

이 페이지에서는 메인 메뉴의 Edit Menu 중 Object Tab에 대해 설명합니다.

Basic

Active

화면에서 활성

Auto Detect 에 의해 자동 분석시 필요하지 않은 Layout을 제외시킬거나 활성화 시킬때 사용하게 됩니다.

Active가 체크되어 있지 않는 요소들은 Hierarchy리스트에서 취소선이 나타나게 됩니다.

또한 모든 Canvas, Preview, SceneLayout, Codeview, Styleview에서 제외되어 나오게 됩니다.

Vector

이미지화 하고자 하는 Object들을 선택 후 Vector를 체크하면 한 개의 이미지로 변경됩니다.

Mode

Background

해당 이미지가 Background 여야 할때 해당 이미지를 선택 후 Background 버튼을 누르면 배경이 됩니다.

Border

Border 버튼은 line 아이템일때만 활성화 됩니다. Border 속성을 가져야되는 line 요소가 Border가 아닐때 해당 버튼을 누르면 Border로 변경됩니다.

Position

CSS Position은 문서상에 요소를 배치하는 방법을 지정합니다.

Position은 부모안에 있는 자식 Object들을 배치할 때 보모의 Position을 선택할 수 있습니다.

  • relative - Object를 일반적인 흐름에 따라 배치하고, 자기 자신을 기준으로 top, right, bottom, left의 값에 따라 오프셋을 적용합니다. 오프셋은 다른 요소에는 영향을 주지 않습니다.

  • absolute - 페이지의 레이아웃에 공간도 배정하지 않습니다. 대신 가장 가까운 위치 지정 부모 요소에 대해 상대적으로 배치됩니다. 단, 부모 중 위치 지정 요소가 없다면 초기 컨테이닝 블록을 기준으로 삼습니다.

차세한 사항은 CSS 문서를 참조해 주세요.

Constraint

페이지 사이즈를 유연하게 동작 할 요소를 만들때 사용됩니다.

페이지의 사이즈를 늘렸을때 해당 오브젝트의 위치를 설정합니다.

  • Left - 프레임에서 오브젝트를 왼쪽에 고정할 때 사용합니다.

  • Right - 프레임에서 오브젝트를 오른쪽에 고정할 때 사용합니다.

  • Left&Right - 프레임에서 오브젝트의 왼쪽 위치와 오른쪽 위치를 고정하고 좌우 사이즈가 변경됩니다.

  • Center - 프레임에서 오브젝트가 현재위치에서 고정되어 위아래나 좌우로 프레임과 같이 움직입니다.

  • Fill - 해당 오브젝트의 위치에 따른 양옆, 위아래 비율에 따라 채워진 상태로 변경됩니다.

  • Scale - 선택하면 페이지 크기에 따라 사이즈 변경됩니다.

Figma 가이드 문서 참조

Last updated