yeyeyeyeyye

 avatar
unknown
plain_text
2 years ago
9.4 kB
4
Indexable
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:teramedik/app/utils/color_resources.dart';
import 'package:teramedik/app/utils/dimensions.dart';
import 'package:teramedik/app/utils/images.dart';

class StepperContent extends StatelessWidget {
  final double width;

  final List<String> titles;
  final int currentStep;
  final Color _activeColor;
  final Color inactiveColor = const Color.fromARGB(255, 189, 195, 210);
  final double lineWidth = 4.0;
  final List<Steps> steps;
  final VoidCallback? onStepContinue;
  final VoidCallback? onStepCancel;
  final String? appBarTitle;
  final List<Widget>? actions;
  final PageController controller = PageController(initialPage: 0);

  StepperContent(
      {required Color color,
      required this.titles,
      required this.width,
      required this.steps,
      required this.currentStep,
      super.key,
      this.onStepContinue,
      this.onStepCancel,
      this.appBarTitle,
      this.actions})
      : _activeColor = color,
        assert(width > 0);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: ColorResources.items[20],
        leading: _buttonBack(currentStep, context),
        centerTitle: false,
        title: appBarTitle != null
            ? Text(
                appBarTitle?.capitalize ?? '',
                style: GoogleFonts.inter(
                  color: ColorResources.brandHeavy,
                  fontWeight: FontWeight.w700,
                  fontSize: Dimensions.fontSizeLarge,
                  height: 24.0 / Dimensions.fontSizeLarge,
                ),
              )
            : null,
        actions: actions,
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      floatingActionButton: _buttonControls(currentStep, context),
      body: Container(
        color: ColorResources.backgroundColor,
        padding: const EdgeInsets.symmetric(horizontal: 16),
        width: width,
        child: Column(
          children: <Widget>[
            _lineStepper(),
            _contents(context),
          ],
        ),
      ),
    );
  }

  Widget _lineStepper() {
    return Column(
      children: [
        const SizedBox(
          height: 25.5,
        ),
        Row(
          children: _lineViews(),
        ),
        const SizedBox(
          height: 4,
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: _titleViews(),
        ),
        const SizedBox(
          height: 25.5,
        ),
      ],
    );
  }

  Widget _contents(BuildContext context) {
    return Expanded(
      child: PageView(
        physics: NeverScrollableScrollPhysics(),
        controller: controller,
        children: _stepPanels(),
      ),
    );
  }

  List<Widget> _stepPanels() {
    //final bool _visible = true;
    final list = <Widget>[];
    for (int i = 0; i < steps.length; i += 1) {
      list.add(
        Expanded(
          child: steps[i].content,
        ),
      );
    }
    return list;
  }

  List<Widget> _lineViews() {
    final list = <Widget>[];
    titles.asMap().forEach(
      (i, text) {
        final lineColor = currentStep == i
            ? _activeColor
            : currentStep > i
                ? ColorResources.brandMassive
                : inactiveColor;
        if (i != titles.length) {
          list.add(
            Expanded(
              child: Container(
                decoration: BoxDecoration(
                  borderRadius: const BorderRadius.all(Radius.circular(22.0)),
                  border: Border.all(
                    color: lineColor,
                    width: 2.0,
                  ),
                  color: lineColor,
                ),
                margin: const EdgeInsets.symmetric(horizontal: 2.0),
                height: lineWidth,
              ),
            ),
          );
        }
      },
    );
    return list;
  }

  List<Widget> _titleViews() {
    final list = <Widget>[];
    titles.asMap().forEach((i, text) {
      final iconColor = currentStep == i
          ? _activeColor
          : currentStep > i
              ? ColorResources.brandMassive
              : inactiveColor;

      list.add(Expanded(
        child: Row(
          children: [
            currentStep == i
                ? Container(
                    width: 20.0,
                    height: 20.0,
                    padding: const EdgeInsets.all(0),
                    decoration: BoxDecoration(
                      borderRadius:
                          const BorderRadius.all(Radius.circular(22.0)),
                      border: Border.all(
                        color: iconColor,
                        width: 5.4,
                      ),
                    ),
                    child: const Icon(Icons.circle,
                        color: ColorResources.backgroundColor, size: 10),
                  )
                : currentStep > i
                    ? Icon(Icons.check_circle_rounded,
                        color: iconColor, size: 20.0)
                    : Container(
                        width: 20.0,
                        height: 20.0,
                        padding: const EdgeInsets.all(0),
                        decoration: BoxDecoration(
                          borderRadius:
                              const BorderRadius.all(Radius.circular(22.0)),
                          border: Border.all(
                            color: iconColor,
                            width: 2.0,
                          ),
                        ),
                      ),
            const SizedBox(
              width: 8,
            ),
            Expanded(
                child: Text(
              text,
              style: GoogleFonts.inter(
                color: iconColor,
                fontWeight: FontWeight.w400,
                fontSize: Dimensions.fontSizeSmall,
              ),
              maxLines: 2,
            ))
          ],
        ),
      ));
    });
    return list;
  }

  Widget _buttonBack(int stepIndex, BuildContext context) {
    return IconButton(
      onPressed: () => [
        onStepCancel,
        controller.previousPage(
            duration: const Duration(milliseconds: 250),
            curve: Curves.bounceInOut)
      ],
      icon: SvgPicture.asset(
        Images.backArrowButton,
        color: ColorResources.brandHeavy,
      ),
    );
  }

  Widget _buttonControls(int stepIndex, BuildContext context) {
    return Container(
      margin: const EdgeInsets.only(top: 16.0),
      child: ConstrainedBox(
        constraints: const BoxConstraints.tightFor(height: 50.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            ElevatedButton(
              onPressed: () => [
                onStepContinue,
                controller.nextPage(
                    duration: const Duration(milliseconds: 250),
                    curve: Curves.bounceInOut)
              ],
              style: ElevatedButton.styleFrom(
                padding: const EdgeInsets.all(0.0),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(24),
                ),
                shadowColor: Colors.black,
                elevation: 5,
                disabledBackgroundColor: ColorResources.greyColor,
              ),
              child: Container(
                width: MediaQuery.of(context).size.width - 16,
                padding: const EdgeInsets.symmetric(
                    vertical: Dimensions.paddingSizeDefault),
                decoration: BoxDecoration(
                  gradient: const LinearGradient(
                    colors: [
                      ColorResources.gradientGreen,
                      ColorResources.gradientGreenDark,
                    ],
                    transform: GradientRotation(90 * pi / 180),
                  ),
                  borderRadius: BorderRadius.circular(24),
                ),
                child: Text(
                  'stepper_next'.tr,
                  style: GoogleFonts.inter(
                    color: ColorResources.items[10],
                    fontWeight: FontWeight.w700,
                    fontSize: Dimensions.fontSizeLarge,
                  ),
                  textAlign: TextAlign.center,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

@immutable
class Steps {
  /// Creates a step for a [StepperContent].
  const Steps({
    required this.content,
  });
  final Widget content;
}

@immutable
class ControlsDetail {
  const ControlsDetail({
    required this.currentStep,
    required this.stepIndex,
    this.onStepContinue,
    this.onStepCancel,
  });
  final int currentStep;
  final int stepIndex;
  final VoidCallback? onStepContinue;
  final VoidCallback? onStepCancel;
  bool get isActive => currentStep == stepIndex;
}
Editor is loading...