import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:wallpaperx/common/components/navigation_bar/custom_appbar.dart';
import 'package:wallpaperx/generated/assets.dart';
import 'package:wallpaperx/page/about/about_controller.dart';
import 'package:wallpaperx/res/values/strings.dart';

class AboutView extends GetView<AboutController> {
  const AboutView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(Assets.imagesSettingBackground),
            fit: BoxFit.cover,
          ),
        ),
        alignment: Alignment.topCenter,
        child: Column(
          children: [
            CustomAppbar(
              "About",
              backgroundColor: Colors.transparent,
              titleStyle: TextStyle(
                color: Colors.white,
                fontSize: 24.sp,
                fontWeight: FontWeight.w600,
              ),
            ),
            Expanded(
              child: ListView(
                children: [
                  SizedBox(height: 50.w),
                  Container(
                    clipBehavior: Clip.hardEdge,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(15.r),
                    ),
                    child: Image.asset(
                      Assets.iconIconApp,
                      width: 100.w,
                      height: 100.w,
                    ),
                  ),
                  SizedBox(height: 30.w),
                  Obx(() {
                    return RichText(
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                      textAlign: TextAlign.center,
                      text: TextSpan(
                        text: appName,
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 22.sp,
                          fontWeight: FontWeight.w600,
                        ),
                        children: [
                          TextSpan(
                            text: '\n${controller.versionName.value}',
                            style: TextStyle(
                              color: Colors.grey,
                              fontSize: 12.sp,
                            ),
                          ),
                        ],
                      ),
                    );
                  }),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}