如何解决Flutter:如何将 Cards UI 或 View 转换为个人视图请找到 HomeScreen Page 代码并尝试转换为详细的个人视图
Flutter:How to convert Cards UI or View to Individual View Please find the HomeScreen Page code and try to convert to detailed individual view
import 'dart:async';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_database/firebase_database.dart';
import 'package:Flutter/material.dart';
import 'package:gadjet_inventory/Form/ListTiles.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
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;
@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]['wcpdfUrl'],values [key]['ugpdfUrl'],values [key]['cattegorrytype'],values [key]['companyname'],values [key]['modelname'],values [key]['seriesname'],values [key]['year'],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),actions: <Widget>[
IconButton(icon: Icon(Icons.refresh,size: 36,color: Colors.white,),onpressed: () {
//debugPrint("Add New Device Cattegorry");
Navigator.push(context,MaterialPageRoute(builder: (context) {
return ListTiles();
}
)
); //
},IconButton(icon: Icon(Icons.home,MaterialPageRoute(builder: (context) {
return MyHomePage();
}
)
); //
},)
],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].wcpdfUrl,dataList[index].cattegorrytype,dataList[index].companyname,dataList[index].modelname,dataList[index].seriesname,dataList[index].year,dataList[index].uploadid,index);
}
),);
}
Widget CardUI(String imgurl,String wcpdfUrl,String cattegorrytype,String companyname,String modelname,String seriesname,String year,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",child: Text( "Year Of MFG:- "
"$year",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),);
}
我已将几个文本项目(一个 imageUrl 和一个 pdf 文档)上传到 Firebase 存储,并且能够在主屏幕视图(卡片 UI 或视图(卡片列表)和列表平铺视图(带有一张图像和一个文本,点击时)中检索它们它应该显示每个单独的视图)。
请指导我如何转换为个人检索页面而不是一组垂直卡片列表。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。