개요
모든 PicoPixel 파일에는 자체 library가 있습니다. 이 library는 파일이 사용하는 colors, fonts, images, animated images, components를 모아 Assets panel에 표시합니다. 그대로 두면 그 library는 하나의 파일에 속합니다. 파일을 Publishing하면 그 library는 팀원이 재사용할 수 있는 것이 됩니다. 다른 파일에서 link하면 그 assets가 그 파일 자체의 assets와 함께 나타납니다.
이 가이드는 library가 무엇인지, Publish가 정확히 무엇을 하는지(그리고 그만큼 중요하게, 무엇을 하지 않는지), libraries를 publish하고 link하는 방법, 어디에서 찾는지 설명합니다. 가장 중요한 요점은 다음입니다.
Publishing은 작업물을 공개하지 않습니다. Publish는 파일의 library를 당신의 팀만 재사용할 수 있게 합니다. 즉 PicoPixel workspace 안의 사람들뿐입니다. 인터넷에 게시되지 않고, 공개 목록에 오르지 않으며, 팀 밖 누구에게도 보이지 않습니다. 콘텐츠가 팀을 떠나는 유일한 방법은 이 가이드 끝에서 다루는, 당신이 의도적으로 하는 행동뿐입니다.
library란
library는 파일 안에 들어 있는 재사용 가능한 assets 세트입니다. Assets panel에서는 파일 자체의 assets가 local library 아래에 보입니다. 항상 존재하고 기본으로 열립니다.
다른 team library를 파일에 link하면 local library 아래에 두 번째의 별도 이름 섹션으로 나타납니다. 제목은 그 library의 파일 이름입니다(예: Animation Examples). 따라서 library가 linked되면 Assets panel은 파일 자체의 assets와 linked library의 assets를 나란히 보여 주며, 바로 드래그해 사용할 수 있습니다.
같은 찬장 안의 두 선반처럼 생각하세요. local library는 이 파일이 만든 것이고, 각 linked library는 팀의 다른 파일에서 빌린 선반입니다. 디자인을 떠나지 않고 둘 중 어디서든 가져올 수 있습니다.
library가 담을 수 있는 것
파일의 Assets panel에 있는 모든 것은 publish할 때 library와 함께 이동합니다. PicoPixel은 assets를 다음 섹션으로 묶습니다.
- Images, 파일에 추가한 정적 그래픽.
- Animated images, 여러 프레임의 animated graphics.
- Components, 재사용 가능한 LVGL widgets(아래 참고).
- Colors, 저장된 color swatches.
- Fonts, 추가하고 디바이스용으로 변환한 fonts.
파일을 publish하면 이 모든 것이 팀에서 재사용 가능해지며, 파일 사이를 복사해 붙여 넣을 필요가 없습니다.
"component"란
component는 하나 이상의 widgets로 만들어진 재사용 가능한 빌딩 블록입니다. 단일 button이나 label은 하나의 widget이지만, component는 여러 widgets와 layers를 함께 묶을 수 있습니다. 예를 들어 title, icon, value가 있는 styled card를 하나의 재사용 단위로 만들어 어떤 screen에도 놓을 수 있습니다.
각 component에는 main instance가 있습니다. main instance를 편집하면 변경 사항이 해당 component의 모든 복사본으로 흐릅니다. 당신의 library를 link한 다른 파일 안의 복사본도 포함됩니다. 이것이 components가 UI 일관성을 유지하는 데 강력한 이유입니다. control을 한 번 정의하고, 어디서나 재사용하고, 한곳에서 업데이트할 수 있습니다.
여러 screens에서 같은 작은 widget 묶음을 반복해서 만들고 있다면, header bar, metric tile, labelled toggle 같은 것은 component가 되기를 기다리는 중입니다. 한 번 만들면 모든 screen이 같은 상태를 유지합니다.
파일을 library로 publish하기
Publishing은 하나의 스위치를 켭니다. 파일을 팀의 shared library로 표시합니다.
- Libraries dialog를 엽니다. Assets panel에서 Add library 버튼을 사용합니다(파일에 linked libraries 또는 components가 이미 있으면 Manage library로 표시됩니다).
- LIBRARIES tab에서 LIBRARIES IN THIS FILE 아래를 봅니다. File library가 현재 파일의 library이며, 옆에 Publish 버튼이 있습니다.
- Publish를 클릭합니다.
버튼은 Unpublish로 바뀌며, 파일이 이제 팀이 link할 수 있는 shared library가 되었음을 확인합니다. PicoPixel은 파일에 작은 library badge도 추가합니다. workspace header 오른쪽 위와 Dashboard의 파일 카드에서 볼 수 있어 어떤 파일이 published인지 쉽게 알아볼 수 있습니다.
나중에 Unpublish를 클릭하면 확인을 요청한 뒤 library link를 해제합니다. PicoPixel은 먼저 그 library를 사용하던 모든 파일에 library assets를 복사하므로, 의존 파일이 갑자기 필요한 것을 잃지 않습니다.
팀 libraries 찾기
Published libraries는 팀 전체를 위해 한곳에 모입니다.
- Dashboard를 엽니다.
- 왼쪽 사이드바의 Sources 아래에서 Libraries를 클릭합니다.
이 페이지는 팀 전체에 publish된 모든 library를 나열하며, 현재 속한 team으로 범위가 제한됩니다. team을 바꾸면 그 team의 libraries가 보입니다. 팀원이 재사용 가능한 것을 찾아보는 catalogue입니다.
다른 파일에서 library 재사용하기
library가 publish되면 팀의 어떤 파일이든 가져올 수 있습니다.
- 작업할 파일을 엽니다.
- Assets panel에서 Add library(또는 Manage library)를 클릭해 Libraries dialog를 엽니다.
- SHARED LIBRARIES 섹션에서 원하는 library를 찾습니다. 목록이 길면 Search shared libraries 상자가 도움이 됩니다. 옆의 **+**를 클릭해 link합니다.
linked library는 Assets panel에서 local library 아래에 자체 이름을 가진 섹션으로 나타납니다. components, images, colors, fonts를 그대로 디자인에 드래그하세요.
linked library 최신 상태 유지하기
link한 library가 바뀌어도, 예를 들어 owner가 component를 편집하거나 color를 조정해도, 업데이트가 강제로 적용되지는 않습니다. Libraries dialog의 UPDATES tab은 더 최신 변경 사항이 있는 linked libraries를 나열하고, 준비되었을 때 Update 버튼으로 적용할 수 있게 합니다. 변경 사항이 없으면 업데이트할 것이 없다고 알려 줍니다.
개인정보: 여기의 것은 절대 자동 공개되지 않습니다
Publish라는 단어가 실제보다 크게 들리기 때문에 다시 강조할 가치가 있습니다.
Publishing a library는 팀과만 공유하고 그 외 누구와도 공유하지 않습니다. 접근은 인증되고 team으로 범위가 제한됩니다. public link도, public listing도 없으며, team 밖 누군가가 published library에 접근할 방법도 없습니다. "Published"는 "available to my teammates"라는 뜻일 뿐입니다.
당신이 만든 것이 팀 밖으로 나가는 방법은 정확히 두 가지뿐이며, 둘 다 당신이 선택하는 일입니다.
- 직접
.picopixel파일을 export하고 보냅니다. workspace menu에서 **Export.picopixel**을 하면 파일이 컴퓨터로 다운로드됩니다. 그 파일을 이메일로 보내거나 공유하거나 누군가에게 넘기는 것은 전적으로 당신의 선택이며 PicoPixel 밖에서 일어납니다. - PicoPixel team에 공식 submission을 합니다. 디자인을 더 넓은 PicoPixel community와 공유하고 싶다면
app.picopixel.io/#/settings/submit-template에 검토를 위해 제출할 수 있습니다. community gallery에 게시되기 전에 팀이 각 submission을 검토합니다. 양식에 필요한 내용과 부여하는 권리는 How to submit a template을 보세요.
이 두 가지 의도적인 단계 외에는 files와 libraries가 팀 안에 머뭅니다.
커뮤니티 templates와 ready-made libraries
처음부터 시작할 필요는 없습니다. PicoPixel templates gallery에는 PicoPixel team과 wider community가 만든 templates, UI kits, examples, sprites, animated images, full app files가 점점 늘고 있습니다. 각각은 일반 .picopixel 파일이며, 열고 customize하고 자신의 프로젝트 시작점으로 사용할 수 있습니다.
여는 모든 template도 library가 될 수 있습니다. publish하면 팀이 components, fonts, colors, images에 접근할 수 있고 다시 만들 필요가 없습니다. 새 project를 빠르게 시작하거나 기존 project에 polished elements를 추가하는 가장 빠른 방법입니다.
templates를 찾고, import하고, customize하는 전체 흐름은 How to use PicoPixel templates, UI kits, and full apps를 보세요.
다음 단계
- How to submit a template, wider PicoPixel community와 디자인 공유하기
- What is a sprite?, components로 만들 만한 animated, multi-state widgets 만들기
- Working with fonts, library가 담는 fonts 추가 및 변환하기
- Working with the LVGL Animated Image Widget, 파일 사이에서 재사용할 animated images 만들기
