Skip to content

Latest commit

 

History

History
58 lines (49 loc) · 1.86 KB

custom_theme_facebook.adoc

File metadata and controls

58 lines (49 loc) · 1.86 KB
Raw
创建 Facebook 主题

以下是创建基于 Halo 的 Facebook 主题的示例，该主题风格类似流行的社交网络界面。

  1. 在 CUBA Studio 中，点击 CUBA > Advanced > Manage themes > Create custom theme。设置主题名称 - facebook，选择 halo 作为基础主题，然后单击 Create。在项目中将创建新的主题目录：

    link:../../../../../../source/gui/themes/themes_25.scss[role=include]

    styles.scss 文件包含主题列表：

    link:../../../../../../source/gui/themes/themes_7.scss[role=include]

    facebook.scss 文件:

    link:../../../../../../source/gui/themes/themes_8.scss[role=include]

    com.haulmont.cuba 中的 app-component.scss 文件：

    link:../../../../../../source/gui/themes/themes_24.scss[role=include]

  2. 修改 facebook-defaults.scss 中的主题变量。可以通过在 Studio 中单击 Manage themes > Edit Facebook theme variables 或在 IDE 中执行此操作：

    link:../../../../../../source/gui/themes/themes_9.scss[role=include]

  3. web 模块的 src 目录中的 facebook-theme.properties 文件可用于覆盖服务端使用的平台的 halo-theme.properties 文件中的主题变量。

  4. 新主题已被自动添加到 web-app.properties 文件中：

    cuba.web.theme = facebook
cuba.themeConfig = com/haulmont/cuba/halo-theme.properties /com/company/application/web/facebook-theme.properties

    cuba.themeConfig 属性定义了应用程序的 Settings 菜单中可供用户使用的主题。

重新构建应用程序并启动服务。现在，用户将在首次登录时看到使用 Facebook 主题的应用程序，并且可以在 Help > Settings 菜单中选择 Facebook、Halo 和 Havana 主题。

facebook theme