shrink_sheet_layout 0.0.1+2

This is a draggable bottom sheet plugin, like the one in the app version of Youtube.

This is a draggable bottom sheet plugin, like the one in the app version of Youtube.

Features

You can add a draggable bottom sheet to your app, like the one in the Youtube app.

Showing and hiding sheets is not yet supported.

Getting started

Feel free to add to your existing Flutter apps. No preparation is required other than a Flutter app project.

Import the package by running the following command on the command line.

dart pub add shrink_sheet_layout

Then use it in the build function as shown in the example in the Usage column.

Usage

import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:shrink_sheet_layout/shrink_sheet_layout.dart';

class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
  late final ShrinkSheetController controller1;
  late final ShrinkSheetController controller2;
  @override
  void initState() {
    super.initState();
    controller1 = ShrinkSheetController(
      controller: AnimationController(
        vsync: this,
        duration: const Duration(milliseconds: 500),
        value: 1,
      ),
    );
    controller2 = ShrinkSheetController(
      controller: AnimationController(
        vsync: this,
        duration: const Duration(milliseconds: 1500),
        value: 0,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ShrinkSheetLayout(
        animation: controller1,
        minHeight: 60,
        thumbHeight: 200,
        resizeThumb: true,
        toPadding: const EdgeInsets.only(bottom: 60),
        thumb: Container(
          color: Colors.grey[800],
          child: Center(
            child: Text(
              "bar1",
              style: Theme.of(context).textTheme.bodyMedium!.copyWith(
                    color: Theme.of(context).colorScheme.background,
                  ),
            ),
          ),
        ),
        resizeContent: false,
        sheetContent: ShrinkSheetLayout(
          animation: controller2,
          thumbHeight: 60,
          fromPadding: const EdgeInsets.only(top: 2),
          toPadding: const EdgeInsets.all(8),
          thumb: Container(
            color: Colors.grey,
            child: const Center(child: Text("bar2")),
          ),
          sheetContent: Container(
            color: Colors.amber,
            child: const Center(child: Text("text")),
          ),
          body: TextButton(
            onPressed: () {
              log("test");
              controller2.expand();
            },
            child: const Text("body"),
          ),
        ),
        body: TextButton(
          onPressed: () {
            log("test");
            controller1.expand();
          },
          child: const Text("body"),
        ),
      ),
    );
  }
}

Additional information

最初のパッケージリリースであることに加え、これは私自身のために作った最初のパッケージでもある。 メンテナンスの速さは期待しないでほしい。