Bubble.io에서 분할 화면 레이아웃을 어떻게 추가하나요?

단계 1: Bubble.io 편집기를 열고 분할 화면 레이아웃을 추가하려는 페이지로 이동합니다.

단계 2: 새 요소를 추가하기 위해 "+" 아이콘을 클릭하고 그룹 요소를 선택하여 분할 화면의 한 쪽을 위한 컨테이너를 생성합니다.

단계 3: 그룹 요소를 페이지에 드래그하고 페이지 너비의 절반을 차지하도록 크기를 조절합니다. 이것은 분할 화면의 한쪽 역할을 합니다.

단계 4: 그룹이 선택된 상태에서, 프로퍼티 편집기로 이동하여 레이아웃이 "고정"으로 설정되어 있는지 확인합니다. 이렇게 하면 그룹이 고정 크기와 위치에 있게 됩니다.

단계 5: 방금 만든 그룹 요소를 복사하고 붙여넣거나 단계 2를 따라 새 그룹 요소를 생성하고, 첫 번째로 생성한 그룹 옆에 배치합니다. 이것도 페이지 너비의 절반을 차지하도록 합니다.

단계 6: 그룹 요소 중 하나를 클릭하고 드래그 핸들을 사용하여 페이지의 왼쪽 또는 오른쪽 가장자리로 정렬합니다. 이렇게 하면 화면이 나란히 분할됩니다.

단계 7: 필요한 경우 요소의 너비를 조정하여 중간에 겹치거나 간격이 생기지 않도록 옆으로 완벽하게 맞춥니다.

단계 8: 각 그룹 컨테이너 내부에 추가 요소를 단순히 드래그 앤 드롭하여 원하는 요소를 추가합니다. 이는 텍스트, 이미지, 버튼 등이 될 수 있습니다.

단계 9: 프로퍼티 편집기에서 반응형 설정을 사용하여 분할 화면 레이아웃이 다른 기기와 화면 크기에 맞게 올바르게 조정되도록 합니다.

단계 10: 페이지를 미리보고 분할 화면 레이아웃이 예상대로 표시되는지 확인하고 필요한 경우 추가 조정을 합니다.

참고: 분할 요소가 독립적으로 작동하도록 하려면 (예: 별도로 스크롤), 각 그룹 요소가 RepeatingGroup을 포함하거나 고유한 스크롤 설정이 활성화되어 있는지 확인하십시오.