.child( Row.create(c) .alignContent(YogaAlign.STRETCH) .marginDip(YogaEdge.TOP, 10) .child( Text.create(c) .alignSelf(YogaAlign.CENTER) .text("Snap type: ") .textSizeSp(20)) .child( Spinner.create(c) .flexGrow(1.f)
.child( Row.create(c) .heightDip(40) .widthDip(40) .backgroundColor(Color.parseColor("#ee1111")) .transitionKey(TRANSITION_KEY_RED) .build())) .child( Column.create(c) .child( Row.create(c) .heightDip(40) .widthDip(40) .backgroundColor(Color.parseColor("#1111ee")) .transitionKey(TRANSITION_KEY_BLUE) .build())) .child( Column.create(c) .child( Row.create(c) .heightDip(40) .widthDip(40) .backgroundColor(Color.parseColor("#11ee11")) .transitionKey(TRANSITION_KEY_GREEN) .build())) .clickHandler(OneByOneLeftRightBlocksComponent.onClick(c)) .build();
@OnCreateLayout static Component onCreateLayout( ComponentContext c, @State String selection, @State boolean isShowingDropDown, @Prop(resType = ResType.DIMEN_TEXT, optional = true) float selectedTextSize, @Prop(resType = ResType.COLOR, optional = true) int selectedTextColor, @Prop(resType = ResType.DRAWABLE, optional = true) @Nullable Drawable caret) { assertAPI11orHigher(); caret = caret == null ? new CaretDrawable(c.getAndroidContext(), DEFAULT_CARET_COLOR) : caret; selectedTextSize = selectedTextSize == -1 ? spToPx(c.getAndroidContext(), DEFAULT_TEXT_SIZE_SP) : selectedTextSize; return Row.create(c) .minHeightDip(SPINNER_HEIGHT) .justifyContent(YogaJustify.SPACE_BETWEEN) .paddingDip(START, MARGIN_SMALL) .backgroundAttr(android.R.attr.selectableItemBackground) .clickHandler(Spinner.onClick(c)) .child(createSelectedItemText(c, selection, (int) selectedTextSize, selectedTextColor)) .child(createCaret(c, caret, isShowingDropDown)) .accessibilityRole(AccessibilityRole.DROP_DOWN_LIST) .build(); }
return !commentText ? Row.create(c) .backgroundColor(Color.WHITE) .heightDip(56) .child( Row.create(c) .widthPercent(33.3f) .alignItems(YogaAlign.CENTER) .justifyContent(YogaJustify.CENTER) .clickHandler(StoryFooterComponent.onClick(c)) .testKey("like_button") .child( Column.create(c) .heightDip(24) .backgroundColor(Color.RED) .transitionKey("icon_like")) .child( Text.create(c) .textSizeSp(16) .transitionKey("text_like") .marginDip(YogaEdge.LEFT, 8))) .child( Row.create(c) .transitionKey("cont_comment") .widthPercent(33.3f) .alignItems(YogaAlign.CENTER) .justifyContent(YogaJustify.CENTER)
.child( Row.create(c) .transitionKey(TRANSITION_KEY_CONTAINER_4_1) .transitionKeyType(Transition.TransitionKeyType.GLOBAL) .heightDip(60) .paddingDip(YogaEdge.ALL, 6) .backgroundColor(Color.GRAY) .child( Column.create(c) .transitionKey(TRANSITION_KEY_CHILD_4_1_1) .flex(1) .backgroundColor(Color.RED)) .child( Column.create(c) .transitionKey(TRANSITION_KEY_CHILD_4_1_2) .child( Row.create(c) .transitionKey(TRANSITION_KEY_CONTAINER_4_2) .transitionKeyType(Transition.TransitionKeyType.GLOBAL) .heightDip(60) .marginDip(YogaEdge.TOP, 8) .paddingDip(YogaEdge.ALL, 6) .backgroundColor(Color.GRAY) .child( Column.create(c) .transitionKey(TRANSITION_KEY_CHILD_4_2_1)
.child( Row.create(c) .alignContent(YogaAlign.STRETCH) .marginDip(YogaEdge.TOP, 10) .child( Text.create(c) .alignSelf(YogaAlign.CENTER) .text("Scroll to: ") .textSizeSp(20)) .child( Text.create(c) .alignSelf(YogaAlign.CENTER) .clickHandler(HorizontalScrollScrollerComponent.onClick(c, false)) .textSizeSp(20)) .child( Text.create(c) .alignSelf(YogaAlign.CENTER) .child( Row.create(c) .alignContent(YogaAlign.STRETCH) .marginDip(YogaEdge.TOP, 10) .child( Text.create(c) .alignSelf(YogaAlign.CENTER) .text("Smooth scroll to: ")
.child( Row.create(c) .clickHandler(LearningClickEventsComponent.onClickThirdChild(c)) .backgroundRes(android.R.color.holo_blue_light) .child( Image.create(c) .drawableRes(R.drawable.save) .paddingDip(START, 7) .paddingDip(END, 7)) .child(Text.create(c).text("Third child").textSizeSp(30))) .child( Text.create(c)
.child( Row.create(c) .alignItems(YogaAlign.CENTER) .child( Text.create(c) .textSizeSp(16) .textStyle(Typeface.BOLD) .text("Cristobal Castilla")) .child( Row.create(c) .marginDip(YogaEdge.LEFT, 8) .paddingDip(YogaEdge.ALL, 3) .alignItems(YogaAlign.CENTER) .child( Column.create(c) .heightDip(18) .widthDip(18) .background(buildRoundedRect(c, 0xFFFFB74B, 9))) .child( !expanded ? null .textSizeDip(12) .text("Top Follower")) .child( Text.create(c) .marginDip(YogaEdge.LEFT, 8) .textColor(Color.BLUE)
.child( Row.create(c) .backgroundRes(android.R.color.holo_blue_light) .child( Image.create(c) .drawableRes(R.drawable.save) .paddingDip(START, 7) .paddingDip(END, 7)) .child(Text.create(c).text("Third child").textSizeSp(30))) .child( Text.create(c)
.child( Row.create(c) .alignItems(YogaAlign.CENTER) .child( Text.create(c) .textSizeSp(16) .textStyle(Typeface.BOLD) .text("Cristobal Castilla")) .child( Row.create(c) .widthDip(expanded ? 48 : 24) .marginDip(YogaEdge.LEFT, 8) .paddingDip(YogaEdge.ALL, 3) .alignItems(YogaAlign.CENTER) .child( Column.create(c) .positionType(YogaPositionType.ABSOLUTE) .widthDip(18) .background(buildRoundedRect(c, 0xFFB2CFE5, 9))) .child( Column.create(c) .positionType(YogaPositionType.ABSOLUTE) .widthDip(18) .background(buildRoundedRect(c, 0xFF4B8C61, 9))) .child( Column.create(c) .heightDip(18)
@OnCreateLayout static Component onCreateLayout(ComponentContext c, @Prop String title, @Prop String subtitle) { return Row.create(c) .paddingDip(HORIZONTAL, CARD_INSET) .paddingDip(TOP, CARD_INSET) .child( FrescoImage.create(c) .controller( .marginDip(END, CARD_INTERNAL_PADDING) .marginDip(BOTTOM, CARD_INTERNAL_PADDING)) .child( Column.create(c) .flexGrow(1f) .text(subtitle) .paddingDip(BOTTOM, CARD_INTERNAL_PADDING))) .child( Image.create(c) .drawableRes(R.drawable.menu) .marginDip(START, CARD_INTERNAL_PADDING) .marginDip(BOTTOM, CARD_INTERNAL_PADDING)) .build();
.child( Row.create(c) .justifyContent(SPACE_AROUND) .alignItems(CENTER) .positionType(ABSOLUTE) .positionPx(LEFT, 50) .positionPx(TOP, 50) .positionPx(RIGHT, 200) .positionPx(BOTTOM, 50) .child(Text.create(c).text("textLeft1")) .child(Text.create(c).text("textRight1")) .backgroundColor(0xFFFF0000) .foregroundColor(0xFFFF0000) .paddingPx(ALL, paddingSize) .wrapInView()) .child( Row.create(c) .justifyContent(SPACE_AROUND) .alignItems(CENTER) .positionType(ABSOLUTE) .positionPx(LEFT, 200) .positionPx(TOP, 50) .positionPx(RIGHT, 50) .positionPx(BOTTOM, 50) .child( Text.create(c) .text("textLeft2") .backgroundColor(0xFFFF0000)
.child( Row.create(c) .backgroundColor(Color.LTGRAY) .child( Text.create(c) .paddingDip(YogaEdge.ALL, 10) .textAlignment(Layout.Alignment.ALIGN_CENTER) .clickHandler(ExpandableElementRootComponent.onClick(c, true))) .child( Text.create(c) .paddingDip(YogaEdge.ALL, 10)
.child( Row.create(c) .alignSelf(YogaAlign.STRETCH) .justifyContent(YogaJustify.SPACE_BETWEEN) .child( Text.create(c) .paddingDip(YogaEdge.ALL, 12) .text("Prev") .clickHandler(PageIndicatorsRootComponent.onPrevClick(c))) .child( PageIndicators.create(c) .size(PAGES_COUNT) .firstVisibleIndex(firstVisibleIndex) .movingDirection(movingDirection)) .child( Text.create(c) .paddingDip(YogaEdge.ALL, 12)
.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))
.child( Row.create(c) .justifyContent(SPACE_AROUND) .alignItems(CENTER) .positionType(ABSOLUTE) .positionPx(LEFT, 50) .positionPx(TOP, 50) .positionPx(RIGHT, 200) .positionPx(BOTTOM, 50) .child(Text.create(c).text("textLeft1")) .child(Text.create(c).text("textRight1")) .paddingPx(ALL, paddingSize) .wrapInView()) .child( Row.create(c) .justifyContent(SPACE_AROUND) .alignItems(CENTER) .positionType(ABSOLUTE) .positionPx(LEFT, 200) .positionPx(TOP, 50) .positionPx(RIGHT, 50) .positionPx(BOTTOM, 50) .child( Text.create(c) .text("textLeft2") .wrapInView() .paddingPx(ALL, paddingSize)) .child(TestViewComponent.create(c).wrapInView())) .build();
@Before public void setup() { MockitoAnnotations.initMocks(this); ComponentsConfiguration.isNestedTreeResolutionExperimentEnabled = true; mContext = new ComponentContext(RuntimeEnvironment.application); mComponent = new InlineLayoutSpec() { @Override @OnCreateLayout protected Component onCreateLayout(ComponentContext c) { return Row.create(c) .marginPx(YogaEdge.LEFT, MARGIN_LEFT) .marginPx(YogaEdge.TOP, MARGIN_TOP) .child( TestDrawableComponent.create(c) .key(KEY_ANCHOR) .widthPx(ANCHOR_WIDTH) .heightPx(ANCHOR_HEIGHT)) .build(); } }; mComponentTree = ComponentTree.create(mContext, mComponent).build(); Whitebox.setInternalState(mComponent, "mGlobalKey", mComponent.getKey()); mContext = ComponentContext.withComponentTree(mContext, mComponentTree); mContext = ComponentContext.withComponentScope(mContext, mComponent); mLithoView = getLithoView(mComponentTree); mAnchorGlobalKey = ComponentKeyUtils.getKeyWithSeparator(Row.create(mContext).build().getTypeId(), KEY_ANCHOR); }
@Override protected Component onCreateLayout(final ComponentContext c) { return Row.create(c) .alignItems(CENTER) .paddingDip(ALL, 10) .contentDescription("This is root view") .child(TestDrawableComponent.create(c).widthDip(30).heightDip(30)) .child( TestDrawableComponent.create(c, true, true, true, true, false) .flex(1) .backgroundColor(RED) .marginDip(HORIZONTAL, 10)) .child( Row.create(c) .alignItems(CENTER) .paddingDip(ALL, 10) .contentDescription("This is a container") .child( TestDrawableComponent.create(c) .widthDip(30) .heightDip(30) .contentDescription("This is an image")) .child( TestDrawableComponent.create(c, true, true, true, true, false) .flex(1) .flexBasisDip(0) .marginDip(HORIZONTAL, 10))) .build();
@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(); }
.child( Row.create(c) .backgroundColor(saved ? Color.BLUE : Color.TRANSPARENT) .alignSelf(STRETCH) .paddingDip(HORIZONTAL, CARD_INSET) .paddingDip(BOTTOM, CARD_INTERNAL_PADDING) .paddingDip(TOP, CARD_INTERNAL_PADDING) .justifyContent(CENTER) .child( Image.create(c) .drawableRes(R.drawable.save) .heightDip(20) .marginDip(END, CARD_INTERNAL_PADDING)) .child(Text.create(c, 0, R.style.save_text).text("Save")) .clickHandler(StoryCardComponent.onClickSave(c)) .border(Border.create(c).color(ALL, Color.BLACK).widthDip(TOP, 1).build())) .border(Border.create(c).color(ALL, Color.BLACK).widthDip(ALL, 1).build()) .build();