Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Sign in
Toggle navigation
F
Front-End
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
abdullh.alsoleman
Front-End
Commits
14f3f58c
Commit
14f3f58c
authored
Aug 24, 2015
by
Hixie
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Make Flex shrink-wrap when unconstrained.
parent
fe7e39b2
Changes
5
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
193 additions
and
74 deletions
+193
-74
flex.dart
packages/flutter/lib/rendering/flex.dart
+106
-69
dialog.dart
packages/flutter/lib/widgets/dialog.dart
+5
-1
flex.md
packages/flutter/lib/widgets/flex.md
+70
-0
framework.dart
packages/flutter/lib/widgets/framework.dart
+0
-1
tool_bar.dart
packages/flutter/lib/widgets/tool_bar.dart
+12
-3
No files found.
packages/flutter/lib/rendering/flex.dart
View file @
14f3f58c
This diff is collapsed.
Click to expand it.
packages/flutter/lib/widgets/dialog.dart
View file @
14f3f58c
...
...
@@ -79,7 +79,11 @@ class Dialog extends Component {
}
if
(
actions
!=
null
)
dialogBody
.
add
(
new
Flex
(
actions
,
justifyContent:
FlexJustifyContent
.
end
));
dialogBody
.
add
(
new
Container
(
child:
new
Flex
(
actions
,
justifyContent:
FlexJustifyContent
.
end
)
));
return
new
Stack
([
new
Listener
(
...
...
packages/flutter/lib/widgets/flex.md
0 → 100644
View file @
14f3f58c
How To Use Flex In Sky
======================
Background
----------
In Sky, widgets are rendered by render boxes. Render boxes are given
constraints by their parent, and size themselves within those
constraints. Constraints consist of minimum and maximum widths and
heights; sizes consist of a specific width and height.
Generally, there are three kinds of boxes, in terms of how they handle
their constraints:
-
Those that try to be as big as possible.
For example, the boxes used by
`Center`
and
`Block`
.
-
Those that try to be the same size as their children.
For example, the boxes used by
`Transform`
and
`Opacity`
.
-
Those that try to be a particular size.
For example, the boxes used by
`Image`
and
`Text`
.
Some widgets, for example
`Container`
, vary from type to type based on
their constructor arguments. In the case of
`Container`
, it defaults
to trying to be as big as possible, but if you give it a
`width`
, for
instance, it tries to honor that and be that particular size.
The constraints are sometimes "tight", meaning that they leave no room
for the render box to decide on a size (e.g. if the minimum and
maximum width are the same, it is said to have a tight width). The
main example of this is the
`App`
widget, which is contained by the
`RenderView`
class: the box used by the child returned by the
application's
`build`
function is given a constraint that forces it to
exactly fill the application's content area (typically, the entire
screen).
Unbounded constraints
---------------------
In certain situations, the constraint that is given to a box will be
_unbounded_
, or infinite. This means that either the maximum width or
the maximum height is set to
`double.INFINITY`
.
A box that tries to be as big as possible won't function usefully when
given an unbounded constraint, and in checked mode, will assert.
The most common cases where a render box finds itself with unbounded
constraints are within flex boxes (
`Row`
and
`Column`
), and
**
within
scrollable regions
**
(mainly
`Block`
,
`ScollableList<T>`
, and
`ScrollableMixedWidgetList`
).
Flex
----
Flex boxes themselves (
`Row`
and
`Column`
) behave differently based on
whether they are in a bounded constraints or unbounded constraints in
their given direction.
In bounded constraints, they try to be as big as possible in that
direction.
In unbounded constraints, they try to fit their children in that
direction. In this case, you cannot set
`flex`
on the children to
anything other than 0 (the default). In the widget hierarchy, this
means that you cannot use
`Flexible`
when the flex box is inside
another flex box or inside a scrollable.
In the _cross_ direction, i.e. in their width for
`Column`
(vertical
flex) and in their height for
`Row`
(horizontal flex), they must never
be unbounded, otherwise they would not be able to reasonably align
their children.
packages/flutter/lib/widgets/framework.dart
View file @
14f3f58c
...
...
@@ -6,7 +6,6 @@ import 'dart:async';
import
'dart:collection'
;
import
'dart:sky'
as
sky
;
import
'package:sky/base/debug.dart'
;
import
'package:sky/base/hit_test.dart'
;
import
'package:sky/base/scheduler.dart'
as
scheduler
;
import
'package:sky/mojo/activity.dart'
;
...
...
packages/flutter/lib/widgets/tool_bar.dart
View file @
14f3f58c
...
...
@@ -46,9 +46,12 @@ class ToolBar extends Component {
}
List
<
Widget
>
children
=
new
List
<
Widget
>();
// left children
if
(
left
!=
null
)
children
.
add
(
left
);
// center children (left-aligned, but takes all remaining space)
children
.
add
(
new
Flexible
(
child:
new
Padding
(
...
...
@@ -58,15 +61,21 @@ class ToolBar extends Component {
)
);
// right children
if
(
right
!=
null
)
children
.
addAll
(
right
);
Widget
content
=
new
Container
(
child:
new
DefaultTextStyle
(
style:
sideStyle
,
child:
new
Flex
(
[
new
Container
(
child:
new
Flex
(
children
),
height:
kToolBarHeight
)],
alignItems:
FlexAlignItems
.
end
child:
new
Flex
([
new
Container
(
child:
new
Flex
(
children
),
height:
kToolBarHeight
),
],
direction:
FlexDirection
.
vertical
,
justifyContent:
FlexJustifyContent
.
end
)
),
padding:
new
EdgeDims
.
symmetric
(
horizontal:
8.0
),
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment