Skip to content

F
Front-End
Unverified Commit d759197d authored by LongCatIsLooong's avatar LongCatIsLooong Committed by GitHub
Browse files
Options

Add scrollbars to Gallery (#33634)

parent 23174c34
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 553 additions and 525 deletions
examples/flutter_gallery/lib/demo/colors_demo.dart
View file @ d759197d
...@@ -115,9 +115,11 @@ class PaletteTabView extends StatelessWidget { ...@@ -115,9 +115,11 @@ class PaletteTabView extends StatelessWidget {
}).toList()); }).toList());
} }
return ListView( return Scrollbar(
itemExtent: kColorItemHeight, child: ListView(
children: colorItems, itemExtent: kColorItemHeight,
children: colorItems,
)
); );
} }
} }
......
examples/flutter_gallery/lib/demo/cupertino/cupertino_navigation_demo.dart
View file @ d759197d
...@@ -430,10 +430,12 @@ class CupertinoDemoTab2 extends StatelessWidget { ...@@ -430,10 +430,12 @@ class CupertinoDemoTab2 extends StatelessWidget {
navigationBar: CupertinoNavigationBar( navigationBar: CupertinoNavigationBar(
trailing: trailingButtons, trailing: trailingButtons,
), ),
child: ListView( child: CupertinoScrollbar(
children: <Widget>[ child: ListView(
Tab2Header(), children: <Widget>[
]..addAll(buildTab2Conversation()), Tab2Header(),
]..addAll(buildTab2Conversation()),
),
), ),
); );
} }
......
examples/flutter_gallery/lib/demo/cupertino/cupertino_text_field_demo.dart
View file @ d759197d
...@@ -166,25 +166,27 @@ class _CupertinoTextFieldDemoState extends State<CupertinoTextFieldDemo> { ...@@ -166,25 +166,27 @@ class _CupertinoTextFieldDemoState extends State<CupertinoTextFieldDemo> {
previousPageTitle: 'Cupertino', previousPageTitle: 'Cupertino',
middle: Text('Text Fields'), middle: Text('Text Fields'),
), ),
child: ListView( child: CupertinoScrollbar(
children: <Widget>[ child: ListView(
Padding( children: <Widget>[
padding: const EdgeInsets.symmetric(vertical: 32.0, horizontal: 16.0), Padding(
child: Column( padding: const EdgeInsets.symmetric(vertical: 32.0, horizontal: 16.0),
children: <Widget>[ child: Column(
_buildNameField(), children: <Widget>[
_buildEmailField(), _buildNameField(),
_buildLocationField(), _buildEmailField(),
_buildPinField(), _buildLocationField(),
_buildTagsField(), _buildPinField(),
], _buildTagsField(),
],
),
), ),
), Padding(
Padding( padding: const EdgeInsets.symmetric(vertical: 32.0, horizontal: 16.0),
padding: const EdgeInsets.symmetric(vertical: 32.0, horizontal: 16.0), child: _buildChatTextField(),
child: _buildChatTextField(), ),
), ],
], ),
), ),
), ),
); );
......
examples/flutter_gallery/lib/demo/material/backdrop_demo.dart
View file @ d759197d
...@@ -102,43 +102,45 @@ class CategoryView extends StatelessWidget { ...@@ -102,43 +102,45 @@ class CategoryView extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final ThemeData theme = Theme.of(context); final ThemeData theme = Theme.of(context);
return ListView( return Scrollbar(
key: PageStorageKey<Category>(category), child: ListView(
padding: const EdgeInsets.symmetric( key: PageStorageKey<Category>(category),
vertical: 16.0, padding: const EdgeInsets.symmetric(
horizontal: 64.0, vertical: 16.0,
), horizontal: 64.0,
children: category.assets.map<Widget>((String asset) { ),
return Column( children: category.assets.map<Widget>((String asset) {
crossAxisAlignment: CrossAxisAlignment.stretch, return Column(
children: <Widget>[ crossAxisAlignment: CrossAxisAlignment.stretch,
Card( children: <Widget>[
child: Container( Card(
width: 144.0, child: Container(
alignment: Alignment.center, width: 144.0,
child: Column( alignment: Alignment.center,
children: <Widget>[ child: Column(
Image.asset( children: <Widget>[
asset, Image.asset(
package: 'flutter_gallery_assets',
fit: BoxFit.contain,
),
Container(
padding: const EdgeInsets.only(bottom: 16.0),
alignment: AlignmentDirectional.center,
child: Text(
asset, asset,
style: theme.textTheme.caption, package: 'flutter_gallery_assets',
fit: BoxFit.contain,
), ),
), Container(
], padding: const EdgeInsets.only(bottom: 16.0),
alignment: AlignmentDirectional.center,
child: Text(
asset,
style: theme.textTheme.caption,
),
),
],
),
), ),
), ),
), const SizedBox(height: 24.0),
const SizedBox(height: 24.0), ],
], );
); }).toList(),
}).toList(), )
); );
} }
} }
......
examples/flutter_gallery/lib/demo/material/bottom_app_bar_demo.dart
View file @ d759197d
...@@ -156,34 +156,36 @@ class _BottomAppBarDemoState extends State<BottomAppBarDemo> { ...@@ -156,34 +156,36 @@ class _BottomAppBarDemoState extends State<BottomAppBarDemo> {
), ),
], ],
), ),
body: ListView( body: Scrollbar(
padding: const EdgeInsets.only(bottom: 88.0), child: ListView(
children: <Widget>[ padding: const EdgeInsets.only(bottom: 88.0),
const _Heading('FAB Shape'), children: <Widget>[
const _Heading('FAB Shape'),
_RadioItem<Widget>(kCircularFab, _fabShape, _onFabShapeChanged), _RadioItem<Widget>(kCircularFab, _fabShape, _onFabShapeChanged),
_RadioItem<Widget>(kDiamondFab, _fabShape, _onFabShapeChanged), _RadioItem<Widget>(kDiamondFab, _fabShape, _onFabShapeChanged),
_RadioItem<Widget>(kNoFab, _fabShape, _onFabShapeChanged), _RadioItem<Widget>(kNoFab, _fabShape, _onFabShapeChanged),
const Divider(), const Divider(),
const _Heading('Notch'), const _Heading('Notch'),
_RadioItem<bool>(kShowNotchTrue, _showNotch, _onShowNotchChanged), _RadioItem<bool>(kShowNotchTrue, _showNotch, _onShowNotchChanged),
_RadioItem<bool>(kShowNotchFalse, _showNotch, _onShowNotchChanged), _RadioItem<bool>(kShowNotchFalse, _showNotch, _onShowNotchChanged),
const Divider(), const Divider(),
const _Heading('FAB Position'), const _Heading('FAB Position'),
_RadioItem<FloatingActionButtonLocation>(kFabEndDocked, _fabLocation, _onFabLocationChanged), _RadioItem<FloatingActionButtonLocation>(kFabEndDocked, _fabLocation, _onFabLocationChanged),
_RadioItem<FloatingActionButtonLocation>(kFabCenterDocked, _fabLocation, _onFabLocationChanged), _RadioItem<FloatingActionButtonLocation>(kFabCenterDocked, _fabLocation, _onFabLocationChanged),
_RadioItem<FloatingActionButtonLocation>(kFabEndFloat, _fabLocation, _onFabLocationChanged), _RadioItem<FloatingActionButtonLocation>(kFabEndFloat, _fabLocation, _onFabLocationChanged),
_RadioItem<FloatingActionButtonLocation>(kFabCenterFloat, _fabLocation, _onFabLocationChanged), _RadioItem<FloatingActionButtonLocation>(kFabCenterFloat, _fabLocation, _onFabLocationChanged),
const Divider(), const Divider(),
const _Heading('App bar color'), const _Heading('App bar color'),
_ColorsItem(kBabColors, _babColor, _onBabColorChanged), _ColorsItem(kBabColors, _babColor, _onBabColorChanged),
], ],
),
), ),
floatingActionButton: _fabShape.value, floatingActionButton: _fabShape.value,
floatingActionButtonLocation: _fabLocation.value, floatingActionButtonLocation: _fabLocation.value,
......
examples/flutter_gallery/lib/demo/material/cards_demo.dart
View file @ d759197d
...@@ -388,27 +388,29 @@ class _CardsDemoState extends State<CardsDemo> { ...@@ -388,27 +388,29 @@ class _CardsDemoState extends State<CardsDemo> {
), ),
], ],
), ),
body: ListView( body: Scrollbar(
padding: const EdgeInsets.only(top: 8.0, left: 8.0, right: 8.0), child: ListView(
children: destinations.map<Widget>((TravelDestination destination) { padding: const EdgeInsets.only(top: 8.0, left: 8.0, right: 8.0),
Widget child; children: destinations.map<Widget>((TravelDestination destination) {
switch (destination.type) { Widget child;
case CardDemoType.standard: switch (destination.type) {
child = TravelDestinationItem(destination: destination, shape: _shape); case CardDemoType.standard:
break; child = TravelDestinationItem(destination: destination, shape: _shape);
case CardDemoType.tappable: break;
child = TappableTravelDestinationItem(destination: destination, shape: _shape); case CardDemoType.tappable:
break; child = TappableTravelDestinationItem(destination: destination, shape: _shape);
case CardDemoType.selectable: break;
child = SelectableTravelDestinationItem(destination: destination, shape: _shape); case CardDemoType.selectable:
break; child = SelectableTravelDestinationItem(destination: destination, shape: _shape);
} break;
}
return Container(
margin: const EdgeInsets.only(bottom: 8.0), return Container(
child: child, margin: const EdgeInsets.only(bottom: 8.0),
); child: child,
}).toList(), );
}).toList(),
),
), ),
); );
} }
......
examples/flutter_gallery/lib/demo/material/chip_demo.dart
View file @ d759197d
...@@ -324,7 +324,7 @@ class _ChipDemoState extends State<ChipDemo> { ...@@ -324,7 +324,7 @@ class _ChipDemoState extends State<ChipDemo> {
borderRadius: BorderRadius.circular(10.0), borderRadius: BorderRadius.circular(10.0),
)) ))
: theme.chipTheme, : theme.chipTheme,
child: ListView(children: tiles), child: Scrollbar(child: ListView(children: tiles)),
), ),
floatingActionButton: FloatingActionButton( floatingActionButton: FloatingActionButton(
onPressed: () => setState(_reset), onPressed: () => setState(_reset),
......
examples/flutter_gallery/lib/demo/material/data_table_demo.dart
View file @ d759197d
...@@ -172,62 +172,64 @@ class _DataTableDemoState extends State<DataTableDemo> { ...@@ -172,62 +172,64 @@ class _DataTableDemoState extends State<DataTableDemo> {
MaterialDemoDocumentationButton(DataTableDemo.routeName), MaterialDemoDocumentationButton(DataTableDemo.routeName),
], ],
), ),
body: ListView( body: Scrollbar(
padding: const EdgeInsets.all(20.0), child: ListView(
children: <Widget>[ padding: const EdgeInsets.all(20.0),
PaginatedDataTable( children: <Widget>[
header: const Text('Nutrition'), PaginatedDataTable(
rowsPerPage: _rowsPerPage, header: const Text('Nutrition'),
onRowsPerPageChanged: (int value) { setState(() { _rowsPerPage = value; }); }, rowsPerPage: _rowsPerPage,
sortColumnIndex: _sortColumnIndex, onRowsPerPageChanged: (int value) { setState(() { _rowsPerPage = value; }); },
sortAscending: _sortAscending, sortColumnIndex: _sortColumnIndex,
onSelectAll: _dessertsDataSource._selectAll, sortAscending: _sortAscending,
columns: <DataColumn>[ onSelectAll: _dessertsDataSource._selectAll,
DataColumn( columns: <DataColumn>[
label: const Text('Dessert (100g serving)'), DataColumn(
onSort: (int columnIndex, bool ascending) => _sort<String>((Dessert d) => d.name, columnIndex, ascending), label: const Text('Dessert (100g serving)'),
), onSort: (int columnIndex, bool ascending) => _sort<String>((Dessert d) => d.name, columnIndex, ascending),
DataColumn( ),
label: const Text('Calories'), DataColumn(
tooltip: 'The total amount of food energy in the given serving size.', label: const Text('Calories'),
numeric: true, tooltip: 'The total amount of food energy in the given serving size.',
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.calories, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.calories, columnIndex, ascending),
DataColumn( ),
label: const Text('Fat (g)'), DataColumn(
numeric: true, label: const Text('Fat (g)'),
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.fat, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.fat, columnIndex, ascending),
DataColumn( ),
label: const Text('Carbs (g)'), DataColumn(
numeric: true, label: const Text('Carbs (g)'),
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.carbs, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.carbs, columnIndex, ascending),
DataColumn( ),
label: const Text('Protein (g)'), DataColumn(
numeric: true, label: const Text('Protein (g)'),
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.protein, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.protein, columnIndex, ascending),
DataColumn( ),
label: const Text('Sodium (mg)'), DataColumn(
numeric: true, label: const Text('Sodium (mg)'),
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.sodium, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.sodium, columnIndex, ascending),
DataColumn( ),
label: const Text('Calcium (%)'), DataColumn(
tooltip: 'The amount of calcium as a percentage of the recommended daily amount.', label: const Text('Calcium (%)'),
numeric: true, tooltip: 'The amount of calcium as a percentage of the recommended daily amount.',
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.calcium, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.calcium, columnIndex, ascending),
DataColumn( ),
label: const Text('Iron (%)'), DataColumn(
numeric: true, label: const Text('Iron (%)'),
onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.iron, columnIndex, ascending), numeric: true,
), onSort: (int columnIndex, bool ascending) => _sort<num>((Dessert d) => d.iron, columnIndex, ascending),
], ),
source: _dessertsDataSource, ],
), source: _dessertsDataSource,
], ),
],
),
), ),
); );
} }
......
examples/flutter_gallery/lib/demo/material/elevation_demo.dart
View file @ d759197d
...@@ -57,9 +57,7 @@ class _ElevationDemoState extends State<ElevationDemo> { ...@@ -57,9 +57,7 @@ class _ElevationDemoState extends State<ElevationDemo> {
), ),
], ],
), ),
body: ListView( body: Scrollbar(child: ListView(children: buildCards())),
children: buildCards(),
),
); );
} }
} }
examples/flutter_gallery/lib/demo/material/expansion_tile_list_demo.dart
View file @ d759197d
...@@ -16,22 +16,24 @@ class ExpansionTileListDemo extends StatelessWidget { ...@@ -16,22 +16,24 @@ class ExpansionTileListDemo extends StatelessWidget {
title: const Text('Expand/collapse list control'), title: const Text('Expand/collapse list control'),
actions: <Widget>[MaterialDemoDocumentationButton(routeName)], actions: <Widget>[MaterialDemoDocumentationButton(routeName)],
), ),
body: ListView( body: Scrollbar(
children: <Widget>[ child: ListView(
const ListTile(title: Text('Top')), children: <Widget>[
ExpansionTile( const ListTile(title: Text('Top')),
title: const Text('Sublist'), ExpansionTile(
backgroundColor: Theme.of(context).accentColor.withOpacity(0.025), title: const Text('Sublist'),
children: const <Widget>[ backgroundColor: Theme.of(context).accentColor.withOpacity(0.025),
ListTile(title: Text('One')), children: const <Widget>[
ListTile(title: Text('Two')), ListTile(title: Text('One')),
// https://en.wikipedia.org/wiki/Free_Four ListTile(title: Text('Two')),
ListTile(title: Text('Free')), // https://en.wikipedia.org/wiki/Free_Four
ListTile(title: Text('Four')), ListTile(title: Text('Free')),
], ListTile(title: Text('Four')),
), ],
const ListTile(title: Text('Bottom')), ),
], const ListTile(title: Text('Bottom')),
],
),
), ),
); );
} }
......
examples/flutter_gallery/lib/demo/material/full_screen_dialog_demo.dart
View file @ d759197d
...@@ -162,86 +162,69 @@ class FullScreenDialogDemoState extends State<FullScreenDialogDemo> { ...@@ -162,86 +162,69 @@ class FullScreenDialogDemoState extends State<FullScreenDialogDemo> {
), ),
body: Form( body: Form(
onWillPop: _onWillPop, onWillPop: _onWillPop,
child: ListView( child: Scrollbar(
padding: const EdgeInsets.all(16.0), child: ListView(
children: <Widget>[ padding: const EdgeInsets.all(16.0),
Container( children: <Widget>[
padding: const EdgeInsets.symmetric(vertical: 8.0), Container(
alignment: Alignment.bottomLeft, padding: const EdgeInsets.symmetric(vertical: 8.0),
child: TextField( alignment: Alignment.bottomLeft,
decoration: const InputDecoration( child: TextField(
labelText: 'Event name', decoration: const InputDecoration(
filled: true, labelText: 'Event name',
), filled: true,
style: theme.textTheme.headline, ),
onChanged: (String value) { style: theme.textTheme.headline,
setState(() { onChanged: (String value) {
_hasName = value.isNotEmpty;
if (_hasName) {
_eventName = value;
}
});
},
),
),
Container(
padding: const EdgeInsets.symmetric(vertical: 8.0),
alignment: Alignment.bottomLeft,
child: TextField(
decoration: const InputDecoration(
labelText: 'Location',
hintText: 'Where is the event?',
filled: true,
),
onChanged: (String value) {
setState(() {
_hasLocation = value.isNotEmpty;
});
},
),
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text('From', style: theme.textTheme.caption),
DateTimeItem(
dateTime: _fromDateTime,
onChanged: (DateTime value) {
setState(() { setState(() {
_fromDateTime = value; _hasName = value.isNotEmpty;
_saveNeeded = true; if (_hasName) {
_eventName = value;
}
}); });
}, },
), ),
], ),
), Container(
Column( padding: const EdgeInsets.symmetric(vertical: 8.0),
crossAxisAlignment: CrossAxisAlignment.start, alignment: Alignment.bottomLeft,
children: <Widget>[ child: TextField(
Text('To', style: theme.textTheme.caption), decoration: const InputDecoration(
DateTimeItem( labelText: 'Location',
dateTime: _toDateTime, hintText: 'Where is the event?',
onChanged: (DateTime value) { filled: true,
),
onChanged: (String value) {
setState(() { setState(() {
_toDateTime = value; _hasLocation = value.isNotEmpty;
_saveNeeded = true;
}); });
}, },
), ),
const Text('All-day'),
],
),
Container(
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: theme.dividerColor))
), ),
child: Row( Column(
children: <Widget> [ crossAxisAlignment: CrossAxisAlignment.start,
Checkbox( children: <Widget>[
value: _allDayValue, Text('From', style: theme.textTheme.caption),
onChanged: (bool value) { DateTimeItem(
dateTime: _fromDateTime,
onChanged: (DateTime value) {
setState(() {
_fromDateTime = value;
_saveNeeded = true;
});
},
),
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text('To', style: theme.textTheme.caption),
DateTimeItem(
dateTime: _toDateTime,
onChanged: (DateTime value) {
setState(() { setState(() {
_allDayValue = value; _toDateTime = value;
_saveNeeded = true; _saveNeeded = true;
}); });
}, },
...@@ -249,16 +232,35 @@ class FullScreenDialogDemoState extends State<FullScreenDialogDemo> { ...@@ -249,16 +232,35 @@ class FullScreenDialogDemoState extends State<FullScreenDialogDemo> {
const Text('All-day'), const Text('All-day'),
], ],
), ),
), Container(
] decoration: BoxDecoration(
.map<Widget>((Widget child) { border: Border(bottom: BorderSide(color: theme.dividerColor))
return Container( ),
padding: const EdgeInsets.symmetric(vertical: 8.0), child: Row(
height: 96.0, children: <Widget> [
child: child, Checkbox(
); value: _allDayValue,
}) onChanged: (bool value) {
.toList(), setState(() {
_allDayValue = value;
_saveNeeded = true;
});
},
),
const Text('All-day'),
],
),
),
]
.map<Widget>((Widget child) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 8.0),
height: 96.0,
child: child,
);
})
.toList(),
),
), ),
), ),
); );
......
examples/flutter_gallery/lib/demo/material/icons_demo.dart
View file @ d759197d
...@@ -58,13 +58,15 @@ class IconsDemoState extends State<IconsDemo> { ...@@ -58,13 +58,15 @@ class IconsDemoState extends State<IconsDemo> {
child: SafeArea( child: SafeArea(
top: false, top: false,
bottom: false, bottom: false,
child: ListView( child: Scrollbar(
padding: const EdgeInsets.all(24.0), child: ListView(
children: <Widget>[ padding: const EdgeInsets.all(24.0),
_IconsDemoCard(handleIconButtonPress, Icons.face), // direction-agnostic icon children: <Widget>[
const SizedBox(height: 24.0), _IconsDemoCard(handleIconButtonPress, Icons.face), // direction-agnostic icon
_IconsDemoCard(handleIconButtonPress, Icons.battery_unknown), // direction-aware icon const SizedBox(height: 24.0),
], _IconsDemoCard(handleIconButtonPress, Icons.battery_unknown), // direction-aware icon
],
),
), ),
), ),
), ),
......
examples/flutter_gallery/lib/demo/material/leave_behind_demo.dart
View file @ d759197d
...@@ -130,16 +130,18 @@ class LeaveBehindDemoState extends State<LeaveBehindDemo> { ...@@ -130,16 +130,18 @@ class LeaveBehindDemoState extends State<LeaveBehindDemo> {
), ),
); );
} else { } else {
body = ListView( body = Scrollbar(
children: leaveBehindItems.map<Widget>((LeaveBehindItem item) { child: ListView(
return _LeaveBehindListItem( children: leaveBehindItems.map<Widget>((LeaveBehindItem item) {
confirmDismiss: _confirmDismiss, return _LeaveBehindListItem(
item: item, confirmDismiss: _confirmDismiss,
onArchive: _handleArchive, item: item,
onDelete: _handleDelete, onArchive: _handleArchive,
dismissDirection: _dismissDirection, onDelete: _handleDelete,
); dismissDirection: _dismissDirection,
}).toList(), );
}).toList(),
),
); );
} }
......
examples/flutter_gallery/lib/demo/material/overscroll_demo.dart
View file @ d759197d
...@@ -62,18 +62,20 @@ class OverscrollDemoState extends State<OverscrollDemo> { ...@@ -62,18 +62,20 @@ class OverscrollDemoState extends State<OverscrollDemo> {
body: RefreshIndicator( body: RefreshIndicator(
key: _refreshIndicatorKey, key: _refreshIndicatorKey,
onRefresh: _handleRefresh, onRefresh: _handleRefresh,
child: ListView.builder( child: Scrollbar(
padding: kMaterialListPadding, child: ListView.builder(
itemCount: _items.length, padding: kMaterialListPadding,
itemBuilder: (BuildContext context, int index) { itemCount: _items.length,
final String item = _items[index]; itemBuilder: (BuildContext context, int index) {
return ListTile( final String item = _items[index];
isThreeLine: true, return ListTile(
leading: CircleAvatar(child: Text(item)), isThreeLine: true,
title: Text('This item represents $item.'), leading: CircleAvatar(child: Text(item)),
subtitle: const Text('Even more additional list item information appears on line three.'), title: Text('This item represents $item.'),
); subtitle: const Text('Even more additional list item information appears on line three.'),
}, );
},
),
), ),
), ),
); );
......
examples/flutter_gallery/lib/demo/material/text_form_field_demo.dart
View file @ d759197d
...@@ -182,116 +182,118 @@ class TextFormFieldDemoState extends State<TextFormFieldDemo> { ...@@ -182,116 +182,118 @@ class TextFormFieldDemoState extends State<TextFormFieldDemo> {
key: _formKey, key: _formKey,
autovalidate: _autovalidate, autovalidate: _autovalidate,
onWillPop: _warnUserAboutInvalidData, onWillPop: _warnUserAboutInvalidData,
child: SingleChildScrollView( child: Scrollbar(
dragStartBehavior: DragStartBehavior.down, child: SingleChildScrollView(
padding: const EdgeInsets.symmetric(horizontal: 16.0), dragStartBehavior: DragStartBehavior.down,
child: Column( padding: const EdgeInsets.symmetric(horizontal: 16.0),
crossAxisAlignment: CrossAxisAlignment.stretch, child: Column(
children: <Widget>[ crossAxisAlignment: CrossAxisAlignment.stretch,
const SizedBox(height: 24.0), children: <Widget>[
TextFormField( const SizedBox(height: 24.0),
textCapitalization: TextCapitalization.words, TextFormField(
decoration: const InputDecoration( textCapitalization: TextCapitalization.words,
border: UnderlineInputBorder(), decoration: const InputDecoration(
filled: true, border: UnderlineInputBorder(),
icon: Icon(Icons.person), filled: true,
hintText: 'What do people call you?', icon: Icon(Icons.person),
labelText: 'Name *', hintText: 'What do people call you?',
labelText: 'Name *',
),
onSaved: (String value) { person.name = value; },
validator: _validateName,
), ),
onSaved: (String value) { person.name = value; }, const SizedBox(height: 24.0),
validator: _validateName, TextFormField(
), decoration: const InputDecoration(
const SizedBox(height: 24.0), border: UnderlineInputBorder(),
TextFormField( filled: true,
decoration: const InputDecoration( icon: Icon(Icons.phone),
border: UnderlineInputBorder(), hintText: 'Where can we reach you?',
filled: true, labelText: 'Phone Number *',
icon: Icon(Icons.phone), prefixText: '+1',
hintText: 'Where can we reach you?', ),
labelText: 'Phone Number *', keyboardType: TextInputType.phone,
prefixText: '+1', onSaved: (String value) { person.phoneNumber = value; },
validator: _validatePhoneNumber,
// TextInputFormatters are applied in sequence.
inputFormatters: <TextInputFormatter> [
WhitelistingTextInputFormatter.digitsOnly,
// Fit the validating format.
_phoneNumberFormatter,
],
), ),
keyboardType: TextInputType.phone, const SizedBox(height: 24.0),
onSaved: (String value) { person.phoneNumber = value; }, TextFormField(
validator: _validatePhoneNumber, decoration: const InputDecoration(
// TextInputFormatters are applied in sequence. border: UnderlineInputBorder(),
inputFormatters: <TextInputFormatter> [ filled: true,
WhitelistingTextInputFormatter.digitsOnly, icon: Icon(Icons.email),
// Fit the validating format. hintText: 'Your email address',
_phoneNumberFormatter, labelText: 'E-mail',
], ),
), keyboardType: TextInputType.emailAddress,
const SizedBox(height: 24.0), onSaved: (String value) { person.email = value; },
TextFormField(
decoration: const InputDecoration(
border: UnderlineInputBorder(),
filled: true,
icon: Icon(Icons.email),
hintText: 'Your email address',
labelText: 'E-mail',
), ),
keyboardType: TextInputType.emailAddress, const SizedBox(height: 24.0),
onSaved: (String value) { person.email = value; }, TextFormField(
), decoration: const InputDecoration(
const SizedBox(height: 24.0), border: OutlineInputBorder(),
TextFormField( hintText: 'Tell us about yourself (e.g., write down what you do or what hobbies you have)',
decoration: const InputDecoration( helperText: 'Keep it short, this is just a demo.',
border: OutlineInputBorder(), labelText: 'Life story',
hintText: 'Tell us about yourself (e.g., write down what you do or what hobbies you have)', ),
helperText: 'Keep it short, this is just a demo.', maxLines: 3,
labelText: 'Life story',
), ),
maxLines: 3, const SizedBox(height: 24.0),
), TextFormField(
const SizedBox(height: 24.0), keyboardType: TextInputType.number,
TextFormField( decoration: const InputDecoration(
keyboardType: TextInputType.number, border: OutlineInputBorder(),
decoration: const InputDecoration( labelText: 'Salary',
border: OutlineInputBorder(), prefixText: '\$',
labelText: 'Salary', suffixText: 'USD',
prefixText: '\$', suffixStyle: TextStyle(color: Colors.green),
suffixText: 'USD', ),
suffixStyle: TextStyle(color: Colors.green), maxLines: 1,
), ),
maxLines: 1, const SizedBox(height: 24.0),
), PasswordField(
const SizedBox(height: 24.0), fieldKey: _passwordFieldKey,
PasswordField( helperText: 'No more than 8 characters.',
fieldKey: _passwordFieldKey, labelText: 'Password *',
helperText: 'No more than 8 characters.', onFieldSubmitted: (String value) {
labelText: 'Password *', setState(() {
onFieldSubmitted: (String value) { person.password = value;
setState(() { });
person.password = value; },
});
},
),
const SizedBox(height: 24.0),
TextFormField(
enabled: person.password != null && person.password.isNotEmpty,
decoration: const InputDecoration(
border: UnderlineInputBorder(),
filled: true,
labelText: 'Re-type password',
), ),
maxLength: 8, const SizedBox(height: 24.0),
obscureText: true, TextFormField(
validator: _validatePassword, enabled: person.password != null && person.password.isNotEmpty,
), decoration: const InputDecoration(
const SizedBox(height: 24.0), border: UnderlineInputBorder(),
Center( filled: true,
child: RaisedButton( labelText: 'Re-type password',
child: const Text('SUBMIT'), ),
onPressed: _handleSubmitted, maxLength: 8,
obscureText: true,
validator: _validatePassword,
), ),
), const SizedBox(height: 24.0),
const SizedBox(height: 24.0), Center(
Text( child: RaisedButton(
'* indicates required field', child: const Text('SUBMIT'),
style: Theme.of(context).textTheme.caption, onPressed: _handleSubmitted,
), ),
const SizedBox(height: 24.0), ),
], const SizedBox(height: 24.0),
Text(
'* indicates required field',
style: Theme.of(context).textTheme.caption,
),
const SizedBox(height: 24.0),
],
),
), ),
), ),
), ),
......
examples/flutter_gallery/lib/demo/typography_demo.dart
View file @ d759197d
...@@ -73,7 +73,7 @@ class TypographyDemo extends StatelessWidget { ...@@ -73,7 +73,7 @@ class TypographyDemo extends StatelessWidget {
body: SafeArea( body: SafeArea(
top: false, top: false,
bottom: false, bottom: false,
child: ListView(children: styleItems), child: Scrollbar(child: ListView(children: styleItems)),
), ),
); );
} }
......
examples/flutter_gallery/lib/demo/video_demo.dart
View file @ d759197d
...@@ -405,19 +405,21 @@ class _VideoDemoState extends State<VideoDemo> with SingleTickerProviderStateMix ...@@ -405,19 +405,21 @@ class _VideoDemoState extends State<VideoDemo> with SingleTickerProviderStateMix
), ),
body: isSupported body: isSupported
? ConnectivityOverlay( ? ConnectivityOverlay(
child: ListView( child: Scrollbar(
children: <Widget>[ child: ListView(
VideoCard( children: <Widget>[
title: 'Butterfly', VideoCard(
subtitle: '… flutters by', title: 'Butterfly',
controller: butterflyController, subtitle: '… flutters by',
), controller: butterflyController,
VideoCard( ),
title: 'Bee', VideoCard(
subtitle: '… gently buzzing', title: 'Bee',
controller: beeController, subtitle: '… gently buzzing',
), controller: beeController,
], ),
],
),
), ),
connectedCompleter: connectedCompleter, connectedCompleter: connectedCompleter,
scaffoldKey: scaffoldKey, scaffoldKey: scaffoldKey,
......
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

HIAST - GitLab