Bubble.io 노코드 툴 -17일차-

10. Creating cards within a project list

List 안에서 Card를 만드는 방법

 

이전에 만들었어 board 영역에 총 4단계의 layer를 각각 생성하였다. (아직 이해는 잘 안되지만 그냥 따라하고 있다.)

1. 가장 뒤에 있는 레이어(검정):  Drop Area (Type of content: List / Data source: Current cell's List)

    ㄴ 가장 뒤의 레이어는 List 와 관련된 영역

2. 중간에 있는 레이어(파랑): RepeatingGroup Task (Type of content: Task / Data source: Search for Tasks)

    ㄴ 중간 레이어는 반복 Group으로 생성했다.

    ㄴ repeating group으로 만들어놓고는 열1개, 행1개로 구성했다. ? 그럼 왜 반복으로 만들었지?

    ㄴ Data source 상에서 Search for 라는 기능을 추가했다. 어떤 역할을 하는거지?

3. 그 위에 있는 레이어(흰색): Drag/dropGroup (Type of content: Task / Data source: Current cell's task)

    ㄴ ? Drop Area와 Drag/dropGroup은 뭐가 다르지?

            ㄴ ? Drag/drop그룹을 이용할 수 있는 Area가 Drop Area 인가?

4. 가장 위에 있는 레이어 (이미지블록): Image (Dynamic image: Parent group's task's image)

    ㄴ Parent group이라면 이 이미지가 속해 있는 그룹 = Drag/dropGroup의 task가 지니고 있는 이미지 value를 의미함. 

 

가장 뒤에 있는 레이어

두번째로 뒤에 있는 레이어

위에서 두번째 레이어

가장 위에 있는 레이어

구현 화면

수업에서는 Extended Vertical Scrolling 기능이 있는데, 내가 사용중인 최신 버전에서는 해당 기능이 없다. 그래서 강의내용처럼 Task가 추가로 생성될 때 파란색 공간 height가 동적으로 늘어나도록 할 수 없음.

ㄴ 유투브 검색해보니 Bubble 채널에서 친절히 안내해주고 있다.

아하. Layout에서 Max Height을 Infinate으로 바꾸면 되는구나!

Ext. Vertical scrolling 하기 너무 어려워졌다.

Parent element들의 Layout을 column으로 바꿔야만 max height 값을 infinite 으로 바꿀 수 있음.

마침내 해내긴 했는데.. 휴지통 위치를 자유롭게 이동시키려면 .. 다시 parent group의 layout을 column에서 fixed로 바꿔야하고.. 그러면 max height 값 설정을 할 수 없고.. 뭔가 dead lock에 걸린듯한 느낌. 아직 내가 부족해서 답을 찾지 못하는 거겠지..

다음으로는 Backing List에 있는 Task를 다른 List, 즉 In-progress 나 Complete으로 변경하는 기능 구현임.

 

이제까지 들었던 수업 중 가장 어려웠던 수업 내용.

중간에 뜻대로 되지 않아서 두 번은 다시하고 다시하고 했던 수업.

강사가 사용한 버블 버전의 기능과, 신규 버전 버블 기능이 일치하지 않아서 어려움이 있었음.

노가다로 따라했는데,, 이게 맞나 싶음.

 

11. Using custom states to edit the content of a task card

11강은 아직 들어가지 못했다.. 내일 이어서.