import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:nearle/views/helpers/constants/Colorconstants.dart';
import 'package:nearle/views/helpers/constants/Font_constant.dart';

class Intro3 extends GetResponsiveView {
  final VoidCallback onFinish;

  Intro3({
    super.key,
    required this.onFinish,
    required PageController controller,
  });

  @override
  Widget builder() {
    final height = screen.height;
    final width = screen.width;

    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.light.copyWith(
        // Keep status bar transparent over the purple gradient on this screen
        statusBarColor: Colors.transparent,
        statusBarIconBrightness: Brightness.light,
        statusBarBrightness: Brightness.dark,
        systemNavigationBarColor: Colors.white,
      ),
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(height * 0.35),
          child: AppBar(
            automaticallyImplyLeading: false,
            elevation: 0,
            backgroundColor: Colors.transparent,
            systemOverlayStyle: SystemUiOverlayStyle.light.copyWith(
              statusBarColor: Colors.transparent,
              statusBarIconBrightness: Brightness.light,
              statusBarBrightness: Brightness.dark,
            ),
            flexibleSpace: Container(
              width: double.infinity,
              height: height * 0.36,
              decoration: BoxDecoration(
                gradient: const LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: [
                    ColorConstants.primaryColor,
                    ColorConstants.primaryColor,
                  ],
                ),
                borderRadius: BorderRadius.only(
                  bottomLeft: Radius.circular(width * 0.49),
                  bottomRight: Radius.circular(width * 0.49),
                ),
              ),
              child: SafeArea(
                child: Padding(
                  padding: EdgeInsets.symmetric(
                    horizontal: width * 0.06,
                    vertical: height * 0.02,
                  ),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      SizedBox(height: height * 0.06),
                      Text(
                        'Deliver. Earn.\nRepeat.',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: height * 0.045,
                          fontWeight: FontWeight.bold,
                          color: Colors.white,
                          height: 1.2,
                          fontFamily: FontConstants.fontFamily,
                        ),
                      ),
                      SizedBox(height: height * 0.02),
                      Text(
                        'Track your trips, and enjoy \npayouts every week.',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: height * 0.019,
                          color: Colors.white.withOpacity(0.9),
                          height: 1.4,
                          fontFamily: FontConstants.fontFamily,
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),

        body: SafeArea(
          child: Column(
            children: [
              Expanded(
                child: Padding(
                  padding: EdgeInsets.symmetric(horizontal: width * 0.05),
                  child: Transform.translate(
                    offset: Offset(0, -height * 0.01),
                    child: Image.asset(
                      'assets/images/intro3.png',
                      height: height * 0.35,
                      width: width * 0.75,
                      fit: BoxFit.contain,
                    ),
                  ),
                ),
              ),

              SizedBox(height: height * 0.04),

              // Button at bottom
              Padding(
                padding: EdgeInsets.symmetric(horizontal: width * 0.08),
                child: SizedBox(
                  width: double.infinity,
                  height: 55,
                  child: ElevatedButton(
                    onPressed: onFinish,
                    style: ElevatedButton.styleFrom(
                      backgroundColor: ColorConstants.primaryColor,
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12),
                      ),
                    ),
                    child: Text(
                      "Start",
                      style: TextStyle(
                        fontSize: 21,
                        fontWeight: FontWeight.bold,
                        fontFamily: FontConstants.fontFamily,
                        color: Colors.white,
                      ),
                    ),
                  ),
                ),
              ),
              SizedBox(height: height * 0.03),
            ],
          ),
        ),
      ),
    );
  }
}