Skip to content

Adding a layout codelab#2877

Merged
datafoya merged 22 commits intomasterfrom
code
Aug 21, 2019
Merged

Adding a layout codelab#2877
datafoya merged 22 commits intomasterfrom
code

Conversation

@datafoya
Copy link
Copy Markdown
Contributor

@datafoya datafoya commented Aug 1, 2019

@datafoya datafoya requested review from kwalrath and sfshaza2 August 1, 2019 17:20
@googlebot googlebot added the cla: yes Contributor has signed the Contributor License Agreement label Aug 1, 2019
Copy link
Copy Markdown
Contributor

@sfshaza2 sfshaza2 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi Daniel! I have a few global comments that you might want to integrate before I continue reviewing.
Please break up all your lines to be 80 chars or less. It's hard to leave feedback on entire paragraphs. We often break the line on a phrase. Also, check with Kathy on the text in the "Check out Dart" text. More details are in the comments.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Flutter supports devices that maintain right-to-left language settings.
{{site.alert.end}}
## Introduction
In this codelab, you interact with and build Flutter layouts in a code editor called DartPad2. As you progress through this codelab, you learn that widgets build everything in flutter. A widget is an immutable object that describes a specific part of a UI. You also learn that, while widgets are simple in their functions, widgets can be complex in their structures. Widgets can be built around and inside of other widgets, and widgets can have interconnected and ordered relationships with one another. At the end of this codelab, you apply what you learn and build a simple interface using basic Fluter layout concepts.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For GitHub, we break our lines at 80 characters or less. So, please break this line (and the entire file) up.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Going back to Sublime and breaking up the characters.

Flutter supports devices that maintain right-to-left language settings.
{{site.alert.end}}
## Introduction
In this codelab, you interact with and build Flutter layouts in a code editor called DartPad2. As you progress through this codelab, you learn that widgets build everything in flutter. A widget is an immutable object that describes a specific part of a UI. You also learn that, while widgets are simple in their functions, widgets can be complex in their structures. Widgets can be built around and inside of other widgets, and widgets can have interconnected and ordered relationships with one another. At the end of this codelab, you apply what you learn and build a simple interface using basic Fluter layout concepts.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this case "will" is OK. Because they will be doing this. So:

In this coddelab, you'll interact with and build Flutter layouts...

=> At the end of this codelab, you'll apply...

Also, in this last sentence you misspell Flutter. (Fluter)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added future tenses and fixed typo; I also forgot to capitalize Flutter in one instance.

{{site.alert.end}}
## Introduction
In this codelab, you interact with and build Flutter layouts in a code editor called DartPad2. As you progress through this codelab, you learn that widgets build everything in flutter. A widget is an immutable object that describes a specific part of a UI. You also learn that, while widgets are simple in their functions, widgets can be complex in their structures. Widgets can be built around and inside of other widgets, and widgets can have interconnected and ordered relationships with one another. At the end of this codelab, you apply what you learn and build a simple interface using basic Fluter layout concepts.
## Row class and Column class
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

=> Row and Column classes

## Introduction
In this codelab, you interact with and build Flutter layouts in a code editor called DartPad2. As you progress through this codelab, you learn that widgets build everything in flutter. A widget is an immutable object that describes a specific part of a UI. You also learn that, while widgets are simple in their functions, widgets can be complex in their structures. Widgets can be built around and inside of other widgets, and widgets can have interconnected and ordered relationships with one another. At the end of this codelab, you apply what you learn and build a simple interface using basic Fluter layout concepts.
## Row class and Column class
`Row` and `Column` are classes that contain widgets. When `Row` and `Column` contain widgets, the widgets become "children," and `Row` and `Column` become "parents." Moreover, when `Row` and `Column` contain widgets, `Row` and `Column` lay them out. `Row` lays out its widgets horizontally. `Column` lays out its widgets vertically.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Replace with:

`Row` and `Column` are classes that contain, and lay out, widgets.
These widgets are called "children" and `Row` and `Column` are referred to as "parents." 
`Row` lays out..

{:.no_toc}
{{site.alert.secondary}}
{:.no_toc}
*Check out Dart.*
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

GLOBAL: I think I'd use "Try Dart" instead of "Check out Dart", but see what Kathy thinks.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Alright, I'll see what Kathy says.

{:.no_toc}
*Check out Dart.*

In the code, `Row` contains three children, all `BlueBox` widgets.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd delete this.


In the code, `Row` contains three children, all `BlueBox` widgets.

In this code example, the code displays three blue squares horizontally.
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

=> The following example displays three blue squares horizontally/.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Copy link
Copy Markdown
Contributor

@sfshaza2 sfshaza2 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, I'm stopping here for now, but giving you a chance to address what I have so far..

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Copy link
Copy Markdown
Contributor

@sfshaza2 sfshaza2 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This time I reviewed the whole thing. Please don't reply to my specific comments because it just clutters up the PR.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
{:.no_toc}
{{site.alert.secondary}}
{{site.alert.end}}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You need some text here.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Copy link
Copy Markdown
Contributor

@kwalrath kwalrath left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I stopped at line 473. I'll try to get you the remaining feedback tonight or tomorrow.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Copy link
Copy Markdown
Contributor

@kwalrath kwalrath left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd love to see some images in the last part, and some testing to make sure that everything works as planned.

This concludes my review. :) Note that I didn't closely look at the explanatory text (the non-exercise/example text before the "Putting it together" section). I can do that if you like, but I figured that Shams probably covered that well.

Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
Comment thread src/docs/codelabs/extended-flex-widget.md Outdated
@galeyang
Copy link
Copy Markdown
Contributor

Related feedback from a recent issue: a user tried to copy the code in embedded Dartpad to full experimental playground but didn't know about the hidden test code.

Takeaway:
Be careful about the hidden code in the "Tests" tab. Does hiding some code in Tests affect users' ability to understand the code? Do we need to add notes explaining that we hide some code for simplicity?

@galeyang
Copy link
Copy Markdown
Contributor

I'm not very clear about when you use light vs. dark theme.

@datafoya
Copy link
Copy Markdown
Contributor Author

https://dt-flutter.firebaseapp.com (new hosting url, 08-18-2019)

@galeyang
Copy link
Copy Markdown
Contributor

@datafoya The survey you included is designed for the Future codelab specifically so you can't use the same link. If needed, it should be a separate survey.

@datafoya
Copy link
Copy Markdown
Contributor Author

@galeyang, deleted

@datafoya
Copy link
Copy Markdown
Contributor Author

https://dt-flutter.firebaseapp.com/docs/codelabs/layout-basics (new hosting url, 08-20-2019)

Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md
Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md
Comment thread src/docs/codelabs/layout-basics.md Outdated
Comment thread src/docs/codelabs/layout-basics.md
Copy link
Copy Markdown
Contributor

@kwalrath kwalrath left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@datafoya
Copy link
Copy Markdown
Contributor Author

datafoya commented Aug 21, 2019

https://dt-flutter.firebaseapp.com/docs/codelabs/layout-basics (new hosting url, 08-21-2019)

@datafoya datafoya merged commit b1e5e6f into master Aug 21, 2019
@datafoya datafoya deleted the code branch August 21, 2019 19:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

cla: yes Contributor has signed the Contributor License Agreement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants