From ae10bf8ebf8dfa75471164190a10d1def823ae0c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dustin=20Wei=28=E9=9F=A6=E4=BC=9F=29?= Date: Mon, 6 May 2024 15:15:24 +0800 Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9=E4=BB=A3=E7=A0=81?= =?UTF-8?q?=E5=9D=97=E4=B8=AD=E7=9A=84=E4=B8=AD=E6=96=87=E5=86=92=E5=8F=B7?= =?UTF-8?q?=E4=B8=BA=E8=8B=B1=E6=96=87=E5=86=92=E5=8F=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../zh/solutions/Wear/readme.md | 142 +++++++++--------- 1 file changed, 71 insertions(+), 71 deletions(-) diff --git a/docs/Application_guide/zh/solutions/Wear/readme.md b/docs/Application_guide/zh/solutions/Wear/readme.md index a12f3cef..a94f7725 100644 --- a/docs/Application_guide/zh/solutions/Wear/readme.md +++ b/docs/Application_guide/zh/solutions/Wear/readme.md @@ -7,7 +7,7 @@ ![image-20231124092228717](../../media/solutions/Wear/image-20231124092228717.png) -穿戴行业方案使用 [LVGL](https://lvgl.io/) 绘制图形化界面，它是一个轻量级的、开源的嵌入式图形库。QuecPython 集成了 LVGL，并且使用 NXP 公司的 [GUI Guider](https://www.nxp.com/design/software/development-software/gui-guider：GUI-GUIDER) 作为图形化界面设计工具，能自动生成 QuecPython 代码，极大提高了嵌入式平台图形化界面设计的效率。 +穿戴行业方案使用 [LVGL](https://lvgl.io/) 绘制图形化界面，它是一个轻量级的、开源的嵌入式图形库。QuecPython 集成了 LVGL，并且使用 NXP 公司的 [GUI Guider](https://www.nxp.com/design/software/development-software/gui-guider:GUI-GUIDER) 作为图形化界面设计工具，能自动生成 QuecPython 代码，极大提高了嵌入式平台图形化界面设计的效率。 @@ -204,85 +204,85 @@ EventMesh 的设计框架如下图所示： # 如果添加新的界面 class **Screen 必须继承与Screen， lv.obj对象必须提前实现好 -Class DemoScreen(Screen)： +Class DemoScreen(Screen): # NAME必须， 这个是找到对应的界面跳转的唯一通道 - # 例如我们使用 EventMesh.publish("load_screen"， {"screen"： "demo_screen"}) + # 例如我们使用 EventMesh.publish("load_screen"， {"screen": "demo_screen"}) # 其中demo_screen就是去找NAME这个字段找到他 NAME = “demo_screen” - def __init__(self)： + def __init__(self): super().__init__() # 这是核心跳转对象 self.meta = app_list_screen # prop可以获取跳转信息例如， 可以获取跳转来的信息 - # EventMesh.publish("load_screen"， {"screen"： "demo_screen"， “test”：1}) - # 则此界面的prop = {"screen"： "demo_screen"， “test”：1} + # EventMesh.publish("load_screen"， {"screen": "demo_screen"， "test": 1}) + # 则此界面的prop = {"screen"： "demo_screen"， "test": 1} self.prop = None # 用户实现此接口， 会在ui.add_screen(DemoScreen())的时候调用， 只会在添加的时候执行一次 - def post_processor_after_instantiation(self， *args， **kwargs)： + def post_processor_after_instantiation(self， *args， **kwargs): """实例化后调用""" pass - # 每当EventMesh.publish("load_screen"， {"screen"： "demo_screen"})跳转到此界面 + # 每当EventMesh.publish("load_screen"， {"screen": "demo_screen"})跳转到此界面 # 会依次执行 # post_processor_before_initialization # initialization # post_processor_after_initialization # 用户可以在此实现他的功能， 因为每次跳转进来都会执行 - def post_processor_before_initialization(self， *args， **kwargs)： + def post_processor_before_initialization(self， *args， **kwargs): """初始化之前调用""" pass - def initialization(self， *args， **kwargs)： + def initialization(self， *args， **kwargs): """初始化load""" pass - def post_processor_after_initialization(self， *args， **kwargs)： + def post_processor_after_initialization(self， *args， **kwargs): """初始化之后调用""" pass # 会在离开此界面的时候执行， 比如说目前在此界面你通过下面 - # EventMesh.publish("load_screen"， {"screen"： "main_screen"}) + # EventMesh.publish("load_screen"， {"screen": "main_screen"}) # 跳转到main界面的话， 会先执行此界面的离开方法， 在执行main界面的初始化方法 - def deactivate(self， *args， **kwargs)： + def deactivate(self， *args， **kwargs): """初始化load""" pass # 注意事项， 如果界面是瓦片界面tileview的界面的话需要额外添加对应关系才能使用 -# EventMesh.publish("load_screen"， {"screen"： "main_screen"})进行跳转 +# EventMesh.publish("load_screen"， {"screen": "main_screen"})进行跳转 # 详见下列UI的类中的关系 -class UI(Abstract)： - def __init__(self)： +class UI(Abstract): + def __init__(self): self.screens = [] self.current = None # 需要在下面的map中添加瓦片的映射关系， display_screen对应的是0行0列的瓦片 # 并且跳转是不进行动画的行为的 # main_screen是1行， 0列的瓦片依次如下 self.tileview_map = { - "display_screen"： [0， 0， lv.ANIM.OFF]， - "main_screen"： [1， 0， lv.ANIM.OFF]， - "watch_face_screen"： [2， 0， lv.ANIM.OFF]， - "app_list_1_screen"： [3， 0， lv.ANIM.OFF]， - "app_list_2_screen"： [4， 0， lv.ANIM.OFF]， - "heart_screen"： [5， 0， lv.ANIM.OFF]， - "blood_screen"： [6， 0， lv.ANIM.OFF]， - "temp_screen"： [7， 0， lv.ANIM.OFF]， + "display_screen": [0， 0， lv.ANIM.OFF]， + "main_screen": [1， 0， lv.ANIM.OFF]， + "watch_face_screen": [2， 0， lv.ANIM.OFF]， + "app_list_1_screen": [3， 0， lv.ANIM.OFF]， + "app_list_2_screen": [4， 0， lv.ANIM.OFF]， + "heart_screen": [5， 0， lv.ANIM.OFF]， + "blood_screen": [6， 0， lv.ANIM.OFF]， + "temp_screen": [7， 0， lv.ANIM.OFF]， } # 这和上面界面和瓦片的关系相反 # 0行0列代表， display_screen # 依次如下 self.tileview_position_map = { - (0， 0)： "display_screen"， - (1， 0)： "main_screen"， - (2， 0)： "watch_face_screen"， - (3， 0)： "app_list_1_screen"， - (4， 0)： "app_list_2_screen"， - (5， 0)： "heart_screen"， - (6， 0)： "blood_screen"， - (7， 0)： "temp_screen"， + (0， 0): "display_screen"， + (1， 0): "main_screen"， + (2， 0): "watch_face_screen"， + (3， 0): "app_list_1_screen"， + (4， 0): "app_list_2_screen"， + (5， 0): "heart_screen"， + (6， 0): "blood_screen"， + (7， 0): "temp_screen"， } @@ -307,38 +307,38 @@ main_screen = lv_obj( 以应用列表控件的触摸为例，代码如下： ```python -class AppList1Screen(Screen)： +class AppList1Screen(Screen): NAME = "app_list_1_screen" - def __init__(self)： + def __init__(self): super().__init__() self.meta = app_list_screen self.container = app_list_cont self.profile = [ - ["U：/media/app_heart.png"， {"screen"： "blood_screen"}]， - ["U：/media/app_phone.png"， {"screen"： "dail_screen"}]， - ["U：/media/app_chat.png"， None]， - ["U：/media/app_time.png"， None] + ["U:/media/app_heart.png"， {"screen"： "blood_screen"}]， + ["U:/media/app_phone.png"， {"screen"： "dail_screen"}]， + ["U:/media/app_chat.png"， None]， + ["U:/media/app_time.png"， None] ] self.btn_list = [] self.bottom = None self.bottom_profile = [ - ["U：/media/wpoint.png"]， - ["U：/media/bpoint.png"]， - ["U：/media/bpoint.png"]， - ["U：/media/bpoint.png"] + ["U:/media/wpoint.png"]， + ["U:/media/bpoint.png"]， + ["U:/media/bpoint.png"]， + ["U:/media/bpoint.png"] ] self.bottom_btn_list = [] - def btn_click(self， event， i)： + def btn_click(self， event， i): screen_info = self.profile[i][1] - if screen_info： + if screen_info: # 在找到对应的点击事件， 跳转页面 EventMesh.publish("load_screen"， screen_info) - def post_processor_after_instantiation(self)： + def post_processor_after_instantiation(self): # 会在add_screen的时候调用进行实例化 - for i， btn_profile in enumerate(self.profile)： + for i， btn_profile in enumerate(self.profile): btn = lv_img( parent=self.container， size=(110， 110)， @@ -353,7 +353,7 @@ class AppList1Screen(Screen)： ] ) # 给每个按键添加了， 点击事件 - btn.add_event_cb(lambda event， cur=i： self.btn_click(event， cur)， lv.EVENT.CLICKED， None) + btn.add_event_cb(lambda event， cur=i: self.btn_click(event， cur)， lv.EVENT.CLICKED， None) self.btn_list.append(btn) self.bottom = lv_obj( parent=app_list_screen， @@ -369,7 +369,7 @@ class AppList1Screen(Screen)： (style_app_list， lv.PART.MAIN | lv.STATE.DEFAULT)， ]， ) - for btn_profile in self.bottom_profile： + for btn_profile in self.bottom_profile: btn = lv_img( parent=self.bottom， size=(8， 8)， @@ -385,7 +385,7 @@ class AppList1Screen(Screen)： self.bottom_btn_list.append(btn) ``` -该段代码的核心语句是 `EventMesh.publish("load_screen"， screen_info)` ，该语句发送一个名为 `"load_screen"` 的事件，意为加载新的屏幕界面；携带的消息为 `screen_info`， `screen_info`就是`{"screen"： "blood_screen"}`要跳转的界面，即屏幕界面的名称，表示加载的是血氧显示界面。 +该段代码的核心语句是 `EventMesh.publish("load_screen"， screen_info)` ，该语句发送一个名为 `"load_screen"` 的事件，意为加载新的屏幕界面；携带的消息为 `screen_info`， `screen_info`就是`{"screen": "blood_screen"}`要跳转的界面，即屏幕界面的名称，表示加载的是血氧显示界面。 @@ -396,39 +396,39 @@ class AppList1Screen(Screen)： 代码如下： ```python -class UI(Abstract)： +class UI(Abstract): - def __init__(self)： + def __init__(self): ... - def lv_load(self， event， msg)： - for screen in self.screens： - if screen.NAME == msg["screen"]： + def lv_load(self， event， msg): + for screen in self.screens: + if screen.NAME == msg["screen"]: scr = screen - if self.current != scr： - if self.current： + if self.current != scr: + if self.current: self.current.deactivate() - scr.last_screen_info = {"screen"： self.current.NAME} + scr.last_screen_info = {"screen": self.current.NAME} scr.set_prop(msg) scr.post_processor_before_initialization() scr.initialization() scr.post_processor_after_initialization() self.current = scr - if msg["screen"] in self.tileview_map： + if msg["screen"] in self.tileview_map: lv.scr_load(tileview_screen) tileview.set_tile_id(*self.tileview_map[msg['screen']]) - else： + else: lv.scr_load(self.current.meta) - def post_processor_after_instantiation(self)： + def post_processor_after_instantiation(self): EventMesh.subscribe("load_screen"， self.lv_load) EventMesh.subscribe("load_tileview"， self.lv_tileview) - def add_screen(self， screen)： + def add_screen(self， screen): screen.post_processor_after_instantiation() self.screens.append(screen) - def start(self)： + def start(self): self.post_processor_after_instantiation() ``` @@ -442,7 +442,7 @@ class UI(Abstract)： > > 细心的读者会发现，每一个屏幕界面脚本文件中实现的类中，其类下面 中，都会有类似 `NAME = "main_screen"` 的语句。该语句便记录了屏幕界面的名称。 -- `EventMesh.publish("load_screen"， {"screen"： "main_screen"})` 语句用来触发第一个界面显示，即主界面。 +- `EventMesh.publish("load_screen"， {"screen": "main_screen"})` 语句用来触发第一个界面显示，即主界面。 至此，穿戴方案的图形化界面启动完毕，后续界面的切换由用户触摸控制。 @@ -450,7 +450,7 @@ class UI(Abstract)： ### 图形化界面设计 -上文提到，QuecPython 使用 NXP 公司的 [GUI Guider](https://www.nxp.com/design/software/development-software/gui-guider：GUI-GUIDER) 作为图形化界面设计工具，该工具不仅能够进行界面布局设计，还能自动生成 QuecPython 代码。[点此查看 GUI Guider 工具的使用教程](https://python.quectel.com/doc/Application_guide/zh/multi-media/lvgl/lvgl_ui_tool.html)。 +上文提到，QuecPython 使用 NXP 公司的 [GUI Guider](https://www.nxp.com/design/software/development-software/gui-guider:GUI-GUIDER) 作为图形化界面设计工具，该工具不仅能够进行界面布局设计，还能自动生成 QuecPython 代码。[点此查看 GUI Guider 工具的使用教程](https://python.quectel.com/doc/Application_guide/zh/multi-media/lvgl/lvgl_ui_tool.html)。 下文以穿戴方案的应用为例，来介绍图形化界面的设计过程。 @@ -542,7 +542,7 @@ main_top_cont_1 = lv_obj( main_top_cont_1_img_signal = lv_img( parent=main_top_cont_1， size=(20， 20)， - src="U：/media/s4.png"， + src="U:/media/s4.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -585,7 +585,7 @@ main_top_cont_2 = lv_obj( main_top_cont_2_img_gps = lv_img( parent=main_top_cont_2， size=(20， 20)， - src="U：/media/point.png"， + src="U:/media/point.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -599,7 +599,7 @@ main_top_cont_2_img_gps = lv_img( main_top_cont_2_img_bat = lv_img( parent=main_top_cont_2， size=(20， 20)， - src="U：/media/bat4.png"， + src="U:/media/bat4.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -676,7 +676,7 @@ main_content_cont_1_hour = lv_obj( main_content_cont_1_hour_0 = lv_img( parent=main_content_cont_1_hour， size=(58， 100)， - src="U：/media/h0.png"， + src="U:/media/h0.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -689,7 +689,7 @@ main_content_cont_1_hour_0 = lv_img( main_content_cont_1_hour_1 = lv_img( parent=main_content_cont_1_hour， size=(58， 100)， - src="U：/media/h8.png"， + src="U:/media/h8.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -719,7 +719,7 @@ main_content_cont_1_m = lv_obj( main_content_cont_1_m_0 = lv_img( parent=main_content_cont_1_m， size=(58， 100)， - src="U：/media/m0.png"， + src="U:/media/m0.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， @@ -733,7 +733,7 @@ main_content_cont_1_m_0 = lv_img( main_content_cont_1_m_1 = lv_img( parent=main_content_cont_1_m， size=(58， 100)， - src="U：/media/m8.png"， + src="U:/media/m8.png"， style=[ (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， -- Gitee From fdfc135acdd108d3b5509e951113307416d54249 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dustin=20Wei=28=E9=9F=A6=E4=BC=9F=29?= Date: Mon, 6 May 2024 15:17:15 +0800 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=96=B0=E8=8B=B1=E6=96=87?= =?UTF-8?q?=E6=96=87=E6=A1=A3=E4=B8=AD=E7=9A=84=E4=B8=AD=E6=96=87=E5=86=92?= =?UTF-8?q?=E5=8F=B7=E4=B8=BA=E8=8B=B1=E6=96=87=E5=86=92=E5=8F=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/Application_guide/en/solutions/Wear/readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/Application_guide/en/solutions/Wear/readme.md b/docs/Application_guide/en/solutions/Wear/readme.md index 7642ab6a..757f0cb2 100644 --- a/docs/Application_guide/en/solutions/Wear/readme.md +++ b/docs/Application_guide/en/solutions/Wear/readme.md @@ -26,7 +26,7 @@ Components: - Hour/Minute/Second hand: Updated in real time with the current time - Background dial showing current time - Date display: The date is refreshed in real time -3. **Interactions：** +3. **Interactions:** - Swipe left on the digital dial to enter the lock screen, swipe right to enter the analog dial - Swipe left on the analog dial to enter the digital dial, swipe right to enter the app list 1 - After 30s of inactivity, the device will enter lock screen. Swipe right to unlock and enter dial -- Gitee From 6e1d298816f50383b921948ee252ebe34d41ec47 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dustin=20Wei=28=E9=9F=A6=E4=BC=9F=29?= Date: Mon, 6 May 2024 19:39:31 +0800 Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9=E7=A9=BF=E6=88=B4?= =?UTF-8?q?=E8=AE=BE=E5=A4=87=E6=96=87=E6=A1=A3=E4=BB=A3=E7=A0=81=E5=9D=97?= =?UTF-8?q?=E4=B8=AD=E7=9A=84=E9=94=99=E8=AF=AF=E7=AC=A6=E5=8F=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../en/solutions/Wear/readme.md | 11 +- .../zh/solutions/Wear/readme.md | 415 +++++++++--------- 2 files changed, 213 insertions(+), 213 deletions(-) diff --git a/docs/Application_guide/en/solutions/Wear/readme.md b/docs/Application_guide/en/solutions/Wear/readme.md index 757f0cb2..4c0de94c 100644 --- a/docs/Application_guide/en/solutions/Wear/readme.md +++ b/docs/Application_guide/en/solutions/Wear/readme.md @@ -178,14 +178,14 @@ The EventMesh design framework is shown below: Page Template and Lifecycle Example ```python -pythonCopy code# ui.py +# ui.py # Any new class **Screen must inherit from Screen. The lv_obj must be predefined. -Class DemoScreen(Screen): +class DemoScreen(Screen): # NAME is required, it is used to find the screen when switching # For example we use EventMesh.publish("load_screen", {"screen": "demo_screen"}) to find this screen - NAME = “demo_screen” + NAME = "demo_screen" def __init__(self): super().__init__() # meta is the core switching object @@ -299,6 +299,7 @@ class UI(Abstract): for screen in self.screens: if screen.NAME == msg["screen"]: # Switch logic + pass def start(self): # Subscribe event @@ -373,7 +374,7 @@ This section focuses on drawing the main dial page to demonstrate layout and qui Implementation: ```python -pythonCopy code# Styles from css.py +# Styles from css.py # Main page main_screen = lv_obj( @@ -460,7 +461,7 @@ main_top_cont_2_img_bat = lv_img( - Flex layout, vertical axis ```python -pythonCopy code# ... main_screen +# ... main_screen # Create time section main_content_cont_1 = lv_obj( diff --git a/docs/Application_guide/zh/solutions/Wear/readme.md b/docs/Application_guide/zh/solutions/Wear/readme.md index a94f7725..775be547 100644 --- a/docs/Application_guide/zh/solutions/Wear/readme.md +++ b/docs/Application_guide/zh/solutions/Wear/readme.md @@ -204,54 +204,54 @@ EventMesh 的设计框架如下图所示： # 如果添加新的界面 class **Screen 必须继承与Screen， lv.obj对象必须提前实现好 -Class DemoScreen(Screen): +class DemoScreen(Screen): # NAME必须， 这个是找到对应的界面跳转的唯一通道 - # 例如我们使用 EventMesh.publish("load_screen"， {"screen": "demo_screen"}) + # 例如我们使用 EventMesh.publish("load_screen", {"screen": "demo_screen"}) # 其中demo_screen就是去找NAME这个字段找到他 - NAME = “demo_screen” + NAME = "demo_screen" def __init__(self): super().__init__() # 这是核心跳转对象 self.meta = app_list_screen # prop可以获取跳转信息例如， 可以获取跳转来的信息 - # EventMesh.publish("load_screen"， {"screen": "demo_screen"， "test": 1}) - # 则此界面的prop = {"screen"： "demo_screen"， "test": 1} + # EventMesh.publish("load_screen", {"screen": "demo_screen", "test": 1}) + # 则此界面的prop = {"screen"： "demo_screen", "test": 1} self.prop = None # 用户实现此接口， 会在ui.add_screen(DemoScreen())的时候调用， 只会在添加的时候执行一次 - def post_processor_after_instantiation(self， *args， **kwargs): + def post_processor_after_instantiation(self, *args, **kwargs): """实例化后调用""" pass - # 每当EventMesh.publish("load_screen"， {"screen": "demo_screen"})跳转到此界面 + # 每当EventMesh.publish("load_screen", {"screen": "demo_screen"})跳转到此界面 # 会依次执行 # post_processor_before_initialization # initialization # post_processor_after_initialization # 用户可以在此实现他的功能， 因为每次跳转进来都会执行 - def post_processor_before_initialization(self， *args， **kwargs): + def post_processor_before_initialization(self, *args, **kwargs): """初始化之前调用""" pass - def initialization(self， *args， **kwargs): + def initialization(self, *args, **kwargs): """初始化load""" pass - def post_processor_after_initialization(self， *args， **kwargs): + def post_processor_after_initialization(self, *args, **kwargs): """初始化之后调用""" pass # 会在离开此界面的时候执行， 比如说目前在此界面你通过下面 - # EventMesh.publish("load_screen"， {"screen": "main_screen"}) + # EventMesh.publish("load_screen", {"screen": "main_screen"}) # 跳转到main界面的话， 会先执行此界面的离开方法， 在执行main界面的初始化方法 - def deactivate(self， *args， **kwargs): + def deactivate(self, *args, **kwargs): """初始化load""" pass # 注意事项， 如果界面是瓦片界面tileview的界面的话需要额外添加对应关系才能使用 -# EventMesh.publish("load_screen"， {"screen": "main_screen"})进行跳转 +# EventMesh.publish("load_screen", {"screen": "main_screen"})进行跳转 # 详见下列UI的类中的关系 class UI(Abstract): @@ -262,42 +262,42 @@ class UI(Abstract): # 并且跳转是不进行动画的行为的 # main_screen是1行， 0列的瓦片依次如下 self.tileview_map = { - "display_screen": [0， 0， lv.ANIM.OFF]， - "main_screen": [1， 0， lv.ANIM.OFF]， - "watch_face_screen": [2， 0， lv.ANIM.OFF]， - "app_list_1_screen": [3， 0， lv.ANIM.OFF]， - "app_list_2_screen": [4， 0， lv.ANIM.OFF]， - "heart_screen": [5， 0， lv.ANIM.OFF]， - "blood_screen": [6， 0， lv.ANIM.OFF]， - "temp_screen": [7， 0， lv.ANIM.OFF]， + "display_screen": [0, 0, lv.ANIM.OFF], + "main_screen": [1, 0, lv.ANIM.OFF], + "watch_face_screen": [2, 0, lv.ANIM.OFF], + "app_list_1_screen": [3, 0, lv.ANIM.OFF], + "app_list_2_screen": [4, 0, lv.ANIM.OFF], + "heart_screen": [5, 0, lv.ANIM.OFF], + "blood_screen": [6, 0, lv.ANIM.OFF], + "temp_screen": [7, 0, lv.ANIM.OFF], } # 这和上面界面和瓦片的关系相反 # 0行0列代表， display_screen # 依次如下 self.tileview_position_map = { - (0， 0): "display_screen"， - (1， 0): "main_screen"， - (2， 0): "watch_face_screen"， - (3， 0): "app_list_1_screen"， - (4， 0): "app_list_2_screen"， - (5， 0): "heart_screen"， - (6， 0): "blood_screen"， - (7， 0): "temp_screen"， + (0, 0): "display_screen", + (1, 0): "main_screen", + (2, 0): "watch_face_screen", + (3, 0): "app_list_1_screen", + (4, 0): "app_list_2_screen", + (5, 0): "heart_screen", + (6, 0): "blood_screen", + (7, 0): "temp_screen", } # 什么是瓦片， 比如说， 以下是静态界面tile1瓦片位置在1行0列位置， 支持右滑左滑的模式 -tile1 = tileview.add_tile(1， 0， lv.DIR.RIGHT | lv.DIR.LEFT) -# main_screen放置在tile1的瓦片上， 则屏幕左滑会进入到(0，0)的瓦片上右滑会进入(2， 0)的瓦片上 +tile1 = tileview.add_tile(1, 0, lv.DIR.RIGHT | lv.DIR.LEFT) +# main_screen放置在tile1的瓦片上， 则屏幕左滑会进入到(0, 0)的瓦片上右滑会进入(2, 0)的瓦片上 main_screen = lv_obj( - parent=tile1， - size=(240， 280)， + parent=tile1, + size=(240, 280), style=[ - (style_main_screen， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - ]， + (style_main_screen, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + ] ) ``` @@ -315,77 +315,77 @@ class AppList1Screen(Screen): self.meta = app_list_screen self.container = app_list_cont self.profile = [ - ["U:/media/app_heart.png"， {"screen"： "blood_screen"}]， - ["U:/media/app_phone.png"， {"screen"： "dail_screen"}]， - ["U:/media/app_chat.png"， None]， - ["U:/media/app_time.png"， None] + ["U:/media/app_heart.png", {"screen": "blood_screen"}], + ["U:/media/app_phone.png", {"screen": "dail_screen"}], + ["U:/media/app_chat.png", None], + ["U:/media/app_time.png", None] ] self.btn_list = [] self.bottom = None self.bottom_profile = [ - ["U:/media/wpoint.png"]， - ["U:/media/bpoint.png"]， - ["U:/media/bpoint.png"]， + ["U:/media/wpoint.png"], + ["U:/media/bpoint.png"], + ["U:/media/bpoint.png"], ["U:/media/bpoint.png"] ] self.bottom_btn_list = [] - def btn_click(self， event， i): + def btn_click(self, event, i): screen_info = self.profile[i][1] if screen_info: # 在找到对应的点击事件， 跳转页面 - EventMesh.publish("load_screen"， screen_info) + EventMesh.publish("load_screen", screen_info) def post_processor_after_instantiation(self): # 会在add_screen的时候调用进行实例化 - for i， btn_profile in enumerate(self.profile): + for i, btn_profile in enumerate(self.profile): btn = lv_img( - parent=self.container， - size=(110， 110)， - src=btn_profile[0]， - flag=lv.obj.FLAG.CLICKABLE， + parent=self.container, + size=(110, 110), + src=btn_profile[0], + flag=lv.obj.FLAG.CLICKABLE, style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 给每个按键添加了， 点击事件 - btn.add_event_cb(lambda event， cur=i: self.btn_click(event， cur)， lv.EVENT.CLICKED， None) + btn.add_event_cb(lambda event, cur=i: self.btn_click(event, cur), lv.EVENT.CLICKED, None) self.btn_list.append(btn) self.bottom = lv_obj( - parent=app_list_screen， - pos=(88， 254)， - size=(56， 8)， - flex_flow=lv.FLEX_FLOW.ROW， - flex_align=(lv.FLEX_ALIGN.SPACE_AROUND， lv.FLEX_ALIGN.START， lv.FLEX_ALIGN.START)， + parent=app_list_screen, + pos=(88, 254), + size=(56, 8), + flex_flow=lv.FLEX_FLOW.ROW, + flex_align=(lv.FLEX_ALIGN.SPACE_AROUND, lv.FLEX_ALIGN.START, lv.FLEX_ALIGN.START), style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_pad_default， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_app_list， lv.PART.MAIN | lv.STATE.DEFAULT)， - ]， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_pad_default, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_app_list, lv.PART.MAIN | lv.STATE.DEFAULT), + ] ) for btn_profile in self.bottom_profile: btn = lv_img( - parent=self.bottom， - size=(8， 8)， - src=btn_profile[0]， + parent=self.bottom, + size=(8, 8), + src=btn_profile[0], style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) self.bottom_btn_list.append(btn) ``` -该段代码的核心语句是 `EventMesh.publish("load_screen"， screen_info)` ，该语句发送一个名为 `"load_screen"` 的事件，意为加载新的屏幕界面；携带的消息为 `screen_info`， `screen_info`就是`{"screen": "blood_screen"}`要跳转的界面，即屏幕界面的名称，表示加载的是血氧显示界面。 +该段代码的核心语句是 `EventMesh.publish("load_screen", screen_info)` ，该语句发送一个名为 `"load_screen"` 的事件，意为加载新的屏幕界面；携带的消息为 `screen_info`， `screen_info`就是`{"screen": "blood_screen"}`要跳转的界面，即屏幕界面的名称，表示加载的是血氧显示界面。 @@ -401,7 +401,7 @@ class UI(Abstract): def __init__(self): ... - def lv_load(self， event， msg): + def lv_load(self, event, msg): for screen in self.screens: if screen.NAME == msg["screen"]: scr = screen @@ -421,10 +421,10 @@ class UI(Abstract): lv.scr_load(self.current.meta) def post_processor_after_instantiation(self): - EventMesh.subscribe("load_screen"， self.lv_load) - EventMesh.subscribe("load_tileview"， self.lv_tileview) + EventMesh.subscribe("load_screen", self.lv_load) + EventMesh.subscribe("load_tileview", self.lv_tileview) - def add_screen(self， screen): + def add_screen(self, screen): screen.post_processor_after_instantiation() self.screens.append(screen) @@ -442,7 +442,7 @@ class UI(Abstract): > > 细心的读者会发现，每一个屏幕界面脚本文件中实现的类中，其类下面 中，都会有类似 `NAME = "main_screen"` 的语句。该语句便记录了屏幕界面的名称。 -- `EventMesh.publish("load_screen"， {"screen": "main_screen"})` 语句用来触发第一个界面显示，即主界面。 +- `EventMesh.publish("load_screen", {"screen": "main_screen"})` 语句用来触发第一个界面显示，即主界面。 至此，穿戴方案的图形化界面启动完毕，后续界面的切换由用户触摸控制。 @@ -492,120 +492,120 @@ class UI(Abstract): # 创建一个主页面 main_screen = lv_obj( - size=(240， 280)， + size=(240, 280), style=[ - (style_main_screen， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - ]， + (style_main_screen, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + ] ) # 设置头部栏 main_top = lv_obj( - parent=main_screen， + parent=main_screen, # 大小是240px * 34px - size=(240， 34)， + size=(240, 34), # flex_flow 为flex， row水平布局 - flex_flow=lv.FLEX_FLOW.ROW， + flex_flow=lv.FLEX_FLOW.ROW, # 主轴是space_between， 其他轴底部对齐 - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN, lv.FLEX_ALIGN.END, lv.FLEX_ALIGN.END), style=[ - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_header， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_header, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), # padding我们采用了style设置 - (style_bar_top_main， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_bar_top_main, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 盒子1 main_top_cont_1 = lv_obj( # 盒子一是在头部栏里面的， 设置父节点是main_top - parent=main_top， + parent=main_top, # 大小是88 * 20px - size=(88， 20)， - flex_flow=lv.FLEX_FLOW.ROW， - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + size=(88, 20), + flex_flow=lv.FLEX_FLOW.ROW, + flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN, lv.FLEX_ALIGN.END, lv.FLEX_ALIGN.END), style=[ - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), # 这里设置了main_top_cont_1中设置了gap间距为4 - (style_main_top_cont_1， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_main_top_cont_1, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 信号图片父节点是盒子1 main_top_cont_1_img_signal = lv_img( - parent=main_top_cont_1， - size=(20， 20)， - src="U:/media/s4.png"， + parent=main_top_cont_1, + size=(20, 20), + src="U:/media/s4.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 运营商父节点是盒子1 main_top_cont_1_label_operator = lv_label( - parent=main_top_cont_1， - size=(64， 19)， - text="中国移动"， + parent=main_top_cont_1, + size=(64, 19), + text="中国移动", style=[ - (style_font_16， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_font_grey， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_font_16, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_font_grey, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 盒子2 main_top_cont_2 = lv_obj( - parent=main_top， - size=(48， 20)， - flex_flow=lv.FLEX_FLOW.ROW， - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + parent=main_top, + size=(48, 20), + flex_flow=lv.FLEX_FLOW.ROW, + flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN, lv.FLEX_ALIGN.END, lv.FLEX_ALIGN.END), style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 导航图片父节点是盒子2 main_top_cont_2_img_gps = lv_img( - parent=main_top_cont_2， - size=(20， 20)， - src="U:/media/point.png"， + parent=main_top_cont_2, + size=(20, 20), + src="U:/media/point.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 电池电量图片父节点是盒子2 main_top_cont_2_img_bat = lv_img( - parent=main_top_cont_2， - size=(20， 20)， - src="U:/media/bat4.png"， + parent=main_top_cont_2, + size=(20, 20), + src="U:/media/bat4.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) @@ -641,105 +641,104 @@ main_top_cont_2_img_bat = lv_img( # 创建时间盒子 main_content_cont_1 = lv_obj( - parent=main_screen， - size=(116， 200)， + parent=main_screen, + size=(116, 200), # 定位为左19， 右64， 基于父界面 - pos=(19， 64)， + pos=(19, 64), # 纵轴方向flex布局 - flex_flow=lv.FLEX_FLOW.COLUMN， - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + flex_flow=lv.FLEX_FLOW.COLUMN, + flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN, lv.FLEX_ALIGN.END, lv.FLEX_ALIGN.END), style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT) + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT) ] ) # 创建盒子1 main_content_cont_1_hour = lv_obj( - parent=main_content_cont_1， - size=(116， 100)， + parent=main_content_cont_1, + size=(116, 100), # 水平布局 - flex_flow=lv.FLEX_FLOW.ROW， - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + flex_flow=lv.FLEX_FLOW.ROW, + flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN, lv.FLEX_ALIGN.END, lv.FLEX_ALIGN.END), style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 盒子1中时钟图片1 main_content_cont_1_hour_0 = lv_img( - parent=main_content_cont_1_hour， - size=(58， 100)， - src="U:/media/h0.png"， + parent=main_content_cont_1_hour, + size=(58, 100), + src="U:/media/h0.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) + # 盒子1中时钟图片2 main_content_cont_1_hour_1 = lv_img( - parent=main_content_cont_1_hour， - size=(58， 100)， - src="U:/media/h8.png"， + parent=main_content_cont_1_hour, + size=(58, 100), + src="U:/media/h8.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 创建盒子2由于父节点盒子是flex纵节点布局， 可以分布到盒子适当位置 main_content_cont_1_m = lv_obj( - parent=main_content_cont_1， - size=(116， 100)， - # 当前盒子水平布局 - flex_flow=lv.FLEX_FLOW.ROW， - flex_align=(lv.FLEX_ALIGN.SPACE_BETWEEN， lv.FLEX_ALIGN.END， lv.FLEX_ALIGN.END)， + parent=main_content_cont_1, + size=(116, 100), style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_flex_raw_between, lv.PART.MAIN | lv.STATE.DEFAULT) ] ) # 盒子2创建分钟图片0 main_content_cont_1_m_0 = lv_img( - parent=main_content_cont_1_m， - size=(58， 100)， - src="U:/media/m0.png"， + parent=main_content_cont_1_m, + size=(58, 100), + src="U:/media/m0.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) # 盒子2创建分钟图片1 main_content_cont_1_m_1 = lv_img( - parent=main_content_cont_1_m， - size=(58， 100)， - src="U:/media/m8.png"， + parent=main_content_cont_1_m, + size=(58, 100), + src="U:/media/m8.png", style=[ - (style_cont， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.DEFAULT)， - (style_list_scrollbar， lv.PART.SCROLLBAR | lv.STATE.SCROLLED)， - (style_gap_default， lv.PART.MAIN | lv.STATE.DEFAULT)， - (style_pad_default， lv.PART.MAIN | lv.STATE.DEFAULT)， + (style_cont, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.DEFAULT), + (style_list_scrollbar, lv.PART.SCROLLBAR | lv.STATE.SCROLLED), + (style_gap_default, lv.PART.MAIN | lv.STATE.DEFAULT), + (style_pad_default, lv.PART.MAIN | lv.STATE.DEFAULT), ] ) ``` -- Gitee