7.16 Update version 1.2
1. Sharing of the latest self-written simulator
2.Fix the black screen problem
7.9 Update version 1.1
1. Support more APIs and fix some problems
The following content is all original, please indicate the source and author @GiveMeFive when reprinting
Maybe everyone is troubled. When developing the watch face, you can’t see what it looks like until you install it. When developing the mini program, you can install it on the bracelet and nothing comes out, and no problem can be found.
Currently, there is only an official watch simulator, and it is troublesome to install. It only supports Linux systems. It has discouraged countless people, including the author himself (it took three or four hours to do it but it was not done yet).
Therefore, the idea of making your own simulator came to mind. Supports most dial controls, calling and rendering of mini program interfaces, click events, and Timer functions.
If you encounter something that is not supported, please leave a message and adapt and upgrade when you see it.
The above is the preface, followed by tutorials. The following tutorials can be basically completed in 10 minutes.
1. Unzip the attachment to get the following folder. Note that the decompression path cannot contain Chinese characters! 浏览附件13017
2. Click start.exe to open the service (actually the nginx service)
3. Open Google Chrome (preferably Google Chrome), enter http://127.0.0.1:8088/ in the address bar , and open the following screen. If it cannot be accessed, check whether the decompression path contains Chinese characters and whether port 8088 is occupied. 浏览附件13022 浏览附件13023
4. OK, the simulator has been started. The next step is to modify the dial. The dial files are in the following directory.
The files inside are the same as those extracted from the normal watch face. However, please note that the decompressed images must be converted into normal png, and they must be manually converted into tga format when packaging.
For the conversion tool, please see another post. 浏览附件13019
5. Then, you can use any development tools to make modifications. Just refresh the browser after modification. Sometimes the browser has a cache, so clear the cache and refresh it.
Please use the F12 function of the browser to debug.
Okay, that’s the end of the above tutorial. Please note that if the path of the watch face file is not watchface/index.js, please modify the path address in the following file. 浏览附件13020
아래 내용은 모두 원본이므로, 재인쇄 시 출처와 작성자 @GiveMeFive를 표기해주세요.
아마 다들 고민하고 계실텐데요. 워치페이스를 개발할 때에는 설치하기 전까지는 어떻게 보이는지 알 수 없고, 미니 프로그램을 개발할 때에는 팔찌에 설치해도 아무 것도 나오지 않고 문제가 발견되지 않습니다.
현재는 공식 시계 시뮬레이터만 있고 설치가 번거롭고 리눅스 시스템만 지원해서 작성자 본인을 포함해 수많은 사람들의 낙담을 샀다(3~4시간 걸렸는데 아직 끝나지 않았음) .
그래서 자신만의 시뮬레이터를 만들어보자는 생각이 떠올랐습니다. 대부분의 다이얼 컨트롤, 미니 프로그램 인터페이스 호출 및 렌더링, 클릭 이벤트, 타이머 기능을 지원합니다.
지원되지 않는 사항이 있을 경우 메시지를 남겨주시고 확인 시 적응 및 업그레이드를 해주시기 바랍니다.
위 내용은 서문에 이어 튜토리얼이며, 다음 튜토리얼은 기본적으로 10분 안에 완료할 수 있습니다.
1. 첨부파일의 압축을 풀면 아래와 같은 폴더가 나옵니다. 압축해제 경로에는 한자를 포함할 수 없으니 주의하세요! 浏览附件13017
2. start.exe를 클릭하여 서비스(실제로는 nginx 서비스)를 엽니다.
3. Google Chrome(Google Chrome 권장)을 열고 주소 표시줄에 http://127.0.0.1:8088/을 입력한 후 다음 화면을 엽니다. 접근이 불가능할 경우, 압축해제 경로에 한자가 포함되어 있는지, 포트 8088이 사용되고 있는지 확인하세요.
[첨부=전체]13022[/첨부] 浏览附件13023
4. 자, 시뮬레이터가 시작되었습니다. 다음 단계는 다이얼을 수정하는 것입니다. 다이얼 파일은 다음 디렉터리에 있습니다.
내부 파일은 일반 시계 모드에서 추출된 파일과 동일합니다. 단, 압축해제된 이미지는 반드시 일반 png로 변환해야 하며, 패키징 시 수동으로 tga 형식으로 변환해야 한다는 점 유의하시기 바랍니다.
변환 도구에 대해서는 다른 게시물을 참조하세요. 浏览附件13019
5. 그런 다음 개발 도구를 사용하여 수정할 수 있습니다. 수정 후 브라우저를 새로 고치면 됩니다. 브라우저에 캐시가 있는 경우가 있으니 캐시를 지우고 새로고침해 보세요.
디버그하려면 브라우저의 F12 기능을 사용하십시오.
자, 이상으로 튜토리얼이 끝났습니다. 워치페이스 파일의 경로가 watchface/index.js가 아닌 경우, 다음 파일에서 경로 주소를 수정해 주시기 바랍니다. 浏览附件13020
아래 내용은 모두 원본이므로, 재인쇄 시 출처와 작성자 @GiveMeFive를 표기해주세요.
아마 다들 고민하고 계실텐데요. 워치페이스를 개발할 때에는 설치하기 전까지는 어떻게 보이는지 알 수 없고, 미니 프로그램을 개발할 때에는 팔찌에 설치해도 아무 것도 나오지 않고 문제가 발견되지 않습니다.
현재는 공식 시계 시뮬레이터만 있고 설치가 번거롭고 리눅스 시스템만 지원해서 작성자 본인을 포함해 수많은 사람들의 낙담을 샀다(3~4시간 걸렸는데 아직 끝나지 않았음) .
그래서 자신만의 시뮬레이터를 만들어보자는 생각이 떠올랐습니다. 대부분의 다이얼 컨트롤, 미니 프로그램 인터페이스 호출 및 렌더링, 클릭 이벤트, 타이머 기능을 지원합니다.
지원되지 않는 사항이 있을 경우 메시지를 남겨주시고 확인 시 적응 및 업그레이드를 해주시기 바랍니다.
위 내용은 서문에 이어 튜토리얼이며, 다음 튜토리얼은 기본적으로 10분 안에 완료할 수 있습니다.
1. 첨부파일의 압축을 풀면 아래와 같은 폴더가 나옵니다. 압축해제 경로에는 한자를 포함할 수 없으니 주의하세요! 浏览附件13017
2. start.exe를 클릭하여 서비스(실제로는 nginx 서비스)를 엽니다.
3. Google Chrome(Google Chrome 권장)을 열고 주소 표시줄에 http://127.0.0.1:8088/을 입력한 후 다음 화면을 엽니다. 접근이 불가능할 경우, 압축해제 경로에 한자가 포함되어 있는지, 포트 8088이 사용되고 있는지 확인하세요.
[첨부=전체]13022[/첨부] 浏览附件13023
4. 자, 시뮬레이터가 시작되었습니다. 다음 단계는 다이얼을 수정하는 것입니다. 다이얼 파일은 다음 디렉터리에 있습니다.
내부 파일은 일반 시계 모드에서 추출된 파일과 동일합니다. 단, 압축해제된 이미지는 반드시 일반 png로 변환해야 하며, 패키징 시 수동으로 tga 형식으로 변환해야 한다는 점 유의하시기 바랍니다.
변환 도구에 대해서는 다른 게시물을 참조하세요. 浏览附件13019
5. 그런 다음 개발 도구를 사용하여 수정할 수 있습니다. 수정 후 브라우저를 새로 고치면 됩니다. 브라우저에 캐시가 있는 경우가 있으니 캐시를 지우고 새로고침해 보세요.
디버그하려면 브라우저의 F12 기능을 사용하십시오.
자, 이상으로 튜토리얼이 끝났습니다. 워치페이스 파일의 경로가 watchface/index.js가 아닌 경우, 다음 파일에서 경로 주소를 수정해 주시기 바랍니다. 浏览附件13020
