榆树风格元素与动态风格

Question

我使用Elm style-elements编写了一个小仪表板。现在我想根据模型属性确定一个样式属性（Color.background），但我无法弄清楚如何做到这一点（如果可能的话） ）。

我使用Ellie写了small sample app来展示我想要达到的目标。以下是包含相关详细信息的屏幕截图。

在第48行，我定义了一个带有bg颜色的样式。 red 组件不应该是硬编码的，而应该来自模型。模型本身只是一个Int，表示红色的数量。

可以这样做，如果是，怎么做？

Answer 1

当然，只需将模型传递给stylesheet函数：

stylesheet : Model -> StyleSheet MyStyles variation
stylesheet model =
    Style.styleSheet
        [ Style.style PageStyle []
        , Style.style EltStyle [ Color.background (rgba model.red 128 128 255) ]
        , Style.style FieldStyle [ Color.border grey, Border.all 1 ]
        ]

你像这样传递model：

view : Model -> Html Msg
view model =
    Element.layout (stylesheet model) <|
        ...