State
States for a given Component are the union of all arguments annotated with State in the spec. While both Prop and State hold information that influences the output of the component, they are different in one important way: props get passed to the component from its parent whereas states are managed within the component.
The initial values of states can be set using the OnCreateInitialState method and states can be updated in OnUpdateState methods. Updating states in the methods will cause the component to invoke its OnCreateLayout method. States should be immutable since the layout can be calculated on multiple threads. Immutability of the states ensures that no thread safety issues can occur in the component hierarchy.
Using State:
@LayoutSpec
public class CounterSpec {
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@State int count) {
return Row.create(c)
.backgroundColor(Color.WHITE)
.heightDip(64)
.paddingDip(YogaEdge.ALL, 8)
.child(
Text.create(c)
.text(" + ")
.clickHandler(Counter.onClick(c))
)
.child(
Text.create(c)
.text(String.valueOf(count))
)
.build();
}
@OnCreateInitialState
static void onCreateInitialState(
ComponentContext c,
StateValue<Integer> count) {
count.set(0);
}
@OnEvent(ClickEvent.class)
static void onClick(ComponentContext c) {
Counter.increment(c);
}
@OnUpdateState
static void increment(StateValue<Integer> count) {
count.set(count.get() + 1);
}
}Content copied to clipboard