问题描述
我已将一些文本项、图像项和 pdf 文档上传到 Firebase 数据库/存储，并且能够在主屏幕（即垂直 CardsUI 列表以及带有一张图像、一个标题和一个副标题的 ListTiles 视图中检索所有这些文件。
但无法构建 DetailView，即单个商品的详细信息而不是多个卡片并导航到 DetailView 页面 单击任何列表磁贴项。
我的 HomeScreen.dart 代码如下
import 'dart:async';
import 'dart:io';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_database/firebase_database.dart';
import 'package:Flutter/material.dart';
import 'package:Fluttertoast/Fluttertoast.dart';
import 'package:gadjet_inventory/Form/ListTileFeed.dart';
import 'package:gadjet_inventory/Form/ListTiles.dart';
import 'package:gadjet_inventory/Form/RetrievePage.dart';
import 'package:gadjet_inventory/main.dart';
import 'package:intl/intl.dart';
import 'package:gadjet_inventory/Form/Data.dart';
import 'UploadData.dart';
import 'package:pdf_Flutter/pdf_Flutter.dart';
// ignore: must_be_immutable
import 'package:url_launcher/url_launcher.dart';
class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
List<Data> dataList = [];
List<bool> favList = [];
bool searchState = false;
FirebaseAuth auth = FirebaseAuth.instance;
String get data => null;
@override
void initState() {
// Todo: implement initState
super.initState();
DatabaseReference referenceData = FirebaseDatabase.instance.reference().child("Data");
referenceData.once().then((DataSnapshot dataSnapShot) {
dataList.clear();
favList.clear();
var keys = dataSnapShot.value.keys;
var values = dataSnapShot.value;
for (var key in keys) {
Data data = new Data(
values [key]['imgurl'],values [key]['wcimgurl'],values [key]['wcpdfUrl'],values [key]['cattegorrytype'],values [key]['companyname'],values [key]['modelname'],values [key]['seriesname'],values [key]['serielnumber'],key
//key is the uploadid
);
dataList.add(data);
auth.currentUser().then((value) {
DatabaseReference reference = FirebaseDatabase.instance.reference().child("Data").child(key).child("Fav")
.child(value.uid).child("state");
reference.once().then((DataSnapshot snapShot){
if(snapShot.value!=null){
if(snapShot.value=="true"){
favList.add(true);
}else{
favList.add(false);
}
}else{
favList.add(false);
}
});
});
}
Timer(Duration(seconds: 1),(){
setState(() {
//
});
});
});
}
int selectedRadioTile;
String get path => null;
String get title => null;
setSelectedRadioTile(int val) {
setState(() {
selectedRadioTile = val;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.lightGreen,//Color(0xffffffff),appBar: AppBar(
centerTitle: true,backgroundColor: Colors.blue,title: new Text("Device Details",style:
TextStyle(fontSize: 20),textAlign: TextAlign.center),),body: dataList.length == 0
? Center(
child: Text("No Data Available",style: TextStyle(fontSize: 30),))
: ListView.builder(
itemCount: dataList.length,itemBuilder: (_,index) {
return CardUI(dataList[index].imgurl,dataList[index].wcimgurl,dataList[index].wcpdfUrl,dataList[index].cattegorrytype,dataList[index].companyname,dataList[index].modelname,dataList[index].seriesname,dataList[index].uploadid,index);
}
),);
}
Widget CardUI(String imgurl,String wcimgurl,String wcpdfUrl,String cattegorrytype,String companyname,String modelname,String seriesname String uploadId,int index) {
return Card(
elevation: 7,margin: EdgeInsets.all(15),//color: Color(0xffff2fc3),color:Colors.blueGrey,child: Container(
color: Colors.white,margin: EdgeInsets.all(1.5),padding: EdgeInsets.all(10),child: Column(
children: <Widget>[
Image.network(
imgurl != null
? imgurl
: '',width: 500,height: 500,Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: <Widget>[
Expanded(
flex: 1,child: Padding(
padding: const EdgeInsets.all(8.0),child: Text( "Cattegorry Type:- "
"$cattegorrytype",style: TextStyle(color: Colors.black),],child: Theme(
data: ThemeData(
hintColor: Colors.blue,child: Text( "Company Name:- "
"$companyname",Expanded(
flex: 1,child: Text( "Model Name:- "
"$modelname",child: Text( "Series Name:- "
"$seriesname",RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),color: Colors.blue,child: Text("Warranty Card",style: TextStyle(fontSize: 18,color: Colors.white),RadioListTile(
value: 1,groupValue: selectedRadioTile,title: Text("PDF"),//subtitle: Text("Upload PDF File"),/* onChanged: (val) {
filePicker(context);
},*/
activeColor: Colors.red,Padding(padding: EdgeInsets.only(top: 15)),// _buildPDF1Field(context),PDF.network(
wcpdfUrl != null
? wcpdfUrl
: '',width: 600,height: 1000,placeHolder: Image.asset("assets/images/pdf.png",height: 600,width: 500),SizedBox(height: 24),RadioListTile(
value: 2,title: Text("Image"),//subtitle: Text("Upload W Card Image"),/* onChanged: (val) {
openWCImagePickerModal(context);
//_startWCUpload();
},*/
activeColor: Colors.blue,Image.network(
wcimgurl != null
? wcimgurl
: 'https://www.testingxperts.com/wp-content/uploads/2019/02/placeholder-img.jpg',);
}
}.
现在我的要求是在 ListTiles 中单击时显示单个项目的详细信息视图，它应该导航到 DetailPage 并显示该特定项目的详细信息。
如何构建DetailView页面？并从 ListTilePage 导航
解决方法
我使用单独的 DetailView.dart 页面实现了这一点。
我已经单独创建了 DetailView.dart 页面
class DetailView extends StatefulWidget {
@override
_DetailViewState createState() => _DetailViewState();
}
class _DetailViewState extends State<DetailView> {
List<Data> dataList = [];
List<bool> favList = [];
bool searchState = false;
FirebaseAuth auth = FirebaseAuth.instance;
String get data => null;
} etc