规范 - 如何更改演示者的颜色（或背景颜色）

Question

我想更改SpTextInputFieldPresenter的背景颜色

例如，为了提供输入的视觉反馈，我想对whenTextChangedDo:做出反应，并更改字段的背景颜色以显示输入是正确还是错误。 我知道这对每个人来说都不是最好的，但我仍然想尝试一下。
没有黑客怎么办？

Answer 1

Spec 预览了使用 styles 来更改（在一定程度上）组件的外观。 Styles 被添加到应用程序（ SpApplication的一个实例或它的子级），并且可以由作为应用程序一部分的任何演示者使用。
Styles can be seen as CSS stylesheets, and in the case of Gtk they actually are CSS stylesheets, but in the case of Morphic backend they have a complete different implementation (you can see all properties you can define in the SpPropertyStyle hierarchy.

下面的代码将展示如何

• 声明 styles（以脚本方式，在生产场景中 styles 可能会在应用程序的配置中定义）。
• 通过添加或删除它们来使用它们。

app := SpApplication new.

"If using Morphic"
app addStyleSheetFromString: '.application [
    .red [ Draw { #color: #red } ],
    .green [ Draw { #color: #green } ]  
]'.

"If using GTK (you need to choose one, both options are not possible at the same time)"
app useBackend: #Gtk.
app addCSSProviderFromString: '
.red { background-color: red }
.green { background-color: green }  
'.
 
presenter := SpPresenter new.
presenter application: app.

presenter layout: (SpBoxLayout newTopToBottom
    add: (textPresenter := presenter newTextInput) expand: false;
    addLast: (SpBoxLayout newLeftToRight 
            add: (presenter newButton
                label: 'Red';
                action: [ textPresenter removeStyle: 'green'; addStyle: 'red' ];
                yourself);
            add: (presenter newButton
                label: 'Green';
                action: [ textPresenter removeStyle: 'red'; addStyle: 'green' ];
                yourself);
            yourself)
        expand: false;
    yourself).
    
presenter asWindow 
    title: 'Example applying styles';
    open

这将产生（使用 Gtk3 后端）这个 output：