Last active
January 22, 2021 10:51
-
-
Save reedom/ffee4d839bcadbec1c6f796b7fa09ae5 to your computer and use it in GitHub Desktop.
Flutter v1.22 optimization bug: a widget rebuild does not happen
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import 'dart:async'; | |
| import 'package:flutter/material.dart'; | |
| void main() { | |
| runApp(MyApp()); | |
| } | |
| class MyApp extends StatelessWidget { | |
| // This widget is the root of your application. | |
| @override | |
| Widget build(BuildContext context) { | |
| return MaterialApp( | |
| title: 'Flutter Demo', | |
| theme: ThemeData( | |
| primarySwatch: Colors.blue, | |
| visualDensity: VisualDensity.adaptivePlatformDensity, | |
| ), | |
| home: MyHomePage(title: 'Flutter Demo Home Page'), | |
| ); | |
| } | |
| } | |
| class MyHomePage extends StatefulWidget { | |
| MyHomePage({Key key, this.title}) : super(key: key); | |
| final String title; | |
| @override | |
| _MyHomePageState createState() => _MyHomePageState(); | |
| } | |
| class _MyHomePageState extends State<MyHomePage> { | |
| Timer _timer; | |
| Color _backgroundColor = Colors.blue; | |
| @override | |
| void initState() { | |
| super.initState(); | |
| print('set timer'); | |
| _timer = Timer( | |
| const Duration(seconds: 1), | |
| () => setState(() { | |
| print('set new color'); | |
| _backgroundColor = Colors.red; | |
| })); | |
| } | |
| @override | |
| void dispose() { | |
| _timer?.cancel(); | |
| super.dispose(); | |
| } | |
| @override | |
| Widget build(BuildContext context) { | |
| print('backgroundColor: $_backgroundColor'); | |
| return Scaffold( | |
| appBar: AppBar( | |
| title: Text(widget.title), | |
| ), | |
| body: Column( | |
| children: [ | |
| Expanded( | |
| child: CustomScrollView( | |
| slivers: [ | |
| SliverPersistentHeader( | |
| pinned: true, | |
| delegate: HeaderDelegate( | |
| // widget #1: this color should be changed but not. | |
| child: Container(color: _backgroundColor), | |
| ), | |
| ), | |
| const SliverPadding(padding: EdgeInsets.only(top: 2)), | |
| SliverToBoxAdapter( | |
| // widget #2: this color should be changed and it will be. | |
| child: Container(height: 100, color: _backgroundColor), | |
| ), | |
| SliverToBoxAdapter( | |
| // widget #2: this color should be changed and it will be. | |
| child: Container( | |
| padding: const EdgeInsets.symmetric( | |
| horizontal: 40, | |
| vertical: 40, | |
| ), | |
| child: const Text('both of two widgets above are programmed' | |
| ' to be turned to red after a second.'), | |
| ), | |
| ), | |
| ], | |
| ), | |
| ) | |
| ], | |
| ), | |
| ); | |
| } | |
| } | |
| class HeaderDelegate extends SliverPersistentHeaderDelegate { | |
| HeaderDelegate({this.child}); | |
| Widget child; | |
| @override | |
| double get minExtent => 100; | |
| @override | |
| double get maxExtent => 100; | |
| @override | |
| bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) => | |
| false; | |
| @override | |
| Widget build( | |
| BuildContext context, double shrinkOffset, bool overlapsContent) => | |
| SizedBox(height: 100, child: child); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment