#979

Author: mvladic

packages/project-editor/lvgl/widgets/Base.tsx

@@ -79,8 +79,7 @@ import { validators } from "eez-studio-shared/validation";
 import {
     getLvglCoord,
     getLvglEvents,
-    getLvglFlagCodes,
-    getLvglStylePropName
+    getLvglFlagCodes
 } from "project-editor/lvgl/lvgl-versions";
 import {
     LVGL_FLAG_CODES,
@@ -1625,18 +1624,6 @@ export class LVGLWidget extends Widget {
         }
     }
 
-    buildStyleIfNotDefinedInCode(code: LVGLCode, propertyInfo: LVGLPropertyInfo) {
-        if (this.localStyles.getPropertyValue(propertyInfo, "MAIN", "DEFAULT") == undefined) {
-            const stylePropName = getLvglStylePropName(code.project, propertyInfo.name);
-
-            code.callObjectFunction(
-                `lv_obj_set_style_${stylePropName}`,
-                0,
-                code.or(code.constant("LV_PART_MAIN"), code.constant("LV_STATE_DEFAULT"))
-            );
-        }
-    }
-
     ////////////////////////////////////////////////////////////////////////////////
     ////////////////////////////////////////////////////////////////////////////////
     ////////////////////////////////////////////////////////////////////////////////

packages/project-editor/lvgl/widgets/Container.tsx

@@ -5,7 +5,8 @@ import {
     IMessage,
     MessageType,
     makeDerivedClassInfo,
-    LVGLParts
+    LVGLParts,
+    PropertyType
 } from "project-editor/core/object";
 
 import { ProjectType } from "project-editor/project/project";
@@ -17,15 +18,6 @@ import { getLvglParts } from "../lvgl-versions";
 import { Rect } from "eez-studio-shared/geometry";
 import { AutoSize } from "project-editor/flow/component";
 import { IResizeHandler } from "project-editor/flow/flow-interfaces";
-import {
-    bg_opa_property_info,
-    border_width_property_info,
-    pad_bottom_property_info,
-    pad_left_property_info,
-    pad_right_property_info,
-    pad_top_property_info,
-    radius_property_info
-} from "../style-catalog";
 import type { LVGLCode } from "project-editor/lvgl/to-lvgl-code";
 
 ////////////////////////////////////////////////////////////////////////////////
@@ -55,14 +47,67 @@ export class LVGLContainerWidget extends LVGLWidget {
 
         componentPaletteGroupName: "!1Basic",
 
-        properties: [],
+        properties: [
+            {
+                name: "containerVersion",
+                type: PropertyType.Number,
+                hideInPropertyGrid: true,
+                hideInDocumentation: "all"
+            }
+        ],
 
         defaultValue: {
             left: 0,
             top: 0,
             width: 300,
             height: 200,
-            clickableFlag: true
+            clickableFlag: true,
+            localStyles: {
+                definition: {
+                    MAIN: {
+                        DEFAULT: {
+                            pad_left: 0,
+                            pad_top: 0,
+                            pad_right: 0,
+                            pad_bottom: 0,
+                            bg_opa: 0,
+                            border_width: 0,
+                            radius: 0
+                        }
+                    }
+                }
+            },
+            containerVersion: 1
+        },
+
+        beforeLoadHook: (object, jsObject) => {
+            if (jsObject.containerVersion == undefined) {
+                const definition = LVGLContainerWidget.classInfo.defaultValue.localStyles.definition;
+
+                Object.keys(definition).forEach(part => {
+                    Object.keys(definition[part]).forEach(state => {
+                        Object.keys(definition[part][state]).forEach(propertyName => {
+                            if (jsObject.localStyles?.definition?.[part]?.[state]?.[propertyName] == undefined) {
+                                if (!jsObject.localStyles) {
+                                    jsObject.localStyles = {};
+                                }
+                                if (!jsObject.localStyles.definition) {
+                                    jsObject.localStyles.definition = {};
+                                }
+                                if (!jsObject.localStyles.definition[part]) {
+                                    jsObject.localStyles.definition[part] = {};
+                                }
+                                if (!jsObject.localStyles.definition[part][state]) {
+                                    jsObject.localStyles.definition[part][state] = {};
+                                }
+                                jsObject.localStyles.definition[part][state][propertyName] = definition[part][state][propertyName];
+                            }
+                        });
+                    });
+                });
+
+                jsObject.containerVersion = 1;
+            }
         },
 
         check: (widget: LVGLTabviewWidget, messages: IMessage[]) => {
@@ -237,13 +282,5 @@ export class LVGLContainerWidget extends LVGLWidget {
         }
 
         code.createObject(`lv_obj_create`);
-
-        this.buildStyleIfNotDefinedInCode(code, pad_left_property_info);
-        this.buildStyleIfNotDefinedInCode(code, pad_top_property_info);
-        this.buildStyleIfNotDefinedInCode(code, pad_right_property_info);
-        this.buildStyleIfNotDefinedInCode(code, pad_bottom_property_info);
-        this.buildStyleIfNotDefinedInCode(code, bg_opa_property_info);
-        this.buildStyleIfNotDefinedInCode(code, border_width_property_info);
-        this.buildStyleIfNotDefinedInCode(code, radius_property_info);
     }
 }