• Taha Tesser's avatar
    Fix `ExpansionTile` properties cannot be updated with `setState` (#134218) · 30234a00
    Taha Tesser authored
    fixes [`ExpansionTile` properties aren't updated with `setState`](https://github.com/flutter/flutter/issues/24493)
    
    ### Code sample
    
    <details>
    <summary>expand to view the code sample</summary> 
    
    ```dart
    import 'package:flutter/material.dart';
    
    void main() => runApp(const MyApp());
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return const MaterialApp(
          debugShowCheckedModeBanner: false,
          home: Example(),
        );
      }
    }
    
    class Example extends StatefulWidget {
      const Example({super.key});
    
      @override
      State<Example> createState() => _ExampleState();
    }
    
    class _ExampleState extends State<Example> {
      ShapeBorder collapsedShape = const RoundedRectangleBorder(
        borderRadius: BorderRadius.all(Radius.circular(4)),
      );
      Color collapsedTextColor = const Color(0xffffffff);
      Color collapsedBackgroundColor = const Color(0xffff0000);
      Color collapsedIconColor = const Color(0xffffffff);
      ShapeBorder shape = const RoundedRectangleBorder(
        borderRadius: BorderRadius.all(Radius.circular(16)),
      );
      Color backgroundColor = const Color(0xffff0000);
      Color textColor = const Color(0xffffffff);
      Color iconColor = const Color(0xffffffff);
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16.0),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  ExpansionTile(
                    shape: shape,
                    backgroundColor: backgroundColor,
                    textColor: textColor,
                    iconColor: iconColor,
                    collapsedShape: collapsedShape,
                    collapsedTextColor: collapsedTextColor,
                    collapsedBackgroundColor: collapsedBackgroundColor,
                    collapsedIconColor: collapsedIconColor,
                    title: const Text('Collapsed ExpansionTile'),
                    children: const [
                      ListTile(
                        title: Text('Revealed!'),
                      ),
                    ],
                  ),
                  const SizedBox(height: 16),
                  ExpansionTile(
                    shape: shape,
                    backgroundColor: backgroundColor,
                    textColor: textColor,
                    iconColor: iconColor,
                    initiallyExpanded: true,
                    title: const Text('Expanded ExpansionTile'),
                    children: const [
                      ListTile(
                        title: Text('Revealed!'),
                      ),
                    ],
                  ),
                  const SizedBox(height: 16),
                  FilledButton(
                    onPressed: () {
                      setState(() {
                        collapsedShape = const RoundedRectangleBorder(
                          borderRadius: BorderRadius.all(Radius.circular(50)),
                        );
                        collapsedTextColor = const Color(0xfff00000);
                        collapsedBackgroundColor = const Color(0xffffff00);
                        collapsedIconColor = const Color(0xfff00000);
    
                        shape = const RoundedRectangleBorder();
                        backgroundColor = const Color(0xfffff000);
                        textColor = const Color(0xfff00000);
                        iconColor = const Color(0xfff00000);
                      });
                    },
                    child: const Text('Update properties'),
                  ),
                ],
              ),
            ),
          ),
        );
      }
    }
    ```
    
    </details> 
    
    ### Before
    
    https://github.com/flutter/flutter/assets/48603081/b29aed98-38ff-40a3-9ed3-c4342ada35b6
    
    ### After
    
    https://github.com/flutter/flutter/assets/48603081/5e0b6a34-c577-40ed-8456-7ef55caa277b
    30234a00
Name
Last commit
Last update
.github Loading commit data...
.vscode Loading commit data...
bin Loading commit data...
dev Loading commit data...
examples Loading commit data...
packages Loading commit data...
.ci.yaml Loading commit data...
.gitattributes Loading commit data...
.gitignore Loading commit data...
AUTHORS Loading commit data...
CODEOWNERS Loading commit data...
CODE_OF_CONDUCT.md Loading commit data...
CONTRIBUTING.md Loading commit data...
LICENSE Loading commit data...
PATENT_GRANT Loading commit data...
README.md Loading commit data...
TESTOWNERS Loading commit data...
analysis_options.yaml Loading commit data...
dartdoc_options.yaml Loading commit data...
flutter_console.bat Loading commit data...