import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:session2_53/introduceinside.dart';
import 'package:session2_53/main.dart';

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

  @override
  State<Introduce> createState() => _NewsState();
}

class _NewsState extends State<Introduce> {
  void _gotohomePage() {
    Navigator.pushNamed(context, "/home");
  }

  void _gotointroduceinsidepage(){
    Navigator.pushNamed(context, "/introduceinside");
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: rootBundle
          .loadString("assets/職類介紹.json")
          .then((s) => jsonDecode(s)),
      builder: (context, snapshot) {
        final List<dynamic>? data = snapshot.data as List<dynamic>?;
        return Stack(
          children: [
            Positioned.fill(
              child: Image.asset("assets/background.png", fit: BoxFit.cover),
            ),
            Scaffold(
              backgroundColor: Colors.transparent,
              appBar: AppBar(
                backgroundColor: Colors.transparent,
                leading: IconButton(
                  onPressed: _gotohomePage,
                  icon: Image.asset("assets/f6.png"),
                ),
                title: Row(children: [SizedBox(width: 100), Text("職類介紹")]),
              ),
              body: GridView.builder(
                padding: EdgeInsets.all(20),
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  crossAxisSpacing: 20,
                  mainAxisSpacing: 20,

                ),
                itemCount: data?.length,
                itemBuilder:(context,index){
                  return InkWell(
                    onTap: (){
                      introduceid=index;
                      _gotointroduceinsidepage();
                    },
                    child: Container(
                      clipBehavior: Clip.antiAlias,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(10)
                      ),
                      child: Column(
                        children: [Image.asset("assets/introduce/${data![index]["skills_code"]}${data[index]["skills_code"] == "a8" ? ".jpg" : ".png"}"),
                        Text(data[index]["name"],style: TextStyle(color: Color(0xff1D1AC7),fontSize: 20),)],
                      ),
                    ),
                  );
                },
              ),
            ),
          ],
        );
      },
    );
  }
}