mirror of
https://github.com/flutter/flutter.git
synced 2025-06-03 00:51:18 +00:00

This PR adds an another example for SliverAppBar, showing the use of stretch and onStretchTrigger https://user-images.githubusercontent.com/68919043/235420973-2bfb9871-9e05-4d87-9538-941d43178c76.mp4 Fixes #125651 ### Adds sample code for SliverAppBar [stretch, onStretchTrigger] This PR adds an another simple and easily understandable example code for SliverAppBar.
91 lines
2.7 KiB
Dart
91 lines
2.7 KiB
Dart
// Copyright 2014 The Flutter Authors. All rights reserved.
|
|
// Use of this source code is governed by a BSD-style license that can be
|
|
// found in the LICENSE file.
|
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
/// Flutter code sample for [SliverAppBar].
|
|
|
|
void main() {
|
|
runApp(const StretchableSliverAppBar());
|
|
}
|
|
|
|
class StretchableSliverAppBar extends StatefulWidget {
|
|
const StretchableSliverAppBar({super.key});
|
|
|
|
@override
|
|
State<StretchableSliverAppBar> createState() =>
|
|
_StretchableSliverAppBarState();
|
|
}
|
|
|
|
class _StretchableSliverAppBarState extends State<StretchableSliverAppBar> {
|
|
bool _stretch = true;
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return MaterialApp(
|
|
home: Scaffold(
|
|
body: CustomScrollView(
|
|
physics: const BouncingScrollPhysics(),
|
|
slivers: <Widget>[
|
|
SliverAppBar(
|
|
stretch: _stretch,
|
|
onStretchTrigger: () async {
|
|
// Triggers when stretching
|
|
},
|
|
// [stretchTriggerOffset] describes the amount of overscroll that must occur
|
|
// to trigger [onStretchTrigger]
|
|
//
|
|
// Setting [stretchTriggerOffset] to a value of 300.0 will trigger
|
|
// [onStretchTrigger] when the user has overscrolled by 300.0 pixels.
|
|
stretchTriggerOffset: 300.0,
|
|
expandedHeight: 200.0,
|
|
flexibleSpace: const FlexibleSpaceBar(
|
|
title: Text('SliverAppBar'),
|
|
background: FlutterLogo(),
|
|
),
|
|
),
|
|
SliverList(
|
|
delegate: SliverChildBuilderDelegate(
|
|
(BuildContext context, int index) {
|
|
return Container(
|
|
color: index.isOdd ? Colors.white : Colors.black12,
|
|
height: 100.0,
|
|
child: Center(
|
|
child: Text('$index', textScaleFactor: 5),
|
|
),
|
|
);
|
|
},
|
|
childCount: 20,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
bottomNavigationBar: BottomAppBar(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(8),
|
|
child: OverflowBar(
|
|
overflowAlignment: OverflowBarAlignment.center,
|
|
alignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: <Widget>[
|
|
const Text('stretch'),
|
|
Switch(
|
|
onChanged: (bool val) {
|
|
setState(() {
|
|
_stretch = val;
|
|
});
|
|
},
|
|
value: _stretch,
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
));
|
|
}
|
|
}
|