布局首页

wallpaper/lib/models/imgnetodel.dart

@@ -0,0 +1,63 @@
+// import 'dart:convert';
+// https://ashamp.github.io/jsonToDartModel/
+class NetImgItem {
+  String? banner;
+  String? original;
+  String? previewThumb;
+  String? source;
+
+  NetImgItem({
+    required this.banner,
+    required this.original,
+    required this.previewThumb,
+    required this.source,
+  });
+  NetImgItem.fromJson(Map<String, dynamic> json) {
+    banner = json['banner'].toString();
+    original = json['original'].toString();
+    previewThumb = json['previewThumb'].toString();
+    source = json['source'].toString();
+  }
+  Map<String, dynamic> toJson() {
+    final data = <String, dynamic>{};
+    data['banner'] = banner;
+    data['original'] = original;
+    data['previewThumb'] = previewThumb;
+    data['source'] = source;
+    return data;
+  }
+}
+
+class NetImgCategory {
+  List<NetImgItem>? data;
+  String? name;
+
+  NetImgCategory({
+    required this.data,
+    required this.name,
+  });
+  NetImgCategory.fromJson(Map<String, dynamic> json) {
+  if (json['data'] != null) {
+  final v = json['data'];
+  final arr0 = <NetImgItem>[];
+  v.forEach((v) {
+  arr0.add(NetImgItem.fromJson(v));
+  });
+    this.data = arr0;
+    }
+    name = json['name'].toString();
+  }
+  Map<String, dynamic> toJson() {
+    final data = <String, dynamic>{};
+    if (this.data != null) {
+      final v = this.data!;
+      final arr0 = [];
+  v.forEach((v) {
+  arr0.add(v.toJson());
+  });
+      data['data'] = arr0;
+    }
+    data['name'] = name;
+    return data;
+  }
+}

wallpaper/lib/pages/homepage/homepage_controller.dart

@@ -1,8 +1,8 @@
 import 'package:get/get.dart';
 import "package:wallpaper/utils/assettool.dart";
-
+import 'package:wallpaper/models/imgnetodel.dart';
 class HomePageController extends GetxController {
-  var typeList = [].obs;
+  var typeList  = <NetImgCategory>[].obs;
 
   @override
   void onReady() async{
@@ -13,13 +13,6 @@ class HomePageController extends GetxController {
 
   void setupTypeListData() async{
     var temData =  await loadWallpaperJsonFromAsset();
-    temData.forEach((element) { })
+    typeList.value = temData.map((e) => NetImgCategory.fromJson(e)).toList();
   }
-
-  @override
-  void onInit() async {
-    super.onInit();
-
-  }
-  
 }

wallpaper/lib/pages/homepage/homepage_view.dart

@@ -2,6 +2,7 @@
 // import 'dart:js';
 
 import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
 import 'package:get/get.dart';
 import 'package:transparent_image/transparent_image.dart';
 import 'package:wallpaper/pages/homepage/homepage_controller.dart';
@@ -39,12 +40,32 @@ class HomePageView extends GetView <HomePageController> {
   Widget getBodyWidget(){
     return Obx(() => GridView.count(
               crossAxisCount: 2,
+              mainAxisSpacing: 10,
+              crossAxisSpacing: 10,
+              childAspectRatio: 0.7,
+              padding: const EdgeInsets.symmetric(horizontal: 10),
               children: List.generate(controller.typeList.length, (index) {
-                return Center(
+                return Stack(//堆叠效果
-                  child: FadeInImage.memoryNetwork(
+                  children: [
+                    FadeInImage.memoryNetwork(
+                    width: double.infinity,
+                    height: double.infinity,
                     placeholder: kTransparentImage,
-                    image: controller.typeList[index]["data"][0]["previewThumb"],
+                    image: controller.typeList[index].data![0].previewThumb!,
+                    fit: BoxFit.cover,
                   ),
+                   Align(
+                    alignment: Alignment.bottomCenter,
+                    child: Text(
+                      controller.typeList[index].name!,
+                      style: const TextStyle(
+                        color: Colors.white
+                      ),
+
+                    ),
+                  ),
+                  
+                  ],
                 );
               }),
             ));