• 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
Name
Last commit
Last update
..
action_chip_template.dart Loading commit data...
app_bar_template.dart Loading commit data...
badge_template.dart Loading commit data...
banner_template.dart Loading commit data...
bottom_app_bar_template.dart Loading commit data...
bottom_sheet_template.dart Loading commit data...
button_template.dart Loading commit data...
card_template.dart Loading commit data...
checkbox_template.dart Loading commit data...
chip_template.dart Loading commit data...
color_scheme_template.dart Loading commit data...
date_picker_template.dart Loading commit data...
dialog_template.dart Loading commit data...
divider_template.dart Loading commit data...
drawer_template.dart Loading commit data...
expansion_tile_template.dart Loading commit data...
fab_template.dart Loading commit data...
filter_chip_template.dart Loading commit data...
icon_button_template.dart Loading commit data...
input_chip_template.dart Loading commit data...
input_decorator_template.dart Loading commit data...
list_tile_template.dart Loading commit data...
menu_template.dart Loading commit data...
motion_template.dart Loading commit data...
navigation_bar_template.dart Loading commit data...
navigation_drawer_template.dart Loading commit data...
navigation_rail_template.dart Loading commit data...
popup_menu_template.dart Loading commit data...
progress_indicator_template.dart Loading commit data...
radio_template.dart Loading commit data...
search_bar_template.dart Loading commit data...
search_view_template.dart Loading commit data...
segmented_button_template.dart Loading commit data...
slider_template.dart Loading commit data...
snackbar_template.dart Loading commit data...
surface_tint.dart Loading commit data...
switch_template.dart Loading commit data...
tabs_template.dart Loading commit data...
template.dart Loading commit data...
text_field_template.dart Loading commit data...
time_picker_template.dart Loading commit data...
token_logger.dart Loading commit data...
typography_template.dart Loading commit data...