mirror of
https://github.com/flutter/flutter
synced 2024-10-13 19:52:53 +00:00
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:
parent
64d3647084
commit
a0dee550c0
|
@ -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()
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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(),
|
||||
);
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -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,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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));
|
||||
|
|
Loading…
Reference in a new issue