Commit 7ca8608a authored by Hans Muller's avatar Hans Muller

Merge pull request #1315 from HansMuller/gallery_section_graphics

Add section images to the gallery home page
parents 3825c037 e1c53b65
This diff was suppressed by a .gitattributes entry.
This diff was suppressed by a .gitattributes entry.
This diff was suppressed by a .gitattributes entry.
This diff was suppressed by a .gitattributes entry.
This diff was suppressed by a .gitattributes entry.
This diff was suppressed by a .gitattributes entry.
name: material_gallery name: material_gallery
assets: assets:
- assets/flutter_logo.png - assets/flutter_logo.png
- assets/section_animation.png
- assets/section_style.png
- assets/section_layout.png
- assets/section_components.png
- assets/section_patterns.png
- assets/section_usability.png
material-design-icons: material-design-icons:
- name: navigation/arrow_drop_down - name: navigation/arrow_drop_down
- name: navigation/arrow_forward - name: navigation/arrow_forward
......
...@@ -24,10 +24,11 @@ class GalleryDemo { ...@@ -24,10 +24,11 @@ class GalleryDemo {
} }
class GallerySection extends StatelessComponent { class GallerySection extends StatelessComponent {
GallerySection({ this.colors, this.title, this.demos }); GallerySection({ this.title, this.image, this.colors, this.demos });
final Map<int, Color> colors;
final String title; final String title;
final String image;
final Map<int, Color> colors;
final List<GalleryDemo> demos; final List<GalleryDemo> demos;
void showDemo(GalleryDemo demo, BuildContext context, ThemeData theme) { void showDemo(GalleryDemo demo, BuildContext context, ThemeData theme) {
...@@ -81,11 +82,27 @@ class GallerySection extends StatelessComponent { ...@@ -81,11 +82,27 @@ class GallerySection extends StatelessComponent {
child: new Container( child: new Container(
height: 256.0, height: 256.0,
margin: const EdgeDims.all(4.0), margin: const EdgeDims.all(4.0),
padding: const EdgeDims.only(left: 16.0, bottom: 16.0),
decoration: new BoxDecoration(backgroundColor: theme.primaryColor), decoration: new BoxDecoration(backgroundColor: theme.primaryColor),
child: new Align( child: new Column(
alignment: const FractionalOffset(0.0, 1.0), children: <Widget>[
child: new Text(title, style: theme.text.title) new Flexible(
child: new Padding(
padding: const EdgeDims.symmetric(horizontal: 12.0),
child: new AssetImage(
name: image,
alignment: const FractionalOffset(0.5, 0.5),
fit: ImageFit.contain
)
)
),
new Padding(
padding: const EdgeDims.all(16.0),
child: new Align(
alignment: const FractionalOffset(0.0, 1.0),
child: new Text(title, style: theme.text.title)
)
)
]
) )
) )
) )
...@@ -113,15 +130,28 @@ class GalleryHome extends StatelessComponent { ...@@ -113,15 +130,28 @@ class GalleryHome extends StatelessComponent {
<Widget>[ <Widget>[
new Row( new Row(
children: <Widget>[ children: <Widget>[
new GallerySection(title: 'Animation', colors: Colors.purple), new GallerySection(
new GallerySection(title: 'Style', colors: Colors.green) title: 'Animation',
image: 'assets/section_animation.png',
colors: Colors.purple
),
new GallerySection(
title: 'Style',
image: 'assets/section_style.png',
colors: Colors.green
)
] ]
), ),
new Row( new Row(
children: <Widget>[ children: <Widget>[
new GallerySection(title: 'Layout', colors: Colors.pink), new GallerySection(
title: 'Layout',
image: 'assets/section_layout.png',
colors: Colors.pink
),
new GallerySection( new GallerySection(
title: 'Components', title: 'Components',
image: 'assets/section_components.png',
colors: Colors.amber, colors: Colors.amber,
demos: <GalleryDemo>[ demos: <GalleryDemo>[
new GalleryDemo(title: 'Modal Bottom Sheet', builder: (_) => new ModalBottomSheetDemo()), new GalleryDemo(title: 'Modal Bottom Sheet', builder: (_) => new ModalBottomSheetDemo()),
...@@ -141,8 +171,16 @@ class GalleryHome extends StatelessComponent { ...@@ -141,8 +171,16 @@ class GalleryHome extends StatelessComponent {
), ),
new Row( new Row(
children: <Widget>[ children: <Widget>[
new GallerySection(title: 'Pattern', colors: Colors.cyan), new GallerySection(
new GallerySection(title: 'Usability', colors: Colors.lightGreen) title: 'Patterns',
image: 'assets/section_patterns.png',
colors: Colors.cyan
),
new GallerySection(
title: 'Usability',
image: 'assets/section_usability.png',
colors: Colors.lightGreen
)
] ]
) )
] ]
......
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