Unverified Commit 5e942441 authored by Hans Muller's avatar Hans Muller Committed by GitHub

updated_card (#16187)

parent 6c8c824e
...@@ -47,12 +47,13 @@ final List<TravelDestination> destinations = <TravelDestination>[ ...@@ -47,12 +47,13 @@ final List<TravelDestination> destinations = <TravelDestination>[
]; ];
class TravelDestinationItem extends StatelessWidget { class TravelDestinationItem extends StatelessWidget {
TravelDestinationItem({ Key key, @required this.destination }) TravelDestinationItem({ Key key, @required this.destination, this.shape })
: assert(destination != null && destination.isValid), : assert(destination != null && destination.isValid),
super(key: key); super(key: key);
static const double height = 366.0; static const double height = 366.0;
final TravelDestination destination; final TravelDestination destination;
final ShapeBorder shape;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
...@@ -67,6 +68,7 @@ class TravelDestinationItem extends StatelessWidget { ...@@ -67,6 +68,7 @@ class TravelDestinationItem extends StatelessWidget {
padding: const EdgeInsets.all(8.0), padding: const EdgeInsets.all(8.0),
height: height, height: height,
child: new Card( child: new Card(
shape: shape,
child: new Column( child: new Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[ children: <Widget>[
...@@ -149,14 +151,39 @@ class TravelDestinationItem extends StatelessWidget { ...@@ -149,14 +151,39 @@ class TravelDestinationItem extends StatelessWidget {
} }
} }
class CardsDemo extends StatelessWidget {
class CardsDemo extends StatefulWidget {
static const String routeName = '/material/cards'; static const String routeName = '/material/cards';
@override
_CardsDemoState createState() => new _CardsDemoState();
}
class _CardsDemoState extends State<CardsDemo> {
ShapeBorder _shape;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new Scaffold( return new Scaffold(
appBar: new AppBar( appBar: new AppBar(
title: const Text('Travel stream') title: const Text('Travel stream'),
actions: <Widget>[
new IconButton(
icon: const Icon(Icons.sentiment_very_satisfied),
onPressed: () {
setState(() {
_shape = _shape != null ? null : const RoundedRectangleBorder(
borderRadius: const BorderRadius.only(
topLeft: const Radius.circular(16.0),
topRight: const Radius.circular(16.0),
bottomLeft: const Radius.circular(2.0),
bottomRight: const Radius.circular(2.0),
),
);
});
},
),
],
), ),
body: new ListView( body: new ListView(
itemExtent: TravelDestinationItem.height, itemExtent: TravelDestinationItem.height,
...@@ -164,7 +191,10 @@ class CardsDemo extends StatelessWidget { ...@@ -164,7 +191,10 @@ class CardsDemo extends StatelessWidget {
children: destinations.map((TravelDestination destination) { children: destinations.map((TravelDestination destination) {
return new Container( return new Container(
margin: const EdgeInsets.only(bottom: 8.0), margin: const EdgeInsets.only(bottom: 8.0),
child: new TravelDestinationItem(destination: destination) child: new TravelDestinationItem(
destination: destination,
shape: _shape,
),
); );
}).toList() }).toList()
) )
......
...@@ -5,6 +5,7 @@ ...@@ -5,6 +5,7 @@
import 'package:flutter/widgets.dart'; import 'package:flutter/widgets.dart';
import 'material.dart'; import 'material.dart';
import 'theme.dart';
/// A material design card. A card has slightly rounded corners and a shadow. /// A material design card. A card has slightly rounded corners and a shadow.
/// ///
...@@ -62,24 +63,39 @@ class Card extends StatelessWidget { ...@@ -62,24 +63,39 @@ class Card extends StatelessWidget {
const Card({ const Card({
Key key, Key key,
this.color, this.color,
this.elevation: 2.0, this.elevation,
this.shape,
this.child, this.child,
}) : super(key: key); }) : super(key: key);
/// The widget below this widget in the tree. /// The card's background color.
/// ///
/// {@macro flutter.widgets.child} /// Defines the card's [Material.color].
final Widget child; ///
/// The default color is defined by the ambient [Theme]: [ThemeData.cardColor].
/// The color of material used for this card.
final Color color; final Color color;
/// The z-coordinate at which to place this card. This controls the size of /// The z-coordinate at which to place this card. This controls the size of
/// the shadow below the card. /// the shadow below the card.
/// ///
/// Defaults to 2, the appropriate elevation for cards. /// Defines the card's [Material.elevation].
///
/// The default elevation is 1.0.
final double elevation; final double elevation;
/// The shape of the card's [Material].
///
/// Defines the card's [Material.shape].
///
/// The default shape is a [RoundedRectangleBorder] with a circular corner
/// radius of 4.0.
final ShapeBorder shape;
/// The widget below this widget in the tree.
///
/// {@macro flutter.widgets.child}
final Widget child;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new Semantics( return new Semantics(
...@@ -87,11 +103,14 @@ class Card extends StatelessWidget { ...@@ -87,11 +103,14 @@ class Card extends StatelessWidget {
child: new Container( child: new Container(
margin: const EdgeInsets.all(4.0), margin: const EdgeInsets.all(4.0),
child: new Material( child: new Material(
color: color,
type: MaterialType.card, type: MaterialType.card,
elevation: elevation, color: color ?? Theme.of(context).cardColor,
child: child elevation: elevation ?? 1.0,
) shape: shape ?? const RoundedRectangleBorder(
borderRadius: const BorderRadius.all(const Radius.circular(4.0)),
),
child: child,
),
), ),
); );
} }
......
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