# lvgljs

**Repository Path**: woowill/lvgljs

## Basic Information

- **Project Name**: lvgljs
- **Description**: 这个是lv_binding_js在github上的源码中的.git，这里将lvgljsgit 复制到另一个文件夹lv_binding_js中并重名为.git，然后使用
git reset --hard 将源码萃取出来
执行git submodule init和git submodule update 将子模块代码提前出来
然后可以直接git pull 进行和github上的仓库进行更新
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-11-27
- **Last Updated**: 2023-11-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# lvgljs
这个是[lv_binding_js](https://github.com/lvgl/lv_binding_js) 在github上的源码中的.git重命名为lvgljs的文件夹，用于快速拉起github上的代码以及子模块

  <img src="./img/lvgljs.png">

Write [lvgl](https://github.com/lvgl/lvgl) with JavaScript. It uses React's virtual DOM concept to manipulate lvgl UI components, providing a familiar experience to users.

## 代码复原

### 复原方法
  - 将lvgljsgit 复制到另一个文件夹 lv_binding_js 中并重名为.git
  - 因为gitee最大单个文件是100M，但是lvgl的pack包大于200M，所以我通过压缩的多个文件的方式进行压缩，这里需要进入lvgljsgit\modules\src\deps\lvgl\objects\pack文件夹，解压pack-74fc4c670dd3de84280e4291d99af23aea58cafa.zip.001到当前文件夹，然后删除*zip.*
  - git reset --hard 将源码萃取出来
  - git submodule init
  - git submodule update 将子模块代码提前出来
  - git pull 更新github上的仓库进行更新(可以不更新)
### 复原如下
  - 解压pack-74fc4c670dd3de84280e4291d99af23aea58cafa

  <img src="./img/pack_zip.png">

  - 还原源码命令

  <img src="./img/Image1.png">

# 环境搭建

   包括vmware安装和ubuntu虚拟机安装，我没有尝试过子系统
   
## vmware安装
vmware安装
vmware16pro许可证密钥，自给自足
[VMware-workstation-full-16.2.4-20089737.exe](https://download3.vmware.com/software/WKST-1624-WIN/VMware-workstation-full-16.2.4-20089737.exe)


## ubuntu 虚拟机安装，我用的22.04.1，自己从下面连接中选，必须有网，并且vmware tools是自动安装

[ubuntu-22.04.1-desktop-amd64.iso](https://mirror.nju.edu.cn/ubuntu-releases/)
这个安装没有什么技巧了，只是注意硬盘给大一点搞个100G吧！

## 搭建Samba服务

这个的作用是将ubuntu服务器里面的文件夹共享给windows

### 安装samba 服务器

  - sudo apt-get install samba

### 新建共享目录和为目录分配权限（即是说linux系统想共享的目录）

  - mkdir  /home/john/workspace
  - sudo chmod 777 /home/john/workspace/ -R

### 配置samba服务器

  - sudo vim /etc/samba/smb.conf
  - 往文件添加内容

```bash
    [workspace]
    comment = My samba
    path = /home/john/workspace
    browseable=yes
    writeable=yes
```


  - 上面几行的意思是要共享的路径和是否可浏览和读写，以及标识信息

### 为samba分配用户名（这里，我的用户名为john，敲完回车会弹出设置2次密码）

  - sudo smbpasswd -a john

### 在ubuntu上ifconfig查看ip地址

  <img src="./img/ip.png">

### 在windows 计算机下输入如下

  - \\192.168.110.16 

  <img src="./img/Samba.png">

  - 点击右键 映射网络驱动器，将其映射到window磁盘中


## ubuntu 编译运行demo

包括依赖的包，遇到的编译问题以及demo运行

### 安装vsc

  <img src="./img/vsc.png">

### 将代码通过上面的方式还原到wakepace目录下lv_binding_js目录下

  <img src="./img/lv_binding_js.png">
  
### 安裝包

  - ubuntu安装一些包，可以参考lv_binding_js\doc\build\build-ubuntu-x86-simulator.md
  - 注意如果点击readme中的【ubuntu build Notes for sdl simulator】时，链接中的build-ubuntu-x86-simu'''al'''tor.md 需改为build-ubuntu-x86-simu'''la'''tor.md
  <img src="./img/ubuntu_pack.png">
  
  - 我安装的命令如下
  
   注意里面的文字标注
   <img src="./img/my_pack_cmd.png">

### 编译make dev-x86遇到的问题

  - 问题1:
```bash
    Could NOT find CURL (missing: CURL_LIBRARY CURL_INCLUDE_DIR)
    
    -- Found CURL: /usr/lib/x86_64-linux-gnu/libcurl.so (found version "7.81.0")  
    CMake Deprecation Warning at src/jsruntime/deps/quickjs/CMakeLists.txt:1 (cmake_minimum_required):
      Compatibility with CMake < 2.8.12 will be removed from a future version of
      CMake.
    
    通过如下方式解决
    1-->sudo apt-get upgrade
    2-->sudo apt-get install libcurl4-openssl-dev
```

  - 问题2:
```bash
    CMake Error at CMakeLists.txt:41 (find_package):
      By not providing "FindSDL2.cmake" in CMAKE_MODULE_PATH this project has
      asked CMake to find a package configuration file provided by "SDL2", but
      CMake did not find one.
    
      Could not find a package configuration file provided by "SDL2" with any of
      the following names:
    
        SDL2Config.cmake
        sdl2-config.cmake
    
      Add the installation prefix of "SDL2" to CMAKE_PREFIX_PATH or set
      "SDL2_DIR" to a directory containing one of the above files.  If "SDL2"
      provides a separate development package or SDK, be sure it has been
      installed.
    
    SDL 需要sdl2.cmake 的问题
    通过如下方式解决
    1-->sudo apt-get install libsdl2-2.0
    2-->sudo apt autoremove
    3-->sudo apt-get install libsdl2-dev
```

  - 问题3: 注意有几个文件的大小写问题，例如Line目录，但是Cmakelist.txt文件路径使用的line，导致找不到

  - 问题4: Cmakelist.txt中的版本以及命令问题

### 编译make dev-x86以及运行demo

   - ./dev_x86/lvgljs ./demo/widgets/index.js

   <img src="./img/demo.png">


### windows 下 也是可以编译make dev-x86以及运行demo，只是windows需要修改的东西比较多

   - D:\code\lv_binding_js> ./dev_x86/lvgljs .\test\dropdownlist\3\index.js

   <img src="./img/windows.jpg">

## 公众号:Bluetooth-BLE  
  ![公众号:Bluetooth-BLE](./img/公众号.jpg  "公众号:Bluetooth-BLE") 
## QQ群:177341833  
  ![QQ群:177341833](./img/qq群.jpg  "QQ群:177341833") 
  
# 计划使用RT-Thread + LVGLJS 搞一个开源 手表，不知道有没有可能