Onboarding

// Some code
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
        children: [
          PageOne(),
          PageTwo(),
          PageOne(),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        Image.asset('assets/delivery/page_one.png'),
        SizedBox(
          height: 100,
        ),
        Text(
          'Buy groceries',
          style: GoogleFonts.poppins(
            textStyle: TextStyle(
              fontSize: 25,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),

        Padding(
          padding: const EdgeInsets.only(
            left: 47,
            right: 47,
            top: 12,
            bottom: 47,
          ),
          child: Text(
            'Lorem ipsum dolor sit amet, consetetur '
            'sadipscing elitr, sed diam nonumy',
            textAlign: TextAlign.center,
            style: GoogleFonts.poppins(
              textStyle: TextStyle(
                fontSize: 15,
                fontWeight: FontWeight.w500,
                color: Color(0xFF868889),
              ),
            ),
          ),
        ),
        Row(
          children: [
            TextButton(
              onPressed: () {},
              child: Text(
                'Skip',
                style: GoogleFonts.poppins(
                  textStyle: TextStyle(
                    fontWeight: FontWeight.w500,
                    color: Color(0xFFC4C4C4),
                    fontSize: 15,
                  ),
                ),
              ),
            ),
            Spacer(),
            CircleAvatar(
              radius: 5,
              backgroundColor: Color(0xFF6CC51D),
            ),
            SizedBox(
              width: 5,
            ),
            CircleAvatar(
              radius: 5,
              backgroundColor: Color(0xFFDCDCDC),
            ),
            SizedBox(
              width: 5,
            ),
            CircleAvatar(
              radius: 5,
              backgroundColor: Color(0xFFDCDCDC),
            ),
            Spacer(),
            TextButton(
              onPressed: () {},
              child: Text(
                'Next',
                style: GoogleFonts.poppins(
                  textStyle: TextStyle(
                    fontWeight: FontWeight.w500,
                    color: Color(0xFF6CC51D),
                    fontSize: 15,
                  ),
                ),
              ),
            ),
          ],
        ),
        SizedBox(
          height: 75,
        ),
      ],
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Column();
  }
}

Last updated