com.facebook.yoga.YogaAlign Java Examples
The following examples show how to use
com.facebook.yoga.YogaAlign.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
| Source File: HorizontalScrollRootComponentSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c, @State ImmutableList<Pair<String, Integer>> items) {
return Column.create(c)
.child(
Row.create(c)
.paddingDip(YogaEdge.VERTICAL, 10)
.child(
Text.create(c)
.paddingDip(YogaEdge.RIGHT, 10)
.alignSelf(YogaAlign.CENTER)
.clickHandler(HorizontalScrollRootComponent.onClick(c, true))
.text("PREPEND")
.textSizeSp(20))
.child(
Text.create(c)
.paddingDip(YogaEdge.LEFT, 10)
.alignSelf(YogaAlign.CENTER)
.clickHandler(HorizontalScrollRootComponent.onClick(c, false))
.text("APPEND")
.textSizeSp(20)))
.child(HorizontalScroll.create(c).contentProps(createHorizontalScrollChildren(c, items)))
.build();
}
Example #2
| Source File: PathExampleComponentSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@State DynamicValue<Float> translationX,
@State DynamicValue<Float> translationY) {
return Column.create(c)
.alignItems(YogaAlign.CENTER)
.justifyContent(YogaJustify.CENTER)
.paddingDip(YogaEdge.ALL, 50)
.child(
// Create the component we will animate. Apply the DynamicValues to it.
Text.create(c)
.text("\u26BE")
.textSizeSp(50)
.translationX(translationX)
.translationY(translationY))
.visibleHandler(ContinuousExampleComponent.onVisible(c))
.build();
}
Example #3
| Source File: HorizontalScrollRootComponentSpec.java From litho with Apache License 2.0 | 6 votes |
|
private static Component createHorizontalScrollChildren(
ComponentContext c, List<Pair<String, Integer>> items) {
final Row.Builder rowBuilder = Row.create(c);
for (Pair<String, Integer> colorItem : items) {
rowBuilder.child(
Row.create(c)
.paddingDip(YogaEdge.ALL, 10)
.backgroundColor(colorItem.second)
.child(
Text.create(c)
.text(colorItem.first)
.textSizeSp(20)
.alignSelf(YogaAlign.CENTER)
.heightDip(100)));
}
return rowBuilder.build();
}
Example #4
| Source File: TreePropTestParentSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop TreePropTestResult resultPropALeaf1,
@Prop TreePropTestResult resultPropBLeaf1,
@Prop TreePropTestResult resultPropBLeaf2,
@Prop TreePropTestResult resultPropAMount) {
return Column.create(c)
.flexShrink(0)
.alignContent(YogaAlign.FLEX_START)
.child(
TreePropTestMiddle.create(c)
.resultPropALeaf1(resultPropALeaf1)
.resultPropBLeaf1(resultPropBLeaf1))
.child(TreePropTestMount.create(c).resultPropA(resultPropAMount))
.child(TreePropTestLeaf.create(c).resultPropB(resultPropBLeaf2))
.build();
}
Example #5
| Source File: InternalNodeTest.java From litho with Apache License 2.0 | 6 votes |
|
@Test
public void testContextSpecificComponentAssertionFailFormatting() {
final ComponentsLogger componentsLogger = mock(ComponentsLogger.class);
final PerfEvent perfEvent = mock(PerfEvent.class);
when(componentsLogger.newPerformanceEvent((ComponentContext) any(), anyInt()))
.thenReturn(perfEvent);
InternalNode node = acquireInternalNodeWithLogger(componentsLogger);
node.alignSelf(YogaAlign.AUTO);
node.flex(1f);
node.assertContextSpecificStyleNotSet();
assertThat(mComponentsReporter.getLoggedMessages())
.contains(
new Pair<>(
ComponentsReporter.LogLevel.WARNING,
"You should not set alignSelf, flex to a root layout in Column"));
}
Example #6
| Source File: ComponentWithinMountedComponentMovesTransitionSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State boolean shouldAlignStart) {
return Column.create(c)
.paddingDip(YogaEdge.ALL, 20)
.child(
Row.create(c)
.alignItems(shouldAlignStart ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.heightDip(SIZE_DP)
.widthDip(SIZE_DP)
.backgroundColor(Color.RED)
.alpha(
new DynamicValue<Float>(.99f)) // Set a dynamic value to force it to be mounted
.child(Row.create(c).heightDip(10).widthDip(10).backgroundColor(Color.BLUE)))
.clickHandler(SingleComponentMovesTransition.onClick(c))
.build();
}
Example #7
| Source File: DecadeSeparatorSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @Prop final Decade decade) {
return Row.create(c)
.alignItems(YogaAlign.CENTER)
.paddingDip(YogaEdge.ALL, 16)
.child(Row.create(c).heightPx(1).backgroundColor(0xFFAAAAAA).flex(1))
.child(
Text.create(c)
.text(String.valueOf(decade.year))
.textSizeDip(14)
.textColor(0xFFAAAAAA)
.marginDip(YogaEdge.HORIZONTAL, 10)
.flex(0))
.child(Row.create(c).heightPx(1).backgroundColor(0xFFAAAAAA).flex(1))
.backgroundColor(0xFFFAFAFA)
.build();
}
Example #8
| Source File: BlocksSameTransitionKeyComponentSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@State boolean state,
@State boolean running,
@State Set<String> runningAnimations) {
return Column.create(c)
.child(Row.create(c).child(Text.create(c).text(running ? "RUNNING" : "STOPPED")))
.child(
Column.create(c)
.alignItems(!state ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Text.create(c)
.heightDip(50)
.widthDip(50)
.text(runningAnimations.toString())
.backgroundColor(Color.parseColor("#ee1111"))
.alpha(!state ? 1.0f : 0.2f)
.transitionKey(TRANSITION_KEY)
.build()))
.clickHandler(BlocksSameTransitionKeyComponent.onClick(c))
.build();
}
Example #9
| Source File: AnimationStateExampleComponentSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c, @State boolean shouldAlignStart, @State String actualPosition) {
return Column.create(c)
.paddingDip(YogaEdge.ALL, 20)
.alignItems(shouldAlignStart ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Text.create(c)
.text(actualPosition)
.textColor(Color.WHITE)
.textSizeDip(20)
.alignment(TextAlignment.CENTER)
.heightDip(SIZE_DP)
.widthDip(SIZE_DP)
.backgroundColor(Color.RED))
.clickHandler(AnimationStateExampleComponent.onClick(c))
.build();
}
Example #10
| Source File: PageIndicatorsSpec.java From litho with Apache License 2.0 | 6 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c, @Prop int size, @Prop int selectedIndex, @Prop int firstVisibleIndex) {
Row.Builder row = Row.create(c).alignItems(YogaAlign.CENTER);
final int dotCount = Math.min(size, MAX_DOT_COUNT);
for (int position = 0; position < dotCount; ++position) {
final int index = firstVisibleIndex + position;
row.child(
Circle.create(c)
.radiusDip(2 * getIndicatorSize(size, firstVisibleIndex, position, selectedIndex))
.color(index == selectedIndex ? COLOR_SELECTED : COLOR_NORMAL)
.transitionKey("dot" + index)
.transitionKeyType(Transition.TransitionKeyType.GLOBAL)
.marginDip(YogaEdge.ALL, 2 * 1));
}
return row.build();
}
Example #11
| Source File: AnimationTest.java From litho with Apache License 2.0 | 6 votes |
|
private Component getNonAnimatingComponent() {
return TestAnimationsComponent.create(mLithoViewRule.getContext())
.stateCaller(mStateCaller)
.transition(null)
.testComponent(
new TestAnimationsComponentSpec
.TestComponent() { // This could be a lambda but it fails ci.
@Override
public Component getComponent(ComponentContext componentContext, boolean state) {
return Row.create(componentContext)
.heightDip(200)
.widthDip(200)
.justifyContent(state ? YogaJustify.FLEX_START : YogaJustify.FLEX_END)
.alignItems(state ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(componentContext)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#ee1111"))
.build())
.build();
}
})
.build();
}
Example #12
| Source File: ExpandableElementUtil.java From litho with Apache License 2.0 | 6 votes |
|
@Nullable
static Component.Builder maybeCreateBottomDetailComponent(
ComponentContext c, boolean expanded, boolean seen) {
if (!expanded) {
return null;
}
return Text.create(c)
.textSizeDip(14)
.textColor(Color.GRAY)
.alignSelf(YogaAlign.FLEX_END)
.paddingDip(YogaEdge.RIGHT, 10)
.transitionKey(TRANSITION_BOTTOM_DETAIL)
.transitionKeyType(Transition.TransitionKeyType.GLOBAL)
.text(seen ? "Seen" : "Sent");
}
Example #13
| Source File: PlaygroundComponentSpec.java From litho-glide with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.backgroundColor(Color.WHITE)
.child(
Text.create(c)
.textSizeSp(20)
.text("Playground sample"))
.build();
}
Example #14
| Source File: FooterComponentSpec.java From litho-glide with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop(resType = STRING) String text) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.paddingDip(YogaEdge.ALL, 8)
.child(
Text.create(c)
.text(text)
.textSizeDip(14)
.textColor(GRAY)
.textStyle(ITALIC))
.build();
}
Example #15
| Source File: DemoListItemComponentSpec.java From litho-glide with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop final String name) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.paddingDip(ALL, 16)
.child(
Text.create(c)
.text(name)
.textSizeSp(18)
.build())
.clickHandler(DemoListItemComponent.onClick(c))
.build();
}
Example #16
| Source File: FooterComponentSpec.java From litho-picasso with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop(resType = STRING) String text) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.paddingDip(YogaEdge.ALL, 8)
.child(
Text.create(c)
.text(text)
.textSizeDip(14)
.textColor(GRAY)
.textStyle(ITALIC))
.build();
}
Example #17
| Source File: FeedItemCardSpec.java From litho-picasso with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @Prop final ArtistDatum artist, @Prop final RecyclerBinder binder) {
return Column.create(c)
.flexShrink(0)
.alignContent(YogaAlign.FLEX_START)
.paddingDip(VERTICAL, 8)
.paddingDip(HORIZONTAL, 16)
.child(Card.create(c)
.content(FeedItemComponent.create(c).artist(artist).binder(binder)))
.build();
}
Example #18
| Source File: DemoListItemComponentSpec.java From litho-picasso with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop final String name) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.paddingDip(ALL, 16)
.child(
Text.create(c)
.text(name)
.textSizeSp(18)
.build())
.clickHandler(DemoListItemComponent.onClick(c))
.build();
}
Example #19
| Source File: PlaygroundComponentSpec.java From litho-picasso with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c) {
return Column.create(c).flexShrink(0).alignContent(YogaAlign.FLEX_START)
.backgroundColor(Color.WHITE)
.child(
Text.create(c)
.textSizeSp(20)
.text("Playground sample"))
.build();
}
Example #20
| Source File: DecadeSeparatorSpec.java From litho-glide with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop final Decade decade) {
return Row.create(c)
.alignItems(YogaAlign.CENTER)
.paddingDip(YogaEdge.ALL, 16)
.child(
Row.create(c)
.heightPx(1)
.backgroundColor(0xFFAAAAAA)
.flex(1))
.child(
Text.create(c)
.text(String.valueOf(decade.year))
.textSizeDip(14)
.textColor(0xFFAAAAAA)
.marginDip(YogaEdge.HORIZONTAL, 10)
.flex(0))
.child(
Row.create(c)
.heightPx(1)
.backgroundColor(0xFFAAAAAA)
.flex(1))
.backgroundColor(0xFFFAFAFA)
.build();
}
Example #21
| Source File: TransitionEndCallbackTestComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
private static Component getSameKeyTestComponent(ComponentContext c, boolean state) {
return Column.create(c)
.child(
Column.create(c)
.alignItems(!state ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(50)
.widthDip(50)
.backgroundColor(Color.RED)
.alpha(!state ? 1.0f : 0.2f)
.transitionKey(TRANSITION_KEY)))
.build();
}
Example #22
| Source File: DecadeSeparatorSpec.java From litho-picasso with MIT License | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c,
@Prop final Decade decade) {
return Row.create(c)
.alignItems(YogaAlign.CENTER)
.paddingDip(YogaEdge.ALL, 16)
.child(
Row.create(c)
.heightPx(1)
.backgroundColor(0xFFAAAAAA)
.flex(1))
.child(
Text.create(c)
.text(String.valueOf(decade.year))
.textSizeDip(14)
.textColor(0xFFAAAAAA)
.marginDip(YogaEdge.HORIZONTAL, 10)
.flex(0))
.child(
Row.create(c)
.heightPx(1)
.backgroundColor(0xFFAAAAAA)
.flex(1))
.backgroundColor(0xFFFAFAFA)
.build();
}
Example #23
| Source File: ExpandableElementUtil.java From litho with Apache License 2.0 | 5 votes |
|
@Nullable
static Component.Builder maybeCreateTopDetailComponent(
ComponentContext c, boolean expanded, String timestamp) {
if (!expanded) {
return null;
}
return Text.create(c)
.textSizeDip(14)
.textColor(Color.GRAY)
.alignSelf(YogaAlign.CENTER)
.transitionKey(TRANSITION_TOP_DETAIL)
.transitionKeyType(Transition.TransitionKeyType.GLOBAL)
.text(timestamp);
}
Example #24
| Source File: ExpandableElementRootComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(
ComponentContext c, @State List<Message> messages, @State int counter) {
return Column.create(c)
.child(
Row.create(c)
.backgroundColor(Color.LTGRAY)
.child(
Text.create(c)
.paddingDip(YogaEdge.ALL, 10)
.text("INSERT")
.textSizeSp(20)
.flexGrow(1)
.alignSelf(YogaAlign.CENTER)
.testKey("INSERT")
.alignment(TextAlignment.CENTER)
.clickHandler(ExpandableElementRootComponent.onClick(c, true)))
.child(
Text.create(c)
.paddingDip(YogaEdge.ALL, 10)
.text("DELETE")
.textSizeSp(20)
.flexGrow(1)
.alignSelf(YogaAlign.CENTER)
.alignment(TextAlignment.CENTER)
.clickHandler(ExpandableElementRootComponent.onClick(c, false))))
.child(
RecyclerCollectionComponent.create(c)
.flexGrow(1)
.disablePTR(true)
.itemAnimator(new NotAnimatedItemAnimator())
.section(
DataDiffSection.<Message>create(new SectionContext(c))
.data(messages)
.renderEventHandler(ExpandableElementRootComponent.onRender(c))
.build())
.paddingDip(YogaEdge.TOP, 8))
.build();
}
Example #25
| Source File: ExpandableElementOtherSpec.java From litho with Apache License 2.0 | 5 votes |
|
static Component.Builder createSenderTile(ComponentContext c) {
return Row.create(c)
.marginDip(YogaEdge.ALL, 5)
.alignSelf(YogaAlign.CENTER)
.widthDip(55)
.heightDip(55)
.flexShrink(0)
.background(getCircle(c));
}
Example #26
| Source File: ToggleMoveBlocksExampleComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State int state, @State boolean running) {
final boolean redLeft = state == 0 || state == 4 || state == 5;
final boolean blueLeft = state == 0 || state == 1 || state == 5;
final boolean greenLeft = state == 0 || state == 1 || state == 2;
return Column.create(c)
.child(Row.create(c).child(Text.create(c).text(running ? "RUNNING" : "STOPPED")))
.child(
Column.create(c)
.alignItems(redLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#ee1111"))
.transitionKey(TRANSITION_KEY_RED)
.build()))
.child(
Column.create(c)
.alignItems(blueLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#1111ee"))
.transitionKey(TRANSITION_KEY_BLUE)
.build()))
.child(
Column.create(c)
.alignItems(greenLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#11ee11"))
.transitionKey(TRANSITION_KEY_GREEN)
.build()))
.clickHandler(ToggleMoveBlocksExampleComponent.onClick(c))
.build();
}
Example #27
| Source File: LeftRightBlocksComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State boolean left) {
return Column.create(c)
.alignItems(left ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#ee1111"))
.transitionKey("red")
.build())
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#1111ee"))
.transitionKey("blue")
.build())
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#11ee11"))
.transitionKey("green")
.build())
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.BLACK)
.transitionKey("black")
.build())
.clickHandler(LeftRightBlocksComponent.onClick(c))
.build();
}
Example #28
| Source File: OneByOneLeftRightBlocksComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State int state) {
final boolean redLeft = state == 0 || state == 4 || state == 5;
final boolean blueLeft = state == 0 || state == 1 || state == 5;
final boolean greenLeft = state == 0 || state == 1 || state == 2;
return Column.create(c)
.child(
Column.create(c)
.alignItems(redLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#ee1111"))
.transitionKey(TRANSITION_KEY_RED)
.build()))
.child(
Column.create(c)
.alignItems(blueLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#1111ee"))
.transitionKey(TRANSITION_KEY_BLUE)
.build()))
.child(
Column.create(c)
.alignItems(greenLeft ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#11ee11"))
.transitionKey(TRANSITION_KEY_GREEN)
.build()))
.clickHandler(OneByOneLeftRightBlocksComponent.onClick(c))
.build();
}
Example #29
| Source File: LeftRightBlocksSequenceComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State boolean left) {
return Column.create(c)
.alignItems(left ? YogaAlign.FLEX_START : YogaAlign.FLEX_END)
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#ee1111"))
.transitionKey("red")
.build())
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#1111ee"))
.transitionKey("blue")
.build())
.child(
Row.create(c)
.heightDip(40)
.widthDip(40)
.backgroundColor(Color.parseColor("#11ee11"))
.transitionKey("green")
.build())
.clickHandler(LeftRightBlocksSequenceComponent.onClick(c))
.build();
}
Example #30
| Source File: ContinuousExampleComponentSpec.java From litho with Apache License 2.0 | 5 votes |
|
@OnCreateLayout
static Component onCreateLayout(ComponentContext c, @State DynamicValue<Float> rotation) {
return Column.create(c)
.alignItems(YogaAlign.CENTER)
.justifyContent(YogaJustify.CENTER)
.paddingDip(YogaEdge.ALL, 50)
.child(Text.create(c).text("\u2B50").textSizeSp(50).rotation(rotation))
.visibleHandler(ContinuousExampleComponent.onVisible(c))
.build();
}
