LOOK360 장소 사진 목록 순서 변경 기능

less than 1 minute read

LOOK360 장소관련 사진 관리기능 중 사진 노출 순서 변경 기능을 구현하였습니다. 등록된 사진의 노출되는 순서와 노출여부를 변경 할 수 있습니다.

문제사항

  • 등록된 사진을 지우지 않고, 숨김처리 할 수 있는 기능이 없음.
  • 등록된 장소 사진의 순서를 변경할 수 없음.
    • Drag & Drop 기능을 이용한 손쉬운 순서 변경 필요.

해결방법

  1. 사진 노출 순서를 변경할 수 있는 기능 구현.
  2. 사진 노출 여부를 설정하는 기능 구현.

결과물

  1. 장소 사진 관리 메뉴

    • 기존의 장소관리 메뉴에서 ‘사진관리’ 버튼을 통해서 관리 할 수 있었던 숨겨진 메뉴를 사용하는 것이 아닌, ‘장소사진관리’라는 메뉴를 별도로 빼내어 사진관리가 용이하도록 함.
    바깥으로 빼낸 '장소사진관리'메뉴
    바깥으로 빼낸 ‘장소사진관리’메뉴
    • 기존의 장소관리 메뉴에서의 ‘사진관리’ 버튼 클릭 시에도 새로운 ‘장소사진관리’로 이동되도록 로직 변경.
    '장소사진관리'메뉴로 이동하는 사진버튼과 미니홈피 이동 버튼
    ‘장소사진관리’메뉴로 이동하는 사진버튼과 미니홈피 이동 버튼
  2. 장소 사진 관리 메뉴의 ‘순서변경’ 버튼

    ‘등록된 이미지 목록’ 위에 노출 순서를 변경할 수 있는 ‘순서변경’ 버튼 추가.

'순서변경' 버튼 위치
‘순서변경’ 버튼 위치
  1. ‘이미지 순서 변경’ 화면

    • ‘순서변경’ 버튼 클릭 시, Drag & Drop 기능을 이용하여 노출 순서를 변경할 수 있으며, 각 등록된 이미지 오른쪽의 ‘공개/숨김’의 토글방식의 버튼을 통해서 노출여부를 변경할 수 있음.
    • ‘임시 보관’ 목록 사용 방법
      1. ‘이미지 순서 정렬’ 목록의 이미지가 화면 세로 크기보다 많아 넘칠 경우
      2. 오른쪽 ‘임시 보관’ 목록에 순서를 변경하고자 하는 이미지를 옮겨놓고
      3. ‘이미지 순서 정렬’ 목록의 원하는 곳으로 스크롤 이동을 한 이후
      4. ‘임시 보관’에 있는 이미지를 다시 ‘이미지 순서 정렬’ 목록으로 옮긴다. :+1: Good!
    이미지 순서 정렬 화면
    이미지 순서 정렬 화면