【问题标题】:styling in react native反应原生的样式
【发布时间】:2018-02-28 17:08:33
【问题描述】:

我参与了一个项目,有几个人在做一个 React Native 项目。

我需要找到一种方法将样式任务与代码分开,这样 UI 开发就可以在不需要代码开发人员的情况下工作(在我看来,样式是定义 UI 结构的人,将组件放置在屏幕上,并定义它们的颜色和视觉表示)。

我的问题是:

  • 样式开发人员是否可以使用任何工具来创建样式并导出合适的文件以包含到项目中?
  • 如何确保两个团队的工作不会重复其他团队的工作?我来自 WPF 和 Web 开发,在那个系统中,UI 和代码之间有很好的分离。例如,在MVVM中,造型师和编码员应该唯一的约定就是组件的名称,造型师可以制作所有样式,编码员可以在不重复工作的情况下完成所有编码(我知道这过于简化了, 但是这个概念是存在的,一个好的团队可以使用它)。在 Web 开发中,造型师创建 HTML 和 CSS,编码器使用 angolarJS 或 JQuery 来控制组件并附加到它们的事件。
  • 在我们的样式团队中,我们正在使用 skitch,这个工具可以为 react native 生成​​合适的样式代码吗?如果是,工作流程是什么?

  • 关于如何在 React Native 中最好地将样式与编码分开的任何其他建议。

【问题讨论】:

  • 有像 BuilderX.io 这样的工具旨在做到这一点。将此作为评论而不是答案发布,因为我没有真正使用过,也不能根据经验推荐它。

标签: css user-interface react-native styles


【解决方案1】:

我没有这个问题的最佳答案,但我可以根据我的经验为您提供一些反馈和提示。

为了像在 MVVM 中那样分离 UI 和业务代码,您可以将类分离为

  1. Container 类(处理所有业务逻辑)和
  2. View 类(仅负责展示),样式定义为一个单独的类,可以使用一些通用主题提供者

可以有多个视图类(iOs、Android,如果可能是 Web),但它们都将使用主容器类进行业务逻辑(更多详细信息请参阅第一个链接)

参考:

对于样式,您可以选择一些将通用主题作为对象的主题提供程序类。编码器可以在组件中使用这些样式。主题将在根类中与提供者一起定义。如果您仔细重用这些样式,则只需在一处更新样式即可更新所有样式。还支持深色和浅色主题。

参考:

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-07-27
    • 1970-01-01
    • 2019-03-05
    • 2022-01-17
    • 2021-10-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多