我想在flutter PageView中多屏显示来自mysql数据库的单行数据。以下网站包含mysql数据库的json数据。https://telugu-signaler.000webhostapp.com/get_user.php。它包含10个用户数据，对于每个用户，它具有相应的列，即user_first_name、user_last_name、user_district和user_state。我想在一个屏幕中显示user_first_name和user_last_name，向右滑动后在另一个屏幕中显示user_district和user_state。因此，对于10个用户，将有20个页面滑动。
下面我的代码显示所有4个领域的用户数据在一个单一的屏幕上，但我希望的逻辑如上所述。请帮我解决这个逻辑错误。

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

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

  @override
  State<GetUserData> createState() => _GetUserDataState();
}

class _GetUserDataState extends State<GetUserData> {
  late PageController pageController;

  @override
  void initState() {
    super.initState();
    pageController = PageController();
  }

  @override
  void dispose() {
    pageController.dispose();
    super.dispose();
  }

  Future<List> getUserData() async {
    String url = 'https://telugu-signaler.000webhostapp.com/get_user.php';
    var response = await http.post(Uri.parse(url), body: '');
    var allUserData = jsonDecode(response.body.toString());
    return allUserData;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Get User Data'),
      ),
      body: SafeArea(
        child: Column(
          children: <Widget>[
            Expanded(
              flex: 8,
              child: FutureBuilder<List<dynamic>>(
                future: getUserData(),
                builder: (context, snapshot) {
                  if (snapshot.hasData) {
                    return Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: PageView.builder(
                        controller: pageController,
                        itemCount: snapshot.data!.length,
                        itemBuilder: (context, index) {
                          var userFirstName =
                              snapshot.data![index]['user_first_name'];
                          var userLastName =
                              snapshot.data![index]['user_last_name'];
                          var userDistrict =
                              snapshot.data![index]['user_district'];
                          var userState = snapshot.data![index]['user_state'];

                          return Column(
                            children: [
                              Container(
                                color: Color.fromARGB(255, 231, 229, 229),
                                //// I want following two Text() in one screen/page
                                child: Text(
                                  '$index- First Name: $userFirstName',
                                  style: TextStyle(fontSize: 30),
                                ),
                              ),
                              Container(
                                color: Color.fromARGB(255, 231, 229, 229),
                                child: Text(
                                  'Last Name: $userLastName',
                                  style: TextStyle(fontSize: 30),
                                ),
                              ),
                              SizedBox(
                                height: 50,
                              ),

                              //// and after swipe right, I want to display following two Text() in another screen/page
                              Container(
                                color: Colors.lightGreen,
                                child: Text(
                                  '$index- District: $userDistrict',
                                  style: TextStyle(fontSize: 30),
                                ),
                              ),
                              Container(
                                color: Colors.lightGreen,
                                child: Text(
                                  'State: $userState',
                                  style: TextStyle(fontSize: 30),
                                ),
                              ),
                            ],
                          );
                        },
                      ),
                    );
                  }
                  return const Center(
                    child: CircularProgressIndicator(),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}