import 'package:apps_sidang/generated/assets.dart';
import 'package:apps_sidang/src/home/view/home_view.dart';
import 'package:flutter/material.dart';
import 'package:introduction_screen/introduction_screen.dart';

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

  @override
  State<OnboardingView> createState() => _OnboardingViewState();
}

class _OnboardingViewState extends State<OnboardingView> {
  final introKey = GlobalKey<IntroductionScreenState>();
  void _onIntroEnd(context) {
    Navigator.of(
      context,
    ).pushReplacement(MaterialPageRoute(builder: (_) => const HomeView()));
  }

  @override
  Widget build(BuildContext context) {
    return IntroductionScreen(
      key: introKey,
      globalBackgroundColor: Colors.white,
      allowImplicitScrolling: true,
      pages: [
        PageViewModel(
          title: 'Apa itu Stunting?',
          bodyWidget: Column(
            children: [
              Text(
                'Stunting merupakan suatu keadaan di mana tinggi badan anak lebih rendah dari rata-rata untuk usianya karena kekurangan nutrisi yang berlangsung dalam jangka waktu yang lama',
                style: TextStyle(
                  fontWeight: FontWeight.w400,
                  fontFamily: 'FiraCode',
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 15),
              Text(
                '"Kementrian Kesehatan"',
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w700,
                  fontFamily: 'FiraCode',
                  fontStyle: FontStyle.italic,
                ),
              ),
            ],
          ),

          image: Image.asset(Assets.assetsImagesThinking),
          decoration: PageDecoration(
            titleTextStyle: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w700,
              fontFamily: 'FiraCode',
            ),
            bodyPadding: EdgeInsets.fromLTRB(16.0, 0.0, 16.0, 16.0),
            pageColor: Colors.white,
            imagePadding: EdgeInsets.zero,
          ),
        ),
        PageViewModel(
          title: 'Kenali Penyebab Stunting?',
          bodyWidget: Column(
            children: [
              Text(
                'Stunting disebabkan oleh kekurangan gizi, infeksi berulang, dan lingkungan yang tidak mendukung',
                style: TextStyle(
                  fontWeight: FontWeight.w400,
                  fontFamily: 'FiraCode',
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 15),
              Text(
                '"Kementrian Kesehatan"',
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w700,
                  fontFamily: 'FiraCode',
                  fontStyle: FontStyle.italic,
                ),
              ),
            ],
          ),

          image: Image.asset(Assets.assetsImagesStuntingChildren, scale: 2.8),
          decoration: PageDecoration(
            titleTextStyle: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w700,
              fontFamily: 'FiraCode',
            ),
            bodyPadding: EdgeInsets.fromLTRB(16.0, 0.0, 16.0, 16.0),
            pageColor: Colors.white,
            imagePadding: EdgeInsets.zero,
          ),
        ),
        PageViewModel(
          title: 'Cara Pencegahan Stunting?',
          bodyWidget: Column(
            children: [
              Text(
                '1.  Memberikan ASI eksklusif pada bayi hingga berusia 6 bulan \n 2.  Memantau perkembangan anak dan membawa ke posyandu secara berkala \n 3.  Mengkonsumsi secara rutin Tablet tambah Darah (TTD) \n 4. Memberikan MPASI yang begizi dan kaya protein hewani untuk bayi yang berusia diatas 6 bulan',
                style: TextStyle(
                  fontWeight: FontWeight.w400,
                  fontFamily: 'FiraCode',
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 15),
              Text(
                '"Kementrian Kesehatan"',
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w700,
                  fontFamily: 'FiraCode',
                  fontStyle: FontStyle.italic,
                ),
              ),
            ],
          ),

          image: Image.asset(Assets.assetsImagesChildren1, scale: 1.8),
          decoration: PageDecoration(
            titleTextStyle: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w700,
              fontFamily: 'FiraCode',
            ),
            bodyPadding: EdgeInsets.fromLTRB(16.0, 0.0, 16.0, 16.0),
            pageColor: Colors.white,
            imagePadding: EdgeInsets.zero,
          ),
        ),
        PageViewModel(
          title: 'Kenali Gejala Stunting Sejak Dini',
          bodyWidget: Column(
            children: [
              Text(
                'Kini dengan hadirnya aplikasi StuntGuard, bunda dapat memproteksi diri agar sang buah hati terhindar dari stunting. mulai dari 1 bulan sampai dengan 60 bulan',
                style: TextStyle(
                  fontWeight: FontWeight.w400,
                  fontFamily: 'FiraCode',
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 15),
              Text(
                '"StuntGuard"',
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w700,
                  fontFamily: 'FiraCode',
                  fontStyle: FontStyle.italic,
                ),
              ),
            ],
          ),

          image: Image.asset(Assets.assetsImagesCalculator, scale: 1.8),
          decoration: PageDecoration(
            titleTextStyle: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w700,
              fontFamily: 'FiraCode',
            ),
            bodyPadding: EdgeInsets.fromLTRB(16.0, 0.0, 16.0, 16.0),
            pageColor: Colors.white,
            imagePadding: EdgeInsets.zero,
          ),
        ),
      ],
      onDone: () => _onIntroEnd(context),
      showDoneButton: true,
      next: const Icon(Icons.arrow_forward, color: Colors.black),
      done: const Text(
        'Mulai',
        style: TextStyle(fontWeight: FontWeight.w600, color: Colors.black),
      ),
      dotsDecorator: DotsDecorator(activeColor: Colors.black),
      curve: Curves.fastLinearToSlowEaseIn,
    );
  }
}
