带有可点击卡片 back4app 的 Flutter Future Builder
Posted
技术标签:
【中文标题】带有可点击卡片 back4app 的 Flutter Future Builder【英文标题】:flutter future builder with clickable cards back4app 【发布时间】:2021-11-20 02:49:30 【问题描述】: import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:image_picker_widget/image_picker_widget.dart';
import 'package:image_picker_widget/enum/image_picker_widget_shape.dart';
import 'package:mall_daur/Catalog/Catalog.dart';
import 'package:mall_daur/Shop/ShopPage.dart';
import 'package:mall_daur/Usaha/UsahaPage.dart';
import 'package:mall_daur/functions/Maps.dart';
import 'package:mall_daur/functions/globalParse.dart';
import 'package:mall_daur/models/Notifications.dart';
import 'package:mall_daur/ordering/OrderPage2.dart';
import 'package:mall_daur/ordering/PickUpOrderInd.dart';
import 'package:persistent_bottom_nav_bar/persistent-tab-view.dart';
import 'dart:async';
import 'package:parse_server_sdk/parse_server_sdk.dart';
class Home2 extends StatefulWidget
@override
_Home2State createState() => _Home2State();
class _Home2State extends State<Home2>
String _nama;
var _pts;
String _Tempo;
var _Tempo2;
List<ParseObject> results = <ParseObject>[];
@override
Widget build(BuildContext context)
Timer.run(() async
_Tempo = await UserAccess().namaLengkap();
setState(()
_nama = _Tempo;
);
);
// Timer.run(() async
// _Tempo2 = await UserAccess().Point();
// setState(()
// _pts = _Tempo2;
// );
// );
return SafeArea(
child: Scaffold(
appBar: AppBar(
title: Text('Daur.id'),
titleTextStyle: TextStyle(
fontSize: 48.0,
fontWeight: FontWeight.bold
),
centerTitle: true,
shadowColor: Colors.black,
backgroundColor: CupertinoColors.activeBlue,
elevation: 5.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(
bottom: Radius.circular(20),
),
),
actions: [
IconButton(icon: Icon(CupertinoIcons.bell_fill, color: Colors.black,), onPressed: ()
pushNewScreen(
context,
screen: Notifikasi(),
withNavBar: false,
pageTransitionAnimation: PageTransitionAnimation.cupertino,
);
)
],
),
body: Stack(
children: [
Container(
decoration: BoxDecoration(
color: Colors.white
),
),
SingleChildScrollView(
child: Container(
padding: EdgeInsets.fromLTRB(15.0, 10.0, 15.0, 40.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Align(alignment: Alignment.centerLeft,child: Text('Hai, $_nama',textAlign: TextAlign.start,style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold))),
SizedBox(height: 5.0,),
Text('Mari kita bersihkan sampah dari lingkungan',style: TextStyle(fontSize: 14.0),)
],
),
SizedBox(width: 30.0,),
ImagePickerWidget(
diameter: 60,
initialImage: "https://daur.id/daurid.png" ,
shape: ImagePickerWidgetShape.circle,
isEditable: false,
),
],
),
SizedBox(height: 20.0,),
Center(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
color: Colors.blueAccent,
boxShadow: [BoxShadow(
color: Colors.black,
blurRadius: 10.0,
offset: Offset(0, 2)
)],),
height: 300.0,
width: 350.0,
child: Scaffold(
appBar: AppBar(
title: Text('Order Individu'),
),
body: SingleChildScrollView(
child: FutureBuilder<List<ParseObject>>(
future: getCardList(),
builder: (context, snapshot)
switch (snapshot.connectionState)
case ConnectionState.none:
case ConnectionState.waiting:
return Center(
child: Container(
width: 100,
height: 100,
child: CircularProgressIndicator()),
);
default:
if (snapshot.hasError)
return Center(
child: Text("Error..."),
);
else
ListView.builder(
itemCount: results.length,
itemBuilder: (context,index)
// String varname =
// snapshot.data[index].get<String>('NamaPemesan');
return Card(
child: ListTile(
onTap: (),
title: Text(results[index].toString()),
),
);
);
),
),
),
),
),
// Box Iklan
SizedBox(height: 30.0),
Container(
height: 100.0,
width: 100.0,
color: Colors.blue,
child: Text('iklan marzano dll'),
),
],
),
),
)
],
),
),
);
Future<void> DetailAlert(BuildContext context) async
return showDialog(
context: context,
builder: (context)
return AlertDialog(
title: Text('Informasi Pemesan', style: TextStyle(fontWeight: FontWeight.bold,fontSize: 20.0)),
content: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Informasi Penjemputan', style: TextStyle(fontWeight: FontWeight.bold,fontSize: 18.0),),
Divider(color: Colors.black,),
Text('Tanggal Penjemputan '),
Text('Alamat Penjemputan '),
SizedBox(height: 20.0,),
Text('Informasi Sampah', style: TextStyle(fontWeight: FontWeight.bold,fontSize: 18.0),),
Divider(color: Colors.black,),
],
),
),
actions: <Widget>[
ElevatedButton(
child: Text('Ubah Ulang'),
onPressed: ()
setState(()
Navigator.pop(context);
);
,
),
ElevatedButton(
child: Text('Order Pick Up'),
onPressed: (),
),
],
);
);
Future<List<ParseObject>> getCardList() async
// final QueryBuilder<ParseObject> parseQuery =
// QueryBuilder<ParseObject>(ParseObject('OrderIndividu'));
//
// final ParseResponse apiResponse = await parseQuery.query();
//
// if (apiResponse.success && apiResponse.results != null)
// // Let's show the results
// for (var o in apiResponse.results)
// print((o as ParseObject).toString());
//
//
// setState(()
// results = apiResponse.results as List<ParseObject>;
// );
// else
// results = [];
//
// QueryBuilder<ParseObject> queryPublisher =
// QueryBuilder<ParseObject>(ParseObject('OrderIndividu'));
// final ParseResponse apiResponse = await queryPublisher.query();
//
// if (apiResponse.success && apiResponse.results != null)
// return apiResponse.results as List<ParseObject>;
// else
// return [];
//
所以这是我的完整代码,我正在尝试在这张循环加载的图片中实现某种可点击的卡片。
所以任何人都可以提供示例代码来实现这一点?让卡片出现在这些通告上,因为我确实尝试在未来构建并获取所有对象..出于某种原因,我什至无法将其上传到屏幕上
注意: 我在未来的构建器getCardList()上给出//,因为它一直在调用解析(无论如何这都很好,因为我构建了实时加载对象)但是如果有人可以帮助我停止调用响应。请帮忙
【问题讨论】:
【参考方案1】:在 initState
上调用您的 API。还有你的Timer.run
。
试试这个
class Home2 extends StatefulWidget
@override
_Home2State createState() => _Home2State();
class _Home2State extends State<Home2>
String _nama;
var _pts;
String _Tempo;
var _Tempo2;
List<ParseObject> results = <ParseObject>[];
@override
void initState()
super.initState();
Timer.run(() async
_Tempo = await UserAccess().namaLengkap();
setState(()
_nama = _Tempo;
);
);
getCardList().then((value)
setState(()
results = value;
);
).catchError((e)
// handle error
);
@override
Widget build(BuildContext context)
// Timer.run(() async
// _Tempo2 = await UserAccess().Point();
// setState(()
// _pts = _Tempo2;
// );
// );
return SafeArea(
child: Scaffold(
appBar: AppBar(
title: Text('Daur.id'),
titleTextStyle: TextStyle(fontSize: 48.0, fontWeight: FontWeight.bold),
centerTitle: true,
shadowColor: Colors.black,
backgroundColor: CupertinoColors.activeBlue,
elevation: 5.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(
bottom: Radius.circular(20),
),
),
actions: [
IconButton(
icon: Icon(
CupertinoIcons.bell_fill,
color: Colors.black,
),
onPressed: ()
pushNewScreen(
context,
screen: Notifikasi(),
withNavBar: false,
pageTransitionAnimation: PageTransitionAnimation.cupertino,
);
)
],
),
body: Stack(
children: [
Container(
decoration: BoxDecoration(color: Colors.white),
),
SingleChildScrollView(
child: Container(
padding: EdgeInsets.fromLTRB(15.0, 10.0, 15.0, 40.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Align(
alignment: Alignment.centerLeft,
child: Text('Hai, $_nama',
textAlign: TextAlign.start, style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold))),
SizedBox(
height: 5.0,
),
Text(
'Mari kita bersihkan sampah dari lingkungan',
style: TextStyle(fontSize: 14.0),
)
],
),
SizedBox(
width: 30.0,
),
ImagePickerWidget(
diameter: 60,
initialImage: "https://daur.id/daurid.png",
shape: ImagePickerWidgetShape.circle,
isEditable: false,
),
],
),
SizedBox(
height: 20.0,
),
Center(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
color: Colors.blueAccent,
boxShadow: [BoxShadow(color: Colors.black, blurRadius: 10.0, offset: Offset(0, 2))],
),
height: 300.0,
width: 350.0,
child: Scaffold(
appBar: AppBar(
title: Text('Order Individu'),
),
body: SingleChildScrollView(
child: results.length == 0
? CircularProgressIndicator()
: ListView.builder(
itemCount: results.length,
itemBuilder: (context, index)
// String varname =
// snapshot.data[index].get<String>('NamaPemesan');
return Card(
child: ListTile(
onTap: () ,
title: Text(results[index].toString()),
),
);
)),
),
),
),
// Box Iklan
SizedBox(height: 30.0),
Container(
height: 100.0,
width: 100.0,
color: Colors.blue,
child: Text('iklan marzano dll'),
),
],
),
),
)
],
),
),
);
Future<void> DetailAlert(BuildContext context) async
return showDialog(
context: context,
builder: (context)
return AlertDialog(
title: Text('Informasi Pemesan', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0)),
content: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Informasi Penjemputan',
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18.0),
),
Divider(
color: Colors.black,
),
Text('Tanggal Penjemputan '),
Text('Alamat Penjemputan '),
SizedBox(
height: 20.0,
),
Text(
'Informasi Sampah',
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18.0),
),
Divider(
color: Colors.black,
),
],
),
),
actions: <Widget>[
ElevatedButton(
child: Text('Ubah Ulang'),
onPressed: ()
setState(()
Navigator.pop(context);
);
,
),
ElevatedButton(
child: Text('Order Pick Up'),
onPressed: () ,
),
],
);
);
Future<List<ParseObject>> getCardList() async
// final QueryBuilder<ParseObject> parseQuery =
// QueryBuilder<ParseObject>(ParseObject('OrderIndividu'));
//
// final ParseResponse apiResponse = await parseQuery.query();
//
// if (apiResponse.success && apiResponse.results != null)
// // Let's show the results
// for (var o in apiResponse.results)
// print((o as ParseObject).toString());
//
//
// setState(()
// results = apiResponse.results as List<ParseObject>;
// );
// else
// results = [];
//
// QueryBuilder<ParseObject> queryPublisher =
// QueryBuilder<ParseObject>(ParseObject('OrderIndividu'));
// final ParseResponse apiResponse = await queryPublisher.query();
//
// if (apiResponse.success && apiResponse.results != null)
// return apiResponse.results as List<ParseObject>;
// else
// return [];
//
【讨论】:
以上是关于带有可点击卡片 back4app 的 Flutter Future Builder的主要内容,如果未能解决你的问题,请参考以下文章