firka/flutter
3
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply media padding in UserAccountsDrawerHeader (#13619)

Browse Source 
Applies top, left, right media padding to avoid placing content within
the safe area insets (e.g. iPhone X notch area in landscape
orientation).
This commit is contained in:
Chris Bracken
2017-12-15 15:52:19 -08:00
committed by GitHub
parent f00c90232c
commit f39a847c8b
2 changed files with 59 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
packages/flutter/lib/src/material/user_accounts_drawer_header.dart
View File

@@ -200,22 +200,25 @@ class _UserAccountsDrawerHeaderState extends State<UserAccountsDrawerHeader> {
color: Theme.of(context).primaryColor,
),
margin: widget.margin,
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Expanded(
child: new _AccountPictures(
currentAccountPicture: widget.currentAccountPicture,
otherAccountsPictures: widget.otherAccountsPictures,
)
),
new _AccountDetails(
accountName: widget.accountName,
accountEmail: widget.accountEmail,
isOpen: _isOpen,
onTap: widget.onDetailsPressed == null ? null : _handleDetailsPressed,
),
],
child: new SafeArea(
bottom: false,
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Expanded(
child: new _AccountPictures(
currentAccountPicture: widget.currentAccountPicture,
otherAccountsPictures: widget.otherAccountsPictures,
)
),
new _AccountDetails(
accountName: widget.accountName,
accountEmail: widget.accountEmail,
isOpen: _isOpen,
onTap: widget.onDetailsPressed == null ? null : _handleDetailsPressed,
),
],
),
),
);
}

69
packages/flutter/test/material/user_accounts_drawer_header_test.dart
View File

@@ -14,31 +14,41 @@ void main() {
await tester.pumpWidget(
new MaterialApp(
home: new Material(
child: new Center(
child: new UserAccountsDrawerHeader(
currentAccountPicture: new CircleAvatar(
key: avatarA,
child: const Text('A'),
home: new MediaQuery(
data: const MediaQueryData(
padding: const EdgeInsets.only(
left: 10.0,
top: 20.0,
right: 30.0,
bottom: 40.0,
),
),
child: new Material(
child: new Center(
child: new UserAccountsDrawerHeader(
currentAccountPicture: new CircleAvatar(
key: avatarA,
child: const Text('A'),
),
otherAccountsPictures: <Widget>[
const CircleAvatar(
child: const Text('B'),
),
new CircleAvatar(
key: avatarC,
child: const Text('C'),
),
new CircleAvatar(
key: avatarD,
child: const Text('D'),
),
const CircleAvatar(
child: const Text('E'),
)
],
accountName: const Text('name'),
accountEmail: const Text('email'),
),
otherAccountsPictures: <Widget>[
const CircleAvatar(
child: const Text('B'),
),
new CircleAvatar(
key: avatarC,
child: const Text('C'),
),
new CircleAvatar(
key: avatarD,
child: const Text('D'),
),
const CircleAvatar(
child: const Text('E'),
)
],
accountName: const Text('name'),
accountEmail: const Text('email'),
),
),
),
@@ -62,8 +72,9 @@ void main() {
expect(box.size.width, equals(40.0));
expect(box.size.height, equals(40.0));
// Verify height = height + top padding + bottom margin + bottom edge)
box = tester.renderObject(find.byType(UserAccountsDrawerHeader));
expect(box.size.height, equals(160.0 + 8.0 + 1.0)); // height + bottom margin + bottom edge)
expect(box.size.height, equals(160.0 + 20.0 + 8.0 + 1.0));
final Offset topLeft = tester.getTopLeft(find.byType(UserAccountsDrawerHeader));
final Offset topRight = tester.getTopRight(find.byType(UserAccountsDrawerHeader));
@@ -72,10 +83,10 @@ void main() {
final Offset avatarDTopRight = tester.getTopRight(find.byKey(avatarD));
final Offset avatarCTopRight = tester.getTopRight(find.byKey(avatarC));
expect(avatarATopLeft.dx - topLeft.dx, equals(16.0));
expect(avatarATopLeft.dy - topLeft.dy, equals(16.0));
expect(topRight.dx - avatarDTopRight.dx, equals(16.0));
expect(avatarDTopRight.dy - topRight.dy, equals(16.0));
expect(avatarATopLeft.dx - topLeft.dx, equals(16.0 + 10.0)); // left padding
expect(avatarATopLeft.dy - topLeft.dy, equals(16.0 + 20.0)); // add top padding
expect(topRight.dx - avatarDTopRight.dx, equals(16.0 + 30.0)); // right padding
expect(avatarDTopRight.dy - topRight.dy, equals(16.0 + 20.0)); // add top padding
expect(avatarDTopRight.dx - avatarCTopRight.dx, equals(40.0 + 16.0)); // size + space between
});