swipeScreenStory top-level property

Implementation

Story swipeScreenStory = Story(
  name: 'Swipe Screen',
  builder: (context) {
    final title = context.knobs.text(
      label: 'Title',
      initial: 'Find your partner',
    );

    final width = context.knobs.slider(
      label: 'Width',
      min: 300,
      max: 600,
      initial: 427,
    );

    final likeButtonSize = context.knobs.slider(
      label: 'Like Button Size',
      min: 5,
      max: 90,
      initial: 60,
    );

    final dislikeButtonSize = context.knobs.slider(
      label: 'Dislike Button Size',
      min: 5,
      max: 90,
      initial: 40,
    );

    final superlikeButtonSize = context.knobs.slider(
      label: 'Superlike Button Size',
      min: 5,
      max: 90,
      initial: 40,
    );

    final likeButtonColor = context.knobs.options(
      label: 'Like Button Color',
      initial: Color(0xFFFF5069),
      options: const [
        Option(label: 'Green', value: Colors.green),
        Option(label: 'Blue', value: Colors.blue),
        Option(label: 'Red', value: Color(0xFFF15A29)),
      ],
    );

    final dislikeButtonColor = context.knobs.options(
      label: 'Dislike Button Color',
      initial: Colors.white,
      options: const [
        Option(label: 'yellow', value: Colors.yellow),
        Option(label: 'purple', value: Colors.purple),
        Option(label: 'Red', value: Color(0xFFF15A29)),
      ],
    );

    final superlikeButtonColor = context.knobs.options(
      label: 'Superlike Button Color ',
      initial: Color(0xFFFFB431),
      options: const [
        Option(label: 'blue', value: Colors.lightBlue),
        Option(label: 'green', value: Colors.lightGreen),
        Option(label: 'Red', value: Color(0xFFF15A29)),
      ],
    );

    return SwipeScreenLayout(
      title: title,
      cardWidth: width,
      likeButtonColor: likeButtonColor,
      dislikeButtonColor: dislikeButtonColor,
      superlikeButtonColor: superlikeButtonColor,
      likeButtonSize: likeButtonSize,
      dislikeButtonSize: dislikeButtonSize,
      superlikeButtonSize: superlikeButtonSize,
      cardDataList: [
        SwipeCardData(
          imageAsset: 'assets/images/swipScreen.png',
          name: 'Kalvin',
          age: 23,
          location: 'LOS ANGELES',
          distance: 20,
          isActive: true,
        ),
        SwipeCardData(
          imageAsset: 'assets/images/swipScreen.png',
          name: 'Emily',
          age: 25,
          location: 'NEW YORK',
          distance: 15,
          isActive: false,
        ),
        SwipeCardData(
          imageAsset: 'assets/images/swipScreen.png',
          name: 'Michael',
          age: 28,
          location: 'CHICAGO',
          distance: 30,
          isActive: true,
          chipText: 'Online Now',
        ),
      ],
    );
  },
);