1. [Design] 디자인하기
메모장 앱을 직접 디자인해 보겠습니다.
메모장 디자인
시안과 같은 디자인을 직접 플렉스튜디오에서 디자인해 보겠습니다.
1. 시나리오 생성
워크스페이스에서 새 시나리오 버튼을 눌러 시나리오를 만듭니다. 아래 '시작하기'버튼을 클릭해 따라 해 보세요.
2. 메모리스트 화면 디자인
메모 작성자이름, 프로필 사진과 같은 정보를 확인할 수 있는 UI를 디자인 합니다.
아래 '시작하기'버튼을 클릭해 따라 해 보세요.
메모 리스트 타이틀 영역과 반복으로 추가할 메모 아이템 UI 디자인을 해 보겠습니다.
아래 '시작하기'버튼을 클릭해 따라 해 보세요.
새메모 버튼 디자인을 해 보겠습니다.
아래 '시작하기'버튼을 클릭해 따라 해 보세요.
새메모 버튼을 우측 하단에 고정하는 설정을 해 보겠습니다.
메모 아이템이 많아질 경우 스크롤 새메모 버튼이 하단으로 밀려 보이지 않을 수 있습니다. 버튼 Layout을 고정시켜 새메모 버튼이 하단에 고정되도록 설정해 보겠습니다.
이때, 스텝 하위에 추가되는 최상위 Layout, Group은 절대값 위치를 설정할 수 없기 때문에 아이템을 Group으로 추가하고, 높이를 100%로 설정해 기준 컨테이너로 구성해야 합니다.
스크롤 할 컴포넌트 (사용자 정보영역, 메모 리스트 타이틀, 메모리스트)를 Group으로 추가한 다음 높이를 100%로 입력하고, 세로 스크롤을 설정하면 하위 컴포넌트들이 많아질 경우 스크롤이 됩니다. 이후 하단에 고정할 버튼 Layout에 '절대값 위치 설정'을 하면, 스크롤을 이동해도 새메모 버튼이 하단에 고정된 것을 확인 할 수 있습니다. 절대값 위치 설정
아래 '시작하기'버튼을 클릭해 따라 해 보세요.
3. 메모등록 화면 디자인
메모 등록화면 디자인을 해 보겠습니다.
아래 '시작하기'버튼을 클릭해 따라 해 보세요.
Last updated
