피그마 오토 레이아웃에서 프레임이 늘어나는 '방향'은 정렬(alignment) 설정으로 결정돼요. 기본값은 왼쪽 정렬이라 내용이 늘면 프레임이 오른쪽으로 커집니다. 반대로 왼쪽 방향으로 늘어나게 하려면 정렬 기준을 '오른쪽'으로 바꿔 주시면 됩니다.
방법은 간단해요. 오토 레이아웃이 적용된 프레임을 선택하면 오른쪽 디자인 패널에 3x3 점으로 된 '정렬' 컨트롤이 보입니다. 거기서 오른쪽 끝(가로 기준)을 클릭하면 기준점이 오른쪽으로 고정돼, 내용이 추가될 때 프레임이 왼쪽 방향으로 확장됩니다.
이때 프레임의 가로 크기 옵션이 '고정(Fixed width)'이 아니라 '콘텐츠에 맞춤(Hug contents)'으로 되어 있어야 내용에 따라 자동으로 늘어나요. 패널 상단의 W(너비) 옆 드롭다운에서 'Hug'를 선택하시면 됩니다. 고정 크기면 방향과 상관없이 늘어나지 않으니 꼭 확인하세요.
정리하면 ①가로 크기를 Hug contents로 ②정렬 컨트롤을 오른쪽으로 설정, 이 두 가지만 맞추면 왼쪽으로 늘어나는 오토 레이아웃이 완성돼요. 세로 방향도 같은 원리(위/아래 정렬)로 적용되니 참고하시고요. 정렬 점을 이리저리 눌러 보시면 금방 감이 잡히실 거예요!