import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:news_getx/theme/app_colors.dart';
import 'package:news_getx/theme/app_radii.dart';

import 'welcome_controller.dart';

class WelcomePage extends GetView<WelcomeController> {
  const WelcomePage({Key? key}) : super(key: key);

  Widget _buildPageHeadTitle() {
    return Container(
      margin: EdgeInsets.only(top: (60 + 44).h),
      child: Text(
        "Features",
        textAlign: TextAlign.center,
        style: TextStyle(
          fontSize: 24.sp,
          color: AppColors.primaryText,
          fontFamily: "Montserrat",
          fontWeight: FontWeight.w600,
          height: 1,
        ),
      ),
    );
  }

  Widget _buildPageHeaderDetail() {
    return Container(
      width: 242.w,
      height: 70.h,
      margin: EdgeInsets.only(top: 14.h),
      child: Text(
        "The best of news channels all in one place. "
        "Trusted sources and personalized news for you.",
        textAlign: TextAlign.center,
        style: TextStyle(
          color: AppColors.primaryText,
          fontFamily: "Avenir",
          fontSize: 16.sp,
          height: 1.3,
          fontWeight: FontWeight.normal,
        ),
      ),
    );
  }

  // 设定好了宽度
  // 宽度 80 + 20 + 195 = 295
  Widget _buildFeatureItem(String imageName, String intro, double marginTop) {
    return Container(
      width: 295.w,
      height: 80.h,
      margin: EdgeInsets.only(top: marginTop.h),
      child: Row(
        children: <Widget>[
          SizedBox(
            width: 80.w,
            height: 80.h,
            child: Image.asset(
              "assets/images/$imageName.png",
              fit: BoxFit.none,
            ),
          ),
          Spacer(),
          SizedBox(
            width: 195.w,
            child: Text(
              intro,
              textAlign: TextAlign.left,
              style: TextStyle(
                color: AppColors.primaryText,
                fontFamily: "Avenir",
                fontWeight: FontWeight.normal,
                fontSize: 16.sp,
              ),
            ),
          )
        ],
      ),
    );
  }

  Widget _buildStartButton() {
    return Container(
      width: 295.w,
      height: 44.h,
      margin: EdgeInsets.only(bottom: 20.h),
      child: TextButton(
        style: ButtonStyle(
          // 设置字体大小
          textStyle: MaterialStateProperty.all(TextStyle(fontSize: 16.sp)),
          shape: MaterialStateProperty.all(
            RoundedRectangleBorder(borderRadius: Radii.k6pxRadius),
          ),
          backgroundColor: MaterialStateProperty.resolveWith((states) {
            // 按压背景色
            if (states.contains(MaterialState.pressed)){
              return Colors.blue[200];
            }
            return AppColors.primaryElement;
          }),
          // 用于前景色调整 字体
          foregroundColor: MaterialStateProperty.resolveWith((states) {
            // 焦点但是没按的背景色
            if (states.contains(MaterialState.focused) && !states.contains(MaterialState.pressed)) {
              return Colors.blue;
            }else if (states.contains(MaterialState.pressed)) {
              return Colors.deepPurple;
            }
            return AppColors.primaryElementText;
          })
        ),
        onPressed: controller.handleNavSignIn,
        child: Text("Get started"),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          children: <Widget>[
            // 标题
            _buildPageHeadTitle(),
            // 标题信息
            _buildPageHeaderDetail(),
            // 每一项内容
            _buildFeatureItem(
              "feature-1",
              "Compelling photography and typography provide a beautiful reading",
              86,
            ),
            _buildFeatureItem(
              "feature-2",
              "Sector news never shares your personal data with advertisers or publishers",
              40,
            ),
            _buildFeatureItem(
              "feature-3",
              "You can get Premium to unlock hundreds of publications",
              40,
            ),
            Spacer(),
            // 按钮
            _buildStartButton()
          ],
        ),
      ),
    );
  }
}