我想在页面视图中显示数据库中的数据,滑动屏幕,如user1_name -> user1_age -> user2_name -> user2_age ->等,以显示来自数据库的所有数据,但我的代码只显示第一个用户数据(只有一个)。在gridview中显示数据库的所有数据。我正在添加代码,请帮助我修改什么:
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/src/widgets/placeholder.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'package:student/student_pages/student_detail.dart';
import '../utils/constants.dart';
String website = Constants.website;
class UserDetail extends StatefulWidget {
final String subjectId;
const UserDetail({super.key, required this.userId});
@override
State<UserDetail> createState() =>
_UserDetailState();
}
class _UserDetailState extends State<UserDetail> {
get userId => widget.userId;
get itemCount => null;
Future<List> getUserData() async {
String url = '$website/get_user_data.php';
var data = {'user_id': userId};
var response = await http.post(Uri.parse(url), body: data);
var userDetail= jsonDecode(response.body.toString());
return userDetail;
}
PageController pageController = PageController();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('User Detail'),
),
body: SafeArea(
child: Column(
children: <Widget>[
Expanded(
child: Container(
padding: const EdgeInsets.all(10),
alignment: Alignment.center,
margin: EdgeInsets.all(10),
width: double.infinity,
decoration: BoxDecoration(
color: Colors.red,
borderRadius:
BorderRadius.circular(20), //border corner radius
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5), //color of shadow
spreadRadius: 5, //spread radius
blurRadius: 7, // blur radius
offset: Offset(0, 2), // changes position of shadow
),
],
),
child: Text(
'Swip left, right',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 15,
),
),
),
),
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(
itemCount: snapshot.data!.length,
itemBuilder: (context, index) {
var userName = snapshot.data![index]['user_name'];
var userAge = snapshot.data![index]['user_age'];
return PageView(
pageSnapping: true,
controller: pageController,
children: [
Container(
child: Text(
"$index:- $userName,",
),
),
Container(
child: Text(
'$userAge',
),
),
],
);
},
),
);
}
return Center(
child: CircularProgressIndicator(),
);
},
),
),
],
),
),
);
}
}
1条答案
按热度按时间blmhpbnm1#
我一开始没有看到它,但是你在你的
PageView.builder
小部件中返回了另一个PageView
小部件。将PageView小部件嵌套在一起并不是一个好的做法,因为这会导致滚动复杂化。这是正确的代码。