AlenaNicolay

- app 
    - routes.dart
    - locator.dart
- ui
    - views
        - onboarding_view
            - onboarding_view.dart
            - onboarding_viewmodel.dart  
        - login_view
            - login_view.dart

AlenaNicolay

... 
dependencies: 
  stacked:  # State management of choicce
  flutter_screenutil:  # Responsive design utility(to give our designs more setup)
  stacked_services: # Utility package for stacked services, eg navigation

...
dev_dependencies:
  build_runner: # To run build runner and generate code
  stacked_generator: # Code generator for stacked

AlenaNicolay

dependencies: 
   ...
   widgetbook_annotation: 


dev_dependencies: 
  ...
  build_runner:
  widgetbook:
  widgetbook_generator:

AlenaNicolay

@WidgetbookApp.material(
  name: "Widgetbook Test",
  devices: [
    Apple.iPhone13ProMax,
    Samsung.s21ultra,
    Desktop.desktop1080p,
  ],
)
class MyApp extends StatelessWidget {
  const MyApp({super.key});

AlenaNicolay

@WidgetbookUseCase(name: 'Onboarding View', type: OnboardingView)
Widget onboarding2ViewUseCase(BuildContext context) {
  return const OnboardingView();
}

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

  @override
  Widget build(BuildContext context) {

AlenaNicolay

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:widgetbook/widgetbook.dart' hide WidgetbookUseCase;
import 'package:widgetbook_annotation/widgetbook_annotation.dart';

@WidgetbookUseCase(name: 'App Button', type: AppButton)
Widget appButtonUseCase(BuildContext context) {
  return Center(
    child: AppButton(
      label: context.knobs.text(

AlenaNicolay

@WidgetbookUseCase(name: 'App TextField', type: AppTextField)
Widget appTextFieldViewUseCase(BuildContext context) {
  return Center(
    child: AppTextField(
      hint: context.knobs.text(label: "Hint"),
      initialValue: context.knobs.text(label: "Initial Value"),
      obscureText: context.knobs.boolean(label: "Obscure text"),
      minLines: context.knobs
          .nullableNumber(label: "Min Lines", initialValue: 1)
          ?.toInt(),

AlenaNicolay

import 'package:widgetbook/widgetbook.dart' hide WidgetbookUseCase;
import 'package:widgetbook_annotation/widgetbook_annotation.dart';

@WidgetbookUseCase(name: 'Home Item', type: HomeItem)
Widget homeItemViewUseCase(BuildContext context) {
  return Center(
    child: HomeItem(
      body: context.knobs.text(label: "Body"),
      tag: context.knobs.text(label: "Tag"),
      isLiked: context.knobs.boolean(label: "Is Liked"),

AlenaNicolay

flutter pub run build_runner build --delete-conflicting-outputs 

AlenaNicolay

flutter run -t lib/main.widgetbook.dart