Commit a651008a authored by Hans Muller's avatar Hans Muller Committed by GitHub

Animate the "PREVIEW" banner into view (#5598)

parent e47e9376
...@@ -45,14 +45,6 @@ class GalleryAppState extends State<GalleryApp> { ...@@ -45,14 +45,6 @@ class GalleryAppState extends State<GalleryApp> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
// In checked mode, show the default "slow mode" banner, otherwise show
// the "preview" banner.
bool showPreviewBanner = true;
assert(() {
showPreviewBanner = false;
return true;
});
Widget home = new GalleryHome( Widget home = new GalleryHome(
useLightTheme: _useLightTheme, useLightTheme: _useLightTheme,
onThemeChanged: (bool value) { onThemeChanged: (bool value) {
...@@ -74,18 +66,12 @@ class GalleryAppState extends State<GalleryApp> { ...@@ -74,18 +66,12 @@ class GalleryAppState extends State<GalleryApp> {
}, },
); );
if (showPreviewBanner) if (config.updateUrlFetcher != null) {
home = new Banner(
message: 'PREVIEW',
location: BannerLocation.topRight,
child: home,
);
if (config.updateUrlFetcher != null)
home = new Updater( home = new Updater(
updateUrlFetcher: config.updateUrlFetcher, updateUrlFetcher: config.updateUrlFetcher,
child: home, child: home,
); );
}
return new MaterialApp( return new MaterialApp(
title: 'Flutter Gallery', title: 'Flutter Gallery',
......
...@@ -113,127 +113,139 @@ class GalleryDrawer extends StatelessWidget { ...@@ -113,127 +113,139 @@ class GalleryDrawer extends StatelessWidget {
final TextStyle aboutTextStyle = themeData.textTheme.body2; final TextStyle aboutTextStyle = themeData.textTheme.body2;
final TextStyle linkStyle = themeData.textTheme.body2.copyWith(color: themeData.accentColor); final TextStyle linkStyle = themeData.textTheme.body2.copyWith(color: themeData.accentColor);
return new Drawer( final Widget lightThemeItem = new DrawerItem(
child: new Block( icon: new Icon(Icons.brightness_5),
onPressed: () { onThemeChanged(true); },
selected: useLightTheme,
child: new Row(
children: <Widget>[ children: <Widget>[
new GalleryDrawerHeader(light: useLightTheme), new Flexible(child: new Text('Light')),
new DrawerItem( new Radio<bool>(
icon: new Icon(Icons.brightness_5), value: true,
onPressed: () { onThemeChanged(true); }, groupValue: useLightTheme,
selected: useLightTheme, onChanged: onThemeChanged
child: new Row( )
children: <Widget>[ ]
new Flexible(child: new Text('Light')), )
new Radio<bool>( );
value: true,
groupValue: useLightTheme, final Widget darkThemeItem = new DrawerItem(
onChanged: onThemeChanged icon: new Icon(Icons.brightness_7),
) onPressed: () { onThemeChanged(false); },
] selected: useLightTheme,
) child: new Row(
), children: <Widget>[
new DrawerItem( new Flexible(child: new Text('Dark')),
icon: new Icon(Icons.brightness_7), new Radio<bool>(
onPressed: () { onThemeChanged(false); }, value: false,
selected: useLightTheme, groupValue: useLightTheme,
child: new Row( onChanged: onThemeChanged
children: <Widget>[ )
new Flexible(child: new Text('Dark')), ]
new Radio<bool>( )
value: false, );
groupValue: useLightTheme,
onChanged: onThemeChanged final Widget animateSlowlyItem = new DrawerItem(
) icon: new Icon(Icons.hourglass_empty),
] selected: timeDilation != 1.0,
) onPressed: () { onTimeDilationChanged(timeDilation != 1.0 ? 1.0 : 20.0); },
), child: new Row(
new Divider(), children: <Widget>[
new DrawerItem( new Flexible(child: new Text('Animate Slowly')),
icon: new Icon(Icons.hourglass_empty), new Checkbox(
selected: timeDilation != 1.0, value: timeDilation != 1.0,
onPressed: () { onTimeDilationChanged(timeDilation != 1.0 ? 1.0 : 20.0); }, onChanged: (bool value) { onTimeDilationChanged(value ? 20.0 : 1.0); }
child: new Row( )
children: <Widget>[ ]
new Flexible(child: new Text('Animate Slowly')), )
new Checkbox( );
value: timeDilation != 1.0,
onChanged: (bool value) { onTimeDilationChanged(value ? 20.0 : 1.0); } final Widget fileAnIssueItem = new DrawerItem(
) icon: new Icon(Icons.report),
] child: new RichText(
text: new TextSpan(
children: <TextSpan>[
new LinkTextSpan(
text: "File an issue",
style: linkStyle,
url: 'https://github.com/flutter/flutter/issues/new'
) )
), ]
onShowPerformanceOverlayChanged == null ? new Container(height: 0.0) : new DrawerItem( )
icon: new Icon(Icons.assessment), )
onPressed: () { onShowPerformanceOverlayChanged(!showPerformanceOverlay); }, );
selected: showPerformanceOverlay,
child: new Row( final Widget aboutItem = new AboutDrawerItem(
children: <Widget>[ icon: new FlutterLogo(),
new Flexible(child: new Text('Performance Overlay')), applicationVersion: '2016 Q3 Preview',
new Checkbox( applicationIcon: new FlutterLogo(),
value: showPerformanceOverlay, applicationLegalese: '© 2016 The Chromium Authors',
onChanged: (bool value) { onShowPerformanceOverlayChanged(!showPerformanceOverlay); } aboutBoxChildren: <Widget>[
new Padding(
padding: const EdgeInsets.only(top: 24.0),
child: new RichText(
text: new TextSpan(
children: <TextSpan>[
new TextSpan(
style: aboutTextStyle,
text: "Flutter is an early-stage, open-source project to help "
"developers build high-performance, high-fidelity, mobile "
"apps for iOS and Android from a single codebase. This "
"gallery is a preview of Flutter's many widgets, behaviors, "
"animations, layouts, and more. Learn more about Flutter at "
),
new LinkTextSpan(
style: linkStyle,
url: 'https://flutter.io'
),
new TextSpan(
style: aboutTextStyle,
text: ".\n\nTo see the source code for this app, please visit the "
),
new LinkTextSpan(
style: linkStyle,
url: 'https://goo.gl/iv1p4G',
text: 'flutter github repo'
),
new TextSpan(
style: aboutTextStyle,
text: "."
) )
] ]
) )
),
new DrawerItem(
icon: new Icon(Icons.report),
child: new RichText(
text: new TextSpan(
children: <TextSpan>[
new LinkTextSpan(
text: "File an issue",
style: linkStyle,
url: 'https://github.com/flutter/flutter/issues/new'
)
]
)
)
),
new AboutDrawerItem(
icon: new FlutterLogo(),
applicationVersion: '2016 Q3 Preview',
applicationIcon: new FlutterLogo(),
applicationLegalese: '© 2016 The Chromium Authors',
aboutBoxChildren: <Widget>[
new Padding(
padding: const EdgeInsets.only(top: 24.0),
child: new RichText(
text: new TextSpan(
children: <TextSpan>[
new TextSpan(
style: aboutTextStyle,
text: "Flutter is an early-stage, open-source project to help "
"developers build high-performance, high-fidelity, mobile "
"apps for iOS and Android from a single codebase. This "
"gallery is a preview of Flutter's many widgets, behaviors, "
"animations, layouts, and more. Learn more about Flutter at "
),
new LinkTextSpan(
style: linkStyle,
url: 'https://flutter.io'
),
new TextSpan(
style: aboutTextStyle,
text: ".\n\nTo see the source code for this app, please visit the "
),
new LinkTextSpan(
style: linkStyle,
url: 'https://goo.gl/iv1p4G',
text: 'flutter github repo'
),
new TextSpan(
style: aboutTextStyle,
text: "."
)
]
)
)
)
]
) )
] )
) ]
); );
final List<Widget> allDrawerItems = <Widget>[
new GalleryDrawerHeader(light: useLightTheme),
lightThemeItem,
darkThemeItem,
new Divider(),
animateSlowlyItem,
// index 5, optional: Performance Overlay
fileAnIssueItem,
aboutItem
];
if (onShowPerformanceOverlayChanged != null) {
allDrawerItems.insert(5, new DrawerItem(
icon: new Icon(Icons.assessment),
onPressed: () { onShowPerformanceOverlayChanged(!showPerformanceOverlay); },
selected: showPerformanceOverlay,
child: new Row(
children: <Widget>[
new Flexible(child: new Text('Performance Overlay')),
new Checkbox(
value: showPerformanceOverlay,
onChanged: (bool value) { onShowPerformanceOverlayChanged(!showPerformanceOverlay); }
)
]
)
));
}
return new Drawer(child: new Block(children: allDrawerItems));
} }
} }
...@@ -99,6 +99,23 @@ class GalleryHomeState extends State<GalleryHome> { ...@@ -99,6 +99,23 @@ class GalleryHomeState extends State<GalleryHome> {
static final Key _homeKey = new ValueKey<String>("Gallery Home"); static final Key _homeKey = new ValueKey<String>("Gallery Home");
static final GlobalKey<ScrollableState> _scrollableKey = new GlobalKey<ScrollableState>(); static final GlobalKey<ScrollableState> _scrollableKey = new GlobalKey<ScrollableState>();
final AnimationController _controller = new AnimationController(
duration: const Duration(milliseconds: 600),
debugLabel: "preview banner"
);
@override
void initState() {
super.initState();
_controller.forward();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
List<Widget> _galleryListItems() { List<Widget> _galleryListItems() {
final List<Widget> listItems = <Widget>[]; final List<Widget> listItems = <Widget>[];
final ThemeData themeData = Theme.of(context); final ThemeData themeData = Theme.of(context);
...@@ -126,7 +143,7 @@ class GalleryHomeState extends State<GalleryHome> { ...@@ -126,7 +143,7 @@ class GalleryHomeState extends State<GalleryHome> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final double statusBarHeight = MediaQuery.of(context).padding.top; final double statusBarHeight = MediaQuery.of(context).padding.top;
return new Scaffold( Widget home = new Scaffold(
key: _homeKey, key: _homeKey,
scrollableKey: _scrollableKey, scrollableKey: _scrollableKey,
drawer: new GalleryDrawer( drawer: new GalleryDrawer(
...@@ -160,5 +177,30 @@ class GalleryHomeState extends State<GalleryHome> { ...@@ -160,5 +177,30 @@ class GalleryHomeState extends State<GalleryHome> {
children: _galleryListItems() children: _galleryListItems()
) )
); );
// In checked mode our MaterialApp will show the default "slow mode" banner.
// Otherwise show the "preview" banner.
bool showPreviewBanner = true;
assert(() {
showPreviewBanner = false;
return true;
});
if (showPreviewBanner) {
home = new Stack(
children: <Widget>[
home,
new FadeTransition(
opacity: new CurvedAnimation(parent: _controller, curve: Curves.easeInOut),
child: new Banner(
message: 'PREVIEW',
location: BannerLocation.topRight,
)
),
]
);
}
return home;
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment