Add SliverClipRect and SliverClipRRect - #179003

import 'package:flutter/material.dart';

void main() {
  runApp(const MaterialApp(home: MyApp()));
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) => Scaffold(
    body: DecoratedBox(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          colors: <Color>[Colors.blue.shade200, Colors.blue.shade800],
        ),
      ),
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 32),
        child: CustomScrollView(
          physics: const BouncingScrollPhysics(),
          reverse: false,
          slivers: <Widget>[
            SliverClipRRect(
              borderRadius: BorderRadius.circular(12),
              sliver: const SliverAppBar(
                pinned: true,
                stretch: true,
                title: Text('Group Clipping'),
                backgroundColor: Colors.transparent,
              ),
            ),
            SliverClipRRect(
              clipOverlap: false,
              borderRadius: BorderRadius.circular(12),
              sliver: const PinnedHeaderSliver(
                child: Material(
                  color: Colors.amber,
                  child: ListTile(
                    title: Text('This is a PinnedHeaderSliver', style: TextStyle(color: Colors.white)),
                  ),
                ),
              ),
            ),
            ...List.generate(
              2,
              (_) => SliverPadding(
                padding: const EdgeInsets.all(16),
                sliver: SliverClipRRect(
                  // clipOverlap: false,
                  borderRadius: BorderRadius.circular(12),
                  sliver: DecoratedSliver(
                    decoration: const BoxDecoration(color: Colors.purple),
                    sliver: SliverMainAxisGroup(
                      slivers: <Widget>[
                        const PinnedHeaderSliver(
                          child: ListTile(
                            title: Text('Pinned Header', style: TextStyle(color: Colors.white)),
                          ),
                        ),
                        SliverClipRect(
                          sliver: SliverList.builder(
                            itemCount: 20,
                            itemBuilder: (BuildContext context, int index) => Material(
                              type: MaterialType.transparency,
                              child: ListTile(
                                title: Text('Item $index', style: const TextStyle(color: Colors.white)),
                                onTap: () {},
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    ),
  );
}

// class _DecoratedSliver extends StatelessWidget {
//   const _DecoratedSliver({this.isEnabled = true, required this.sliver});

//   final bool isEnabled;
//   final Widget sliver;

//   @override
//   Widget build(BuildContext context) => isEnabled
//       ? DecoratedSliver(
//           decoration: BoxDecoration(
//             border: Border.all(),
//             borderRadius: BorderRadius.circular(8),
//             gradient: const LinearGradient(
//               begin: Alignment.topCenter,
//               end: Alignment.bottomCenter,
//               colors: [Colors.blue, Colors.purple],
//             ),
//           ),
//           sliver: sliver,
//         )
//       : sliver;
// }