허니코드로 간단한 퀘스트 관리 앱 만들기~화면 디스플레이편~

개요


허니코드로 앱을 만드는 연습은 샘플을 사용하지 않고 간단한 앱을 만들어 보려고 한다.
나는 임무 관리 프로그램을 만들어 보고 싶다.
이번 보도에서 우리는 임무 관리 프로그램으로 임무 표시 부분을 제작할 것이다.
다른 글에서 작업을 추가하거나 삭제합니다.
이번 완제품은 다음과 같다.

Workbook 제작


우선 워크북을 새로 만들 때 화면 오른쪽 상단에 있는Create 워크북을 클릭하세요.
그리고 나서
다음 팝업이 나타납니다.

이번엔 처음부터 제작하는 거니까 Start from scratch를 눌러주세요.
그러면 다음과 같은 스프레드시트가 나타납니다.

이렇게 해서 워크북의 제작 부분이 완성되었습니다.

Workbook으로 이름 변경


기본 Workbook 이름은 Unitled입니다.이러면 이해하기 어려워서 워크북의 이름을 바꾸고 싶어요.
왼쪽에 전자 표 같은 칸이 많이 있는 것을 눌러 주세요.
그래서 이런 게 나왔어요.

여기 맨 위에 클릭하면 워크북의 이름을 편집할 수 있고 여기에'Task 관리'의 이름을 지을 수 있습니다.

앱 이름에도 일본어가 들어갔다.
다만, Enter Key를 누를 때마다 입력이 완료되기 때문에 일본어로 잘 안 될 수도 있다.
Workbook 이름 변경이 완료되었습니다.

Workbook 편집


Workbook의 편집을 진행하고 싶습니다.
기본적으로 단원격 단위로 전자 표와 excel을 편집하거나 행위 단위로 편집할 수 있다.
여기서는 임무 관리이기 때문에 맨 위 열에'임무','책임자','책임자 필터용','기한'을 추가한다.

항목별 설명 및 설정 방법


이번에는'임무'에 무엇을 할 것인지,'책임자'에 누가 할 것인지,'기한'에 mm/dd/yy 형식으로 그 임무를 완수하기 전의 연월일을 적는다.
담당자 부분이지만 이름을 입력할 때마다 번거롭기 때문에 드롭다운을 선택해야 한다.
또한 워크북을 공유하는 모든 사람을 선택할 수 있도록 Contact 형식을 사용합니다.
형식 방법을 사용하여 변경할 열을 선택한 상태에서 Formats 를 클릭합니다.
오른쪽에 다음을 표시하려면 을 클릭합니다.
사진.
이 Formt columas: "Contact"가 있습니다. 선택하십시오.
선택한 후 Display Preference에서 표시할 형식을 선택합니다.
이제 다음 내용을 표시할 수 있습니다. 이번에는 이름만 쓰세요.

이 Formt columas: "Contact"가 있습니다. 선택하십시오.
선택한 후 Display Preference에서 표시할 형식을 선택합니다.
이제 다음 내용을 표시할 수 있습니다. 이번에는 이름만 쓰세요.

선택이 끝나면 화면 오른쪽 아래에 있는 사과를 클릭하세요.
이렇게 하면 선택한 열은 다음과 같이 내려갈 수 있다.

(메일 주소 섹션이 삭제되었습니다.)
지금은 이 워크북을 공유하지 않았기 때문에 한 사람의 양만 표시하지만 워크북을 공유하면 아래처럼 여러 사람이 표시할 수 있다.

(메일 주소 섹션이 삭제되었습니다.)
워크북의 공유 방법은 다른 Qiita 기사로 기재되어 있으니 그쪽을 참조하세요.
HoneyCode를 통한 워크북 공유 방법

담당자 필터가 필요한 이유.


앱에 뜨면 자기가 맡은 임무와 같은 느낌으로만 걸러내려는 장면이 나온다.
나는 이것을 실현하고 싶지만, 형식이 Conact인 상황에서 왜 순조롭지 않은지 모르겠다. (Error로 표시됨)
따라서 담당자 Filter의 이름만 설정합니다.
설정 방법은 다음과 같다. 이름만 가져올 수 있다.
= [담당자] FirstName
Contact는 First Name 이외에도 메일 주소를 받은 경우 [First Name]의 섹션을 [Email], [Phone Number]로 변경하면 등록된 전화 번호가 됩니다.[Phone Number]가 등록되어 있지 않으면 0입니다.[Last Name]이면 Last Name 섹션만 표시됩니다.
이번 회의는 등록 실패로 인해 모두 First Name 회의입니다.
등록할 때 이름과 이름 사이에 반쪽 공간을 넣으면 그 전후로 First Name과 Last Name이 판단할 수 있을 것 같습니다.
이번에는 COLUMN FORMULA 포맷에 =[담당자] [First Name]를 추가합니다.
마찬가지로 기한 부분도 mm/dd/yy 형식으로 변하기 위해 격식을 설정한다.
이번 설정은 다음과 같다.

이상은 워크북의 준비 완료입니다.

응용 프로그램 화면 만들기


워크북만 만들면 앱에 표시할 수 없기 때문에 앱 화면을 만들어야 한다.
이번에는 스프레드시트의 내용을 표시하는 프로그램으로 사용하기 위해 표시하는 곳만 만들었다.
화면을 만들 때는 빈칸이 많은 로고 아래 마름모 모양의 로고(Builder)가 많은 부분을 클릭하세요.
그리고 이런 화면이 나옵니다. 플러스 번호를 눌러주시고 이번엔 Build your own을 눌러주세요.

그나저나 Useapp wizard를 사용하면 추가하고 삭제하는 앱을 간단하게 만들 수 있다.
다만, 이번에는 표시 부분만 만드는 법을 배우기 위해 Build your own을 사용했다.
특히 필요하지 않은 분들은 Useapp wizard를 사용하세요.
Build your own을 클릭하면 다음 화면이 나타납니다.

중간에 있는 것은 응용 프로그램이 어떻게 표시하는지 보여주는 화면이다.
왼쪽에 있는 "Screens"아래에 있는 것은 이 프로그램의 화면이 얼마나 되는지입니다.
Screens 오른쪽에 있는 더하기 기호는 응용 프로그램의 화면을 증가시킵니다.
위의 Mobaile 및 웹과 관련해서는 각 환경에 표시되는 방법을 확인할 수 있습니다.
화면 왼쪽 아래에 있는 Addobject는 화면에 배치할 항목을 결정합니다.
다음을 선택할 수 있습니다.

가장 큰 Table1은 데이터를 가져오려는 스프레드시트를 나타냅니다.
이번에는 Table1의 스프레드시트 내용을 배치하기 위해 "DATA & DISPLAY"프로젝트 내의 "Column List"를 선택했습니다.
선택하면 다음과 같은 내용이 표시됩니다.

항목별로 필터 기능을 추가할 수 있습니다.
예를 들어, 책임자는 필터링할 수 있습니다.
하지만 연락처의 항목은 필터할 수 없을 것 같습니다.
그래서 담당자 Filter용 을 사용하여 필터링하고 싶습니다.
Adda detail screen은 행의 세부 내용을 나타냅니다.
이 화면에는 홈 페이지에 표시되지 않은 내용을 표시할 수 있습니다.
이런 느낌으로.

기사도 처음에는 나왔지만 실제로 앱으로 시작하면 이렇게 된다.

이번엔 여기까지.

다음 회 예고


임무를 관리하기 위해 매번 허니코드의 워크북을 만드는 것은 번거롭기 때문에 나는 앱으로 이 임무를 완성하고 싶다.

감상


간단한 앱이지만 일반 스프레드시트와 엑셀에 없는'콘택트'항목이 편리하다고 생각한다.
그리고 쉬운 일도 건드리지 않은 물건이라면 시간이 오래 걸릴 것 같아요.

최후


만약 무슨 잘못된 점이 있다면 지적할 수 있다면 나는 매우 기쁠 것이다.

좋은 웹페이지 즐겨찾기