SpriteGenerator2 (포트폴리오)Sprite Generator - 두번째, SpriteArea 및 MaxRects 알고리즘 구현 목차 첫번째, 개요 및 구성 두번째, SpriteArea 및 MaxRects 알고리즘 구현 지난 시간에 이어, 실제 이미지가 보여지는 SpriteArea와 MaxRects 알고리즘을 어떻게 구현했는지 알아보겠습니다. 동작 과정 개발사항 Layout 이미지가 많아져서 캔버스 크기를 넘어가더라도 스크롤링하여 처리했기 떄문에 SpriteArea 레이아웃 자체는 고정되게 처리하였습니다. 이렇게 함으로써 사용자는 SpriteArea에서 나중에 다운로드할 이미지의 본래 크기 자체를 제한없이 확인할 수 있습니다. 또한 이미지를 다운 받았을 때, 캔버스의 여백부분은 투명하게 처리되야 하므로 초기 캔버스 배경은 transparent 처리하였습니다. 캔버스 렌더링과 이미지 로딩 드래그앤드롭 Area에 올라간 이미지들은 J.. 2023. 10. 17. (포트폴리오)Sprite Generator - 첫번째, 개요 및 구성 목차 첫번째, 개요 및 구성 두번째, SpriteArea 및 MaxRects 알고리즘 구현 이미지 스프라이트(image sprite)란? 여러 개의 이미지를 하나의 이미지로 합쳐서 관리하는 이미지를 의미합니다. 왜 쓸까요? 여러 이미지를 한번에 로딩 시킬 수 있습니다. 이미지 로딩 시 깜빡임을 없애고 개별 이미지에 대한 관리를 따로 하지 않아도 된다는 장점이 있습니다. UI 화면 반응형이 아닌 적응형 레이아웃을 선택했고(개발시에 참고했던 사이트와 동일) Desktop 작업용으로 생각했기 때문에 최대 width값을 1440px(좌우 마진 포함한 사이즈. 미포함시 1060px)으로 맞췄습니다. UI의 경우 최대한 심플하게 구성하였습니다. 일단 이미지를 올리면 4가지 영역으로 구분됩니다. Drag&Drop 영.. 2023. 10. 15. 이전 1 다음
