구차니의 잡동사니 모음

export 메뉴에는 크게 두 가지가 존재한다.

create template project로 하면 상위 디렉토리가 좀 많이 생기고

그 안에  esp-idf용 sdkconfig 파일까지 생성된다(다르게 말하면 프로젝트 생성시 개발할 타겟 보드를 잘 설정해야 한다는 의미)

export ui files 하면

create template project에서 생성된 ui 디렉토리 하위의 내용과 동일한 것 같다(diff까진 안해봐서..)

아무생각 없이 export 했다가 sdkconfig보고 기겁을 해서(esp32-s3를 난 설정한적이 없는데!)

부랴부랴 설정이 변경한지 메뉴를 뒤져보니 proejct settings 발견

창은 창인데 f4로 안닫히고, esc로도 안닫히는 나쁜 창!

아무튼 board properfies에 esp-s3 이런식으로 되어있었나 보다.

esp32-wroom-32 쓰는 중인데 아마 얘가 esp wrover 칩일꺼라 이거면 될거 같은데

version 1.0.0을 택하면 LVGLdl 8.3.11만 가능해지고

version 2.0.0을 택하면 LVGLdl 9.1.0만 가능해진다.

7점대는 완전 구조가 다르다고는 하는데.. 8.3.11이 아니면 약간 낮은 버전에서는 쓰기 힘들려나?

그럼 9.x랑 8.x도 구조가 많이 다른가?

ubuntu + sdl + lvgl pc port

[링크 : https://memories.tistory.com/155]

[링크 : https://github.com/lvgl/lv_port_pc_vscode]

윈도우 + lvgl pc port fork -> visual studio port

[링크 : https://blog.naver.com/chandong83/223025089463]

[링크 : https://github.com/lvgl/lv_port_pc_visual_studio]

요건 도움말을 보던가 문서를 봐야 알 듯.

아무튼 이미지를 추가하고 어떻게 하는것 같은데 감이 올 듯 안 올 듯.. 한다

[링크 : https://docs.squareline.io/docs/dev_env/animation/]

보이는 하나의 디자인을 screen 으로 부르고

스크린간 전환은 

trigger - clicked

action - change screen 으로 하여 구현이 된다.

그래서 메인화면에서 톱니바퀴를 누르면 설정으로 fade on 하여 가게 되는데

새로운 이벤트 목록은 아래와 같다.

일단 위의 경우 사용된건 change screen 인데

그 외에는 set opacity나 play animation 정도가 눈에 띈다.

fade on 대신 move left / move right 하고

duration 100 msec에서 1000 msec 으로 해주면 좀 슬라이드 되는 느낌이 들게 움직인다.

아래는 move left 전환효과를 순간 캡쳐 한 것.

---

스크린 변경이 아니라 일부 그룹에 대한 show / hide로 구현된 경우도 있는데

우측 하단의 3개를 누르면 속도는 뜨면서 내용이 변한다.

아무튼 설정을 보면

action - play 에서 group driving을 딜레이 없이 animation on 을 한다는데,

initial action 에 on으로 정의 된 건 없어서 모르겠다. on/off 의 on 같기도 한데?

그리고 BTN BG1 ADD / BTN BG2/3 REMOVE로

선택되었다는 밝은 주황색 배경을 on/off 해준다.

lvgl 다국어 지원 검색하다가 걸려 나온 nxp 툴.

[링크 : https://www.nxp.com/design/design-center/software/development-software/gui-guider:GUI-GUIDER]

먼가.. 묘하게 squareline studio 느낌이 난다?

[링크 : https://www.nxp.com/docs/en/user-guide/GUI_Guider_User_Manual.pdf]

매번 뜨길래 어떻게 끄나 찾아봄

[링크 : https://forum.lvgl.io/t/remove-fps-and-cpu-display/11042]

lv_conf.h를 찾아보니 아래와 같이 선언되어있다.

클론 시에 아래것들 까지 다 받으려면 아래와 같이 recurse-submodules를 주면되는데

[링크 : https://git-scm.com/book/ko/v2/Git-도구-서브모듈]

받고나서 서브모듈들을 받으려면 아래처럼 먼가 좀더 복잡해 진다.

[링크 : https://stackoverflow.com/questions/10168449/git-update-submodules-recursively]

[링크 : https://stackoverflow.com/questions/10168449/git-update-submodules-recursively]

BG1 빼고 다 끔

slider speed. 가장 궁금했던 녀석인데..

Name에는 공백은 언더바로 치환되어 변수로 설정된다.

width / height 값은 이미지의 원래 크기인데 X와Y는 왜 마이너스 값일까?

scroll의 scroll direction은 all / vertical / horizontal 이 있으나 방향에 영향을 미치지 못한다.

value 는 min ~ max 사이 값으로 현재 값이다. max를 넘는 값이 들어갈수도 있으나 max로 표현된다.

스타일 셋팅 이게 표현의 핵심인듯.

슬라이더를 보면 main / indicator / knob로 나뉘는데

main의 배경 투명도를 켜고 꺼보면 먼가 차이가 난다.

이미지 자체는 투명인데 배경을 설정하지 않으면 흰색이 그냥 표시되는건가?

indicator는 슬라이더 바의 표시될 영역이라고 하면 되려나

32라면 왼쪽으로 부터 32 만큼 찬 것을 표시해주고 혹은 하단에서 부터 1/3이 차는걸 표현해주는 녀석이다.

main과는 다르게 indicator의 경우 표시되는 영역인 1/3 하단 영역에 대한 투명도가 사라진다.

knob는 손잡이 인데, 슬라이더의 중앙이라고 해야하나? 말 그대로 손잡이를 그려주는데

이 디자인에서는 노브가 없는 디자인이기에 투명하게 설정해서 손잡이를 지운다.

심심해서 slider 추가하고 가로 세로 비율을 다르게 했더니 비율에 따라 슬라이더 방향이 바뀐다. 이게 머야 -_-

35에서 50 으로 하니 옆으로 찬다.

이벤트는 연계되는 상황에 대해서 어떻게 할지인데

trigger 가 value_changed 이고

어떻게 보면 슬라이더 값이 바뀔때 event2로 speed_number_2와

speed_number_1의 값을 바꾸도록 한다.

이벤트는 제법 여러가지가 있는데

key_right 부터 short / long click 등 엄청 여러가지 이벤트가 존재한다.

위에서 이벤트로 걸린건 아래의 숫자 속도인데

글씨를 두번 써서 그림자 효과라.. 그럼 포트에서 자체적으로 그림자를 지원안하는건가?

피그마를 쓰는법 익혀야 하나.. 고민이네

일단은~ lvgl pro용 외에

[링크 : https://www.figma.com/ko-kr/community/plugin/1362005814860504095/figma-to-lvgl]

squreline 용 플러그인도 발견

[링크 : https://www.figma.com/ko-kr/community/plugin/1578047295955007191/figma-to-squareline-vision]