49e18738c3
Summary: Remove gists in code blocks. This also made it easier to fix the iOS sample app instructions in the getting started. >Note: I also needed to update my gems as I was having problems running `bundle install`. The errors were around installing json v1.8.3. It was resolved by creating a new Gemfile.lock. 1. Build website and check changed pages (see attached Getting Started for an example) 2. Also check how it would look for mobile site (see attached index page) Verified that the code snippets matched previous snippets and styling acceptable.   Closes https://github.com/facebook/yoga/pull/500 Differential Revision: D4834356 Pulled By: emilsjolander fbshipit-source-id: f47dca4b7518822b195f0bd5076fbf852904372b
6.0 KiB
6.0 KiB
layout, title, id
| layout | title | id |
|---|---|---|
| home | Yoga | home |
C
```c
YGNodeRef root = YGNodeNew();
YGNodeStyleSetWidth(root, 500);
YGNodeStyleSetHeight(root, 120);
YGNodeStyleSetFlexDirection(root, YGFlexDirectionRow);
YGNodeStyleSetPadding(root, YGEdgeAll, 20);
YGNodeRef image = YGNodeNew(); YGNodeStyleSetWidth(image, 80); YGNodeStyleSetMargin(image, YGEdgeEnd, 20);
YGNodeRef text = YGNodeNew(); YGNodeStyleSetHeight(text, 25); YGNodeStyleSetAlignSelf(text, YGAlignCenter); YGNodeStyleSetFlexGrow(text, 1);
YGNodeInsertChild(root, image, 0); YGNodeInsertChild(root, text, 1);
</div>
</div>
</div>
</div>
<div class="gridBlock">
<h3>OBJ-C</h3>
<div class="blockElement twoByGridBlock imageAlignSide">
<div class="blockContent layoutsample">
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px; align-items: center; justify-content: center; padding: 20px;">
<div class="yoga" style="background-color: #97dccf; width: 150px; height: 150px; margin-bottom: 20px;"></div>
<div class="yoga" style="background-color: #303846; height: 25px; width: 100px;"></div>
</div>
</div>
<div class="blockContent">
<div markdown="1" style="width: 700px; max-width: 100%;">
```objc
UIView *root = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 500, 300)];
[root configureLayoutWithBlock:^void(YGLayout *layout) {
layout.isEnabled = YES;
layout.alignItems = YGAlignCenter;
layout.justifyContent = YGJustifyContentCenter;
layout.padding = 20.0f;
}];
UIImageView *image = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 150, 150)];
[image configureLayoutWithBlock:^void(YGLayout *layout) {
layout.isEnabled = YES;
layout.marginBottom = 20.0f;
}];
[root addSubview:image];
UILabel *text = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 25, 100)];
[root addSubview:text];
JAVA
```java
YogaNode root = new YogaNode();
root.setWidth(500);
root.setHeight(300);
root.setAlignItems(CENTER);
root.setJustifyContent(CENTER);
root.setPadding(ALL, 20);
YogaNode text = new YogaNode(); text.setWidth(200); text.setHeight(25);
YogaNode image = new YogaNode(); image.setWidth(50); image.setHeight(50); image.setPositionType(ABSOLUTE); image.setPosition(END, 20); image.setPosition(TOP, 20);
root.addChildAt(text, 0); root.addChildAt(image, 1);
</div>
</div>
</div>
</div>
<div class="gridBlock">
<h3>C#</h3>
<div class="blockElement twoByGridBlock imageAlignSide">
<div class="blockContent layoutsample">
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px;">
<div class="yoga" style="background-color: #97dccf; flex-grow: 1;"></div>
<div class="yoga" style="background-color: #303846; margin: 20px; height: 25px; width: 300px;"></div>
</div>
</div>
<div class="blockContent">
<div markdown="1" style="width: 700px; max-width: 100%;">
```csharp
YogaNode root = YogaNode.Create(
width: 500,
height: 300,
);
YogaNode image = YogaNode.Create(flexGrow: 1);
YogaNode text = YogaNode.Create(
width: 300,
height: 25,
margin: new Spacing(left: 20, top: 20, right: 20, bottom: 20),
);
root.Insert(image, 0);
root.Insert(text, 1);
Android
```xml
```