Use ScrollView in more places (#7746)

Now that ScrollView supports itemExtent, we can use it in a few more places.
This commit is contained in:
Adam Barth 2017-01-30 16:45:51 -08:00 committed by GitHub
parent 64d3647084
commit a0dee550c0
6 changed files with 80 additions and 83 deletions

View file

@ -21,8 +21,8 @@ final List<TravelDestination> destinations = <TravelDestination>[
description: const <String>[
'Number 10',
'Whitehaven Beach',
'Whitsunday Island, Whitsunday Islands'
]
'Whitsunday Island, Whitsunday Islands',
],
),
const TravelDestination(
assetName: 'packages/flutter_gallery_assets/kangaroo_valley_safari.jpg',
@ -30,8 +30,8 @@ final List<TravelDestination> destinations = <TravelDestination>[
description: const <String>[
'2031 Moss Vale Road',
'Kangaroo Valley 2577',
'New South Wales'
]
'New South Wales',
],
)
];
@ -63,8 +63,8 @@ class TravelDestinationItem extends StatelessWidget {
new Positioned.fill(
child: new Image.asset(
destination.assetName,
fit: ImageFit.cover
)
fit: ImageFit.cover,
),
),
new Positioned(
bottom: 16.0,
@ -78,8 +78,8 @@ class TravelDestinationItem extends StatelessWidget {
),
),
),
]
)
],
),
),
// description and share/expore buttons
new Expanded(
@ -96,10 +96,10 @@ class TravelDestinationItem extends StatelessWidget {
new Text(destination.description[0]),
new Text(destination.description[1]),
new Text(destination.description[2]),
]
)
)
)
],
),
),
),
),
// share, explore buttons
// TODO(abarth): The theme and the bar should be part of card.
@ -109,18 +109,18 @@ class TravelDestinationItem extends StatelessWidget {
children: <Widget>[
new FlatButton(
child: new Text('SHARE'),
onPressed: () { /* do nothing */ }
onPressed: () { /* do nothing */ },
),
new FlatButton(
child: new Text('EXPLORE'),
onPressed: () { /* do nothing */ }
onPressed: () { /* do nothing */ },
),
]
)
],
),
),
]
)
)
],
),
),
);
}
}
@ -134,7 +134,7 @@ class CardsDemo extends StatelessWidget {
appBar: new AppBar(
title: new Text('Travel stream')
),
body: new ScrollableList(
body: new ScrollView(
itemExtent: TravelDestinationItem.height,
padding: const EdgeInsets.only(top: 8.0, left: 8.0, right: 8.0),
children: destinations.map((TravelDestination destination) {
@ -142,8 +142,7 @@ class CardsDemo extends StatelessWidget {
margin: const EdgeInsets.only(bottom: 8.0),
child: new TravelDestinationItem(destination: destination)
);
})
.toList()
}).toList()
)
);
}

View file

@ -36,7 +36,7 @@ final List<ColorSwatch> colorSwatches = <ColorSwatch>[
new ColorSwatch(name: 'DEEP ORANGE', colors: Colors.deepOrange, accentColors: Colors.deepOrangeAccent, threshold: 400),
new ColorSwatch(name: 'BROWN', colors: Colors.brown, threshold: 200),
new ColorSwatch(name: 'GREY', colors: Colors.grey, threshold: 500),
new ColorSwatch(name: 'BLUE GREY', colors: Colors.blueGrey, threshold: 500)
new ColorSwatch(name: 'BLUE GREY', colors: Colors.blueGrey, threshold: 500),
];
@ -64,9 +64,9 @@ class ColorItem extends StatelessWidget {
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new Text('$prefix$index'),
new Text(colorString())
]
)
new Text(colorString()),
],
),
);
}
}
@ -85,24 +85,22 @@ class ColorSwatchTabView extends StatelessWidget {
List<Widget> colorItems = swatch.colors.keys.map((int index) {
return new DefaultTextStyle(
style: index > swatch.threshold ? whiteTextStyle : blackTextStyle,
child: new ColorItem(index: index, color: swatch.colors[index])
child: new ColorItem(index: index, color: swatch.colors[index]),
);
})
.toList();
}).toList();
if (swatch.accentColors != null) {
colorItems.addAll(swatch.accentColors.keys.map((int index) {
return new DefaultTextStyle(
style: index > swatch.threshold ? whiteTextStyle : blackTextStyle,
child: new ColorItem(index: index, color: swatch.accentColors[index], prefix: 'A')
child: new ColorItem(index: index, color: swatch.accentColors[index], prefix: 'A'),
);
})
.toList());
}).toList());
}
return new ScrollableList(
return new ScrollView(
itemExtent: kColorItemHeight,
children: colorItems
children: colorItems,
);
}
}
@ -121,7 +119,7 @@ class ColorsDemo extends StatelessWidget {
bottom: new TabBar(
isScrollable: true,
tabs: colorSwatches.map((ColorSwatch swatch) => new Tab(text: swatch.name)).toList(),
)
),
),
body: new TabBarView(
children: colorSwatches.map((ColorSwatch swatch) {

View file

@ -23,55 +23,55 @@ final Map<_Page, List<_CardData>> _allPages = <_Page, List<_CardData>>{
new _Page(label: 'LEFT'): <_CardData>[
const _CardData(
title: 'Vintage Bluetooth Radio',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/radio.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/radio.png',
),
const _CardData(
title: 'Sunglasses',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/sunnies.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/sunnies.png',
),
const _CardData(
title: 'Clock',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/clock.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/clock.png',
),
const _CardData(
title: 'Red popsicle',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/popsicle.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/popsicle.png',
),
const _CardData(
title: 'Folding Chair',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/lawn_chair.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/lawn_chair.png',
),
const _CardData(
title: 'Green comfort chair',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/chair.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/chair.png',
),
],
new _Page(label: 'RIGHT'): <_CardData>[
const _CardData(
title: 'Beachball',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/beachball.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/beachball.png',
),
const _CardData(
title: 'Old Binoculars',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/binoculars.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/binoculars.png',
),
const _CardData(
title: 'Teapot',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/teapot.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/teapot.png',
),
const _CardData(
title: 'Blue suede shoes',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/chucks.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/chucks.png',
),
const _CardData(
title: 'Dipped Brush',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/brush.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/brush.png',
),
const _CardData(
title: 'Perfect Goldfish Bowl',
imageAsset: 'packages/flutter_gallery_assets/shrine/products/fish_bowl.png'
imageAsset: 'packages/flutter_gallery_assets/shrine/products/fish_bowl.png',
),
]
],
};
class _CardDataItem extends StatelessWidget {
@ -94,19 +94,19 @@ class _CardDataItem extends StatelessWidget {
alignment: page.id == 'L'
? FractionalOffset.centerLeft
: FractionalOffset.centerRight,
child: new CircleAvatar(child: new Text('${page.id}'))
child: new CircleAvatar(child: new Text('${page.id}')),
),
new SizedBox(
width: 144.0,
height: 144.0,
child: new Image.asset(data.imageAsset, fit: ImageFit.contain)
child: new Image.asset(data.imageAsset, fit: ImageFit.contain),
),
new Center(
child: new Text(data.title, style: Theme.of(context).textTheme.title)
)
]
)
)
child: new Text(data.title, style: Theme.of(context).textTheme.title),
),
],
),
),
);
}
}
@ -127,13 +127,13 @@ class TabsDemo extends StatelessWidget {
),
body: new TabBarView(
children: _allPages.keys.map((_Page page) {
return new ScrollableList(
return new ScrollView(
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 16.0),
itemExtent: _CardDataItem.height,
children: _allPages[page].map((_CardData data) {
return new Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: new _CardDataItem(page: page, data: data)
child: new _CardDataItem(page: page, data: data),
);
}).toList(),
);

View file

@ -29,7 +29,7 @@ class _DropdownMenuPainter extends CustomPainter {
Color color,
int elevation,
this.selectedIndex,
Animation<double> resize
Animation<double> resize,
}) : color = color,
elevation = elevation,
resize = resize,
@ -55,12 +55,12 @@ class _DropdownMenuPainter extends CustomPainter {
final double selectedItemOffset = selectedIndex * _kMenuItemHeight + _kMenuVerticalPadding.top;
final Tween<double> top = new Tween<double>(
begin: selectedItemOffset.clamp(0.0, size.height - _kMenuItemHeight),
end: 0.0
end: 0.0,
);
final Tween<double> bottom = new Tween<double>(
begin: (top.begin + _kMenuItemHeight).clamp(_kMenuItemHeight, size.height),
end: size.height
end: size.height,
);
final Rect rect = new Rect.fromLTRB(0.0, top.evaluate(resize), size.width, bottom.evaluate(resize));
@ -101,7 +101,7 @@ class _DropdownScrollConfigurationDelegate extends ScrollConfigurationDelegate {
class _DropdownMenu<T> extends StatefulWidget {
_DropdownMenu({
Key key,
_DropdownRoute<T> route
_DropdownRoute<T> route,
}) : route = route, super(key: key);
final _DropdownRoute<T> route;
@ -124,12 +124,12 @@ class _DropdownMenuState<T> extends State<_DropdownMenu<T>> {
_fadeOpacity = new CurvedAnimation(
parent: config.route.animation,
curve: const Interval(0.0, 0.25),
reverseCurve: const Interval(0.75, 1.0)
reverseCurve: const Interval(0.75, 1.0),
);
_resize = new CurvedAnimation(
parent: config.route.animation,
curve: const Interval(0.25, 0.5),
reverseCurve: const Threshold(0.0)
reverseCurve: const Threshold(0.0),
);
}
@ -160,13 +160,13 @@ class _DropdownMenuState<T> extends State<_DropdownMenu<T>> {
child: new InkWell(
child: new Container(
padding: _kMenuHorizontalPadding,
child: route.items[itemIndex]
child: route.items[itemIndex],
),
onTap: () => Navigator.pop(
context,
new _DropdownRouteResult<T>(route.items[itemIndex].value)
)
)
new _DropdownRouteResult<T>(route.items[itemIndex].value),
),
),
));
}
@ -177,7 +177,7 @@ class _DropdownMenuState<T> extends State<_DropdownMenu<T>> {
color: Theme.of(context).canvasColor,
elevation: route.elevation,
selectedIndex: route.selectedIndex,
resize: _resize
resize: _resize,
),
child: new Material(
type: MaterialType.transparency,
@ -189,12 +189,12 @@ class _DropdownMenuState<T> extends State<_DropdownMenu<T>> {
scrollableKey: config.route.scrollableKey,
padding: _kMenuVerticalPadding,
itemExtent: _kMenuItemHeight,
children: children
)
)
)
)
)
children: children,
),
),
),
),
),
);
}
}
@ -220,7 +220,7 @@ class _DropdownMenuRouteLayout<T> extends SingleChildLayoutDelegate {
minWidth: width,
maxWidth: width,
minHeight: 0.0,
maxHeight: maxHeight
maxHeight: maxHeight,
);
}
@ -344,7 +344,7 @@ class DropdownMenuItem<T> extends StatelessWidget {
DropdownMenuItem({
Key key,
this.value,
this.child
this.child,
}) : super(key: key) {
assert(child != null);
}
@ -364,7 +364,7 @@ class DropdownMenuItem<T> extends StatelessWidget {
return new Container(
height: _kMenuItemHeight,
alignment: FractionalOffset.centerLeft,
child: child
child: child,
);
}
}
@ -380,7 +380,7 @@ class DropdownButtonHideUnderline extends InheritedWidget {
/// be given.
DropdownButtonHideUnderline({
Key key,
Widget child
Widget child,
}) : super(key: key, child: child) {
assert(child != null);
}

View file

@ -108,7 +108,7 @@ class MaterialList extends StatelessWidget {
onScrollEnd: onScrollEnd,
itemExtent: kListItemExtent[type],
padding: const EdgeInsets.symmetric(vertical: 8.0) + padding,
children: children
children: children,
);
}
}

View file

@ -195,15 +195,15 @@ void main() {
StateMarkerState keyState = key.currentState;
keyState.marker = "marked";
await tester.pumpWidget(new ScrollableList(
await tester.pumpWidget(new ScrollView(
itemExtent: 100.0,
children: <Widget>[
new Container(
key: new Key('container'),
height: 100.0,
child: new StateMarker(key: key)
)
]
child: new StateMarker(key: key),
),
],
));
expect(key.currentState, equals(keyState));