1. 12 Oct, 2023 1 commit
    • Taha Tesser's avatar
      Fix chip widgets don't the apply provided `iconTheme` (#135751) · f65dd3ba
      Taha Tesser authored
      fixes [`Chip.iconTheme` does not apply the icon theme](https://github.com/flutter/flutter/issues/111828)
      
      ### Description
      - Fix chip widgets that don't utilize the provided `iconTheme`.
      - Prevent `iconTheme` with just color from overriding the default icon size.
      - Add some missing M3 tests for the chip and chip theme properties.
      
      ### 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 MaterialApp(
            debugShowCheckedModeBanner: false,
            theme: ThemeData(useMaterial3: true),
            home: const Example(),
          );
        }
      }
      
      class Example extends StatefulWidget {
        const Example({super.key});
      
        @override
        State<Example> createState() => _ExampleState();
      }
      
      class _ExampleState extends State<Example> {
        final bool _isEnable = true;
      
        @override
        Widget build(BuildContext context) {
          return Scaffold(
            body: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  RawChip(
                    iconTheme: const IconThemeData(color: Colors.amber),
                    avatar: const Icon(Icons.favorite_rounded),
                    label: const Text('RawChip'),
                    onPressed: () {},
                    isEnabled: _isEnable,
                  ),
                  const Chip(
                    iconTheme: IconThemeData(color: Colors.amber),
                    avatar: Icon(Icons.favorite_rounded),
                    label: Text('Chip'),
                    // onDeleted: () {},
                  ),
                  FilterChip(
                    iconTheme: const IconThemeData(color: Colors.amber),
                    avatar: const Icon(Icons.favorite_rounded),
                    label: const Text('FilterChip'),
                    selected: false,
                    onSelected: _isEnable ? (bool value) {} : null,
                  ),
                  InputChip(
                    iconTheme: const IconThemeData(color: Colors.amber),
                    avatar: const Icon(Icons.favorite_rounded),
                    label: const Text('InputChip'),
                    isEnabled: _isEnable,
                    onPressed: () {},
                  ),
                  ActionChip(
                    iconTheme: const IconThemeData(color: Colors.amber),
                    avatar: const Icon(Icons.favorite_rounded),
                    label: const Text('ActionChip'),
                    onPressed: _isEnable ? () {} : null,
                  ),
                  ChoiceChip(
                    iconTheme: const IconThemeData(color: Colors.amber),
                    avatar: const Icon(Icons.favorite_rounded),
                    label: const Text('ChoiceChip'),
                    selected: false,
                    onSelected: _isEnable ? (bool value) {} : null,
                  ),
                ],
              ),
            ),
            floatingActionButton: FloatingActionButton(
              onPressed: () {},
              child: const Icon(Icons.add),
            ),
          );
        }
      }
      
      ```
      
      </details>
      
      ### Before
      ![Screenshot 2023-09-29 at 16 59 39](https://github.com/flutter/flutter/assets/48603081/4bc32032-cff3-4237-812f-86f17ed95337)
      
      ### After
      
      ![Screenshot 2023-09-29 at 16 55 24](https://github.com/flutter/flutter/assets/48603081/05a1fc52-fb31-4790-a840-18f2e9718241)
      f65dd3ba
  2. 10 Oct, 2023 1 commit
  3. 07 Sep, 2023 1 commit
  4. 30 Aug, 2023 1 commit
  5. 25 Aug, 2023 1 commit
    • Taha Tesser's avatar
      Fix `Chip.shape`'s side is not used when provided in Material 3 (#132941) · 612117a6
      Taha Tesser authored
      fixes [Chip border side color not working in Material3](https://github.com/flutter/flutter/issues/132922)
      
      ### 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 MaterialApp(
            theme: ThemeData(
              useMaterial3: true,
              chipTheme: const ChipThemeData(
                  // shape: RoundedRectangleBorder(
                  //   side: BorderSide(color: Colors.amber),
                  //   borderRadius: BorderRadius.all(Radius.circular(12)),
                  // ),
                  // side: BorderSide(color: Colors.red),
                  ),
            ),
            home: const Example(),
          );
        }
      }
      
      class Example extends StatelessWidget {
        const Example({super.key});
      
        @override
        Widget build(BuildContext context) {
          return const Scaffold(
            body: Center(
              child: RawChip(
                shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.amber),
                  borderRadius: BorderRadius.all(Radius.circular(12)),
                ),
                // side: BorderSide(color: Colors.red),
                label: Text('Chip'),
              ),
            ),
          );
        }
      }
      
      ``` 
      
      </details>
      
      ---
      
      ### Before
      
      When `RawChip.shape` is provided with a `BorderSide`.
      
      ```dart
            body: Center(
              child: RawChip(
                shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.amber),
                  borderRadius: BorderRadius.all(Radius.circular(12)),
                ),
                label: Text('Chip'),
              ),
            ),
      ```
      
      ![Screenshot 2023-08-24 at 17 54 54](https://github.com/flutter/flutter/assets/48603081/89e2c9b5-44c2-432e-97ff-8bb95b0d0fb1)
      
      When `RawChip.shape` is provided with a `BorderSide` and also `RawChip.side` is provided. The  `RawChip.side` overrides the shape's side.
      
      ```dart
            body: Center(
              child: RawChip(
                shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.amber),
                  borderRadius: BorderRadius.all(Radius.circular(12)),
                ),
                side: BorderSide(color: Colors.red),
                label: Text('Chip'),
              ),
            ),
      ```
      
      ![Screenshot 2023-08-24 at 17 55 37](https://github.com/flutter/flutter/assets/48603081/938803cc-d514-464b-b06b-e4841b9ad040)
      
      ---
      
      ### After
      
      When `RawChip.shape` is provided with a `BorderSide`.
      
      ```dart
            body: Center(
              child: RawChip(
                shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.amber),
                  borderRadius: BorderRadius.all(Radius.circular(12)),
                ),
                label: Text('Chip'),
              ),
            ),
      ```
      
      ![Screenshot 2023-08-24 at 17 51 29](https://github.com/flutter/flutter/assets/48603081/d6fcaaa9-8f5d-4180-ad14-062dd459ec45)
      
      When `RawChip.shape` is provided with a `BorderSide` and also `RawChip.side` is provided. The  `RawChip.side` overrides the shape's side.
      
      ```dart
            body: Center(
              child: RawChip(
                shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.amber),
                  borderRadius: BorderRadius.all(Radius.circular(12)),
                ),
                side: BorderSide(color: Colors.red),
                label: Text('Chip'),
              ),
            ),
      ```
      
      ![Screenshot 2023-08-24 at 17 52 31](https://github.com/flutter/flutter/assets/48603081/3fa46341-43f0-4fe7-a922-f1d8ba34028c)
      
      ---
      612117a6
  6. 14 Aug, 2023 1 commit
  7. 09 Aug, 2023 1 commit
  8. 08 Aug, 2023 1 commit
  9. 07 Aug, 2023 1 commit
  10. 25 Jul, 2023 1 commit
    • Taha Tesser's avatar
      Fix `RawChip` doesn't use `ChipTheme.showCheckmark` value (#131257) · 62adfcf7
      Taha Tesser authored
      fixes [`RawChip` doesn't use `ChipThemeData.showCheckmark` value](https://github.com/flutter/flutter/issues/119163)
      
      ### Description
      
      `RawChip.showCheckmark` is nullable yet the constructor falsely assigns a default which breaks `ChipTheme` support. This PR removes the falsely assigned default value.
      
      ### 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 MaterialApp(
            debugShowCheckedModeBanner: false,
            theme: ThemeData(useMaterial3: true,
              chipTheme: const ChipThemeData(
                showCheckmark: false,
              )
            ),
            home: const Example(),
          );
        }
      }
      
      class Example extends StatelessWidget {
        const Example({super.key});
      
        @override
        Widget build(BuildContext context) {
          return Scaffold(
            appBar: AppBar(
              title: const Text('Sample'),
            ),
            body: Center(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  const RawChip(
                    selected: true,
                    label: Text('RawChip'),
                  ),
                  FilterChip(
                    selected: true,
                    label: const Text('RawChip'), onSelected: (bool value) {  },
                  ),
                ],
              ),
            ),
          );
        }
      }
      
      ``` 
      	
      </details>
      
      ### Before
      ![before](https://github.com/flutter/flutter/assets/48603081/c8050c28-d988-4c72-8e0a-6455aa02d119)
      
      ### After
      
      ![after](https://github.com/flutter/flutter/assets/48603081/d5e83e81-6c12-4594-a2fd-8f113d6c9b54)
      62adfcf7
  11. 22 Jul, 2023 1 commit
  12. 19 Jun, 2023 1 commit
    • Taha Tesser's avatar
      Introduce MaterialState `color` property for chips (#128584) · 467c970b
      Taha Tesser authored
      fixes https://github.com/flutter/flutter/issues/115827
      fixes https://github.com/flutter/flutter/issues/101325
      
      ### Description
      1. This PR adds a new MaterialState `color` property to all the chips (this makes it possible to customize chips in all states from the M3 specs).
      2. Updated defaults to use the new  MaterialState `color` property.
      3. Updated and added new tests to all the chip test classes.
      
      <details> 
      <summary>code sample</summary> 
      
      ```dart
      import 'package:flutter/material.dart';
      
      const Color disabledColor = Colors.black26;
      const Color backgroundColor = Colors.cyan;
      final Color disabledSelectedColor = Colors.red.shade100;
      const Color selectedColor = Colors.amber;
      final MaterialStateProperty<Color> color =
          MaterialStateProperty.resolveWith((Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled) &&
            states.contains(MaterialState.selected)) {
          return disabledSelectedColor;
        }
        if (states.contains(MaterialState.disabled)) {
          return disabledColor;
        }
        if (states.contains(MaterialState.selected)) {
          return selectedColor;
        }
        return backgroundColor;
      });
      
      void main() => runApp(const MyApp());
      
      class MyApp extends StatelessWidget {
        const MyApp({super.key});
      
        @override
        Widget build(BuildContext context) {
          return MaterialApp(
            debugShowCheckedModeBanner: false,
            theme: ThemeData(
              useMaterial3: true,
              // chipTheme: ChipThemeData(color: color),
            ),
            home: const Example(),
          );
        }
      }
      
      class Example extends StatefulWidget {
        const Example({super.key});
      
        @override
        State<Example> createState() => _ExampleState();
      }
      
      class _ExampleState extends State<Example> {
        bool enabled = false;
        bool selected = true;
      
        @override
        Widget build(BuildContext context) {
          const Widget verticalSpace = SizedBox(height: 20);
      
          return Scaffold(
            body: Center(
              child: Column(
                children: <Widget>[
                  const SizedBox(height: 25),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      const Card(
                        elevation: 0.0,
                        color: disabledColor,
                        child: Padding(
                          padding: EdgeInsets.all(8.0),
                          child: Text('disabledColor'),
                        ),
                      ),
                      const Card(
                        elevation: 0.0,
                        color: backgroundColor,
                        child: Padding(
                          padding: EdgeInsets.all(8.0),
                          child: Text('backgroundColor'),
                        ),
                      ),
                      Card(
                        elevation: 0.0,
                        color: disabledSelectedColor,
                        child: const Padding(
                          padding: EdgeInsets.all(8.0),
                          child: Text('disabledSelectedColor'),
                        ),
                      ),
                      const Card(
                        elevation: 0.0,
                        color: selectedColor,
                        child: Padding(
                          padding: EdgeInsets.all(8.0),
                          child: Text('selectedColor'),
                        ),
                      ),
                    ],
                  ),
                  const Spacer(),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      Column(
                        mainAxisSize: MainAxisSize.min,
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          RawChip(
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('RawChip'),
                            isEnabled: enabled,
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                          verticalSpace,
                          InputChip(
                            isEnabled: enabled,
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('InputChip'),
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                        ],
                      ),
                      Column(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          FilterChip(
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('FilterChip'),
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                          verticalSpace,
                          FilterChip.elevated(
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('FilterChip.elevated'),
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                        ],
                      ),
                      Column(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          ChoiceChip(
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('ChoiceChip'),
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                          verticalSpace,
                          ChoiceChip.elevated(
                            selected: selected,
                            selectedColor: selectedColor,
                            color: color,
                            label: const Text('ChoiceChip.elevated'),
                            onSelected: enabled ? (bool value) {} : null,
                          ),
                        ],
                      ),
                    ],
                  ),
                  const Spacer(),
                  Row(
                    children: <Widget>[
                      Flexible(
                        child: SwitchListTile(
                          title: const Text('Enabled'),
                          value: enabled,
                          onChanged: (bool value) {
                            setState(() => enabled = value);
                          },
                        ),
                      ),
                      Flexible(
                        child: SwitchListTile(
                          title: const Text('Selected'),
                          value: selected,
                          onChanged: (bool value) {
                            setState(() => selected = value);
                          },
                        ),
                      ),
                    ],
                  )
                ],
              ),
            ),
          );
        }
      }
      
      ``` 
      	
      </details>
      
      ### Before (not possible to customize disabled and selected chips)
      
      ![Screenshot 2023-06-13 at 16 27 13](https://github.com/flutter/flutter/assets/48603081/633f09f7-16a1-469e-b326-b9cc0ed59242)
      
      ### After (using disabled and selected chips using the new  MaterialState `color` property)
      
      ![Screenshot 2023-06-13 at 16 26 53](https://github.com/flutter/flutter/assets/48603081/7f5dffb7-4074-4268-87c0-c059c2da67a8)
      467c970b
  13. 13 Jun, 2023 1 commit
    • Qun Cheng's avatar
      Update unit tests in material library for Material 3 (#128725) · a5f8b64e
      Qun Cheng authored
      Updates most of the unit tests in the packages/flutter/test/material folder so that they'll pass if ThemeData.useMaterial3 defaults to true.
      
      All of the tests have wired useMaterial3 to false and will need to be updated with a M3 version.
      
      related to #127064
      a5f8b64e
  14. 16 Feb, 2023 1 commit
  15. 22 Sep, 2022 1 commit
  16. 25 Aug, 2022 1 commit
  17. 22 Aug, 2022 1 commit
  18. 21 Aug, 2022 1 commit
  19. 19 Aug, 2022 1 commit
  20. 17 Aug, 2022 1 commit
  21. 16 Aug, 2022 1 commit
  22. 15 Aug, 2022 1 commit
  23. 06 Jul, 2022 1 commit
  24. 22 Jun, 2022 1 commit
    • Darren Austin's avatar
      Chip theme cleanup (#106384) · c8f867b5
      Darren Austin authored
      - Added complete support for showCheckmark to ChipThemeData.
      - Removed build method checks for ThemeData.chipTheme, as that is
        already handled by ChipTheme.of().
      c8f867b5
  25. 25 May, 2022 2 commits
  26. 20 May, 2022 1 commit
  27. 01 Dec, 2021 1 commit
  28. 20 Nov, 2021 1 commit
  29. 16 Nov, 2021 1 commit
  30. 08 Oct, 2021 3 commits
  31. 20 Jul, 2021 1 commit
  32. 28 Apr, 2021 1 commit
  33. 31 Mar, 2021 1 commit
    • Craig Labenz's avatar
      Add MaterialStateBorderSide.resolveWith (#78731) · 9bbe89d8
      Craig Labenz authored
      * added MaterialStateBorderSide.resolveWith
      
      (Partially) Resolves #68596
      
      * responded to comment nits
      
      * reversed changes to text_buttons
      
      * added test confirming compatibility with chips
      
      * added MaterialStateBorderSide test for chip
      
      * added intended usage for MaterialStateXYZ classes
      
      * another docstring update
      
      * corrected error in use case
      
      * made resolvewith samples closures
      
      * refined materialstatecolor example in docstring
      
      * changed nullability in docstring and added null test
      
      * added missing type in test
      
      * fixed another typo in docstrings
      9bbe89d8
  34. 04 Feb, 2021 1 commit
  35. 26 Jan, 2021 1 commit
  36. 28 Oct, 2020 1 commit
  37. 07 Oct, 2020 1 commit