Loading different PDF document using ListView Builder in Flutter - flutter

Question

I am a newbie in Flutter and in programming as well.
I have created a ListView with several Cards inside each card points to separate PDF documents which are loaded using the package 'advance_pdf_viewer'. I have done all this hardcoded. But I would like to generate the Cards and the pdf document dynamically. How can I do that?
Here are my existing Codes:
Main.dart file:
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'c9Bban.dart';
import 'c9Bbanbakoron.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'HSC Textbooks',
theme: ThemeData(
primarySwatch: Colors.cyan,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
void initState() {
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'১ম - ১০ম শ্রেণী পাঠ্যবই',
style: TextStyle(
//fontSize: 14,
fontFamily: 'Baloo Da',
),
),
centerTitle: true,
),
body: ListView(children: [
Card(
child: Row(children: <Widget>[
Expanded(
flex: 8, // 20%
child: Container(
child: ListTile(
leading: ConstrainedBox(
constraints: BoxConstraints(
maxWidth: 44,
maxHeight: 44,
),
child: Image.asset('images/bangla bakaron.jpg',
fit: BoxFit.cover),
),
title: Text(
'বাংলা ব্যাকরণ',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
fontFamily: 'Baloo da',
),
),
subtitle: Text(
'জাতীয় শিক্ষাক্রম ও পাঠ্যপুস্তক বোর্ড',
style: TextStyle(
fontSize: 12,
fontFamily: 'Baloo da',
),
),
),
),
),
Expanded(
flex: 4, // 20%
child: GestureDetector(
onTap: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => C9Bbanbakoron()));
},
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey[300])),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(FontAwesomeIcons.book, color: Colors.green),
SizedBox(height: 5),
Text('বাংলা ও ইংরেজি ভার্সন',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
)),
],
),
),
),
),
]),
),
Card(
child: Row(children: <Widget>[
Expanded(
flex: 8, // 20%
child: Container(
child: ListTile(
leading: ConstrainedBox(
constraints: BoxConstraints(
maxWidth: 44,
maxHeight: 44,
),
child: Image.asset('images/BGS.jpg', fit: BoxFit.cover),
),
title: Text(
'বাংলাদেশ ও বিশ্বপরিচয়',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
fontFamily: 'Baloo da',
),
),
subtitle: Text(
'জাতীয় শিক্ষাক্রম ও পাঠ্যপুস্তক বোর্ড',
style: TextStyle(
fontSize: 12,
fontFamily: 'Baloo da',
),
),
),
),
),
Expanded(
flex: 2, // 20%
child: GestureDetector(
onTap: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => C9Bbgs()));
},
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey[300])
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(FontAwesomeIcons.book, color: Colors.green),
SizedBox(height: 5),
Text('বাংলা ভার্সন',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
)
),
],
),
),
),
),
Expanded(
flex: 2, // 20%
child: GestureDetector(
onTap: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => C9Ebgs()));
},
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey[300])
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(FontAwesomeIcons.book, color: Colors.green),
SizedBox(height: 5),
Text('ইংরেজি ভার্সন',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
)
),
],
),
),
),
),
]),
),
]),
);
}
}
c9Bban.dart file (one of the separate files for loading separate PDF documents. Rest of the files are exactly the same except the PDF URL is different):
import 'package:flutter/material.dart';
import 'package:advance_pdf_viewer/advance_pdf_viewer.dart';
class C9Bban extends StatefulWidget {
#override
_MyC9Bban createState() => _MyC9Bban();
}
class _MyC9Bban extends State<C9Bban> {
bool _isLoading = true;
PDFDocument document;
#override
void initState() {
super.initState();
loadDocument();
}
loadDocument() async {
document = await PDFDocument.fromURL('https://storage.googleapis.com/school_books/Class9/ban/Bangla%20Sahitto.pdf');
setState(() => _isLoading = false);
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
toolbarHeight: 20,
),
body: Center(
child: _isLoading
? Center(child: CircularProgressIndicator())
: PDFViewer(
document: document,
zoomSteps: 1,
),
),
bottomNavigationBar: BottomAppBar(
child: Container(
height: 85.0,
),
),
),
);
}
}
So far I was able to create this which works for creating the ListView Cards dynamically.
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:advance_pdf_viewer/advance_pdf_viewer.dart';
import 'c9Bban.dart';
import 'c9Bbansohopath.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'HSC Textbooks',
theme: ThemeData(
primarySwatch: Colors.cyan,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
List booklist = [
Books(
image: 'Bangla.jpg',
bookname: 'Bangla',
banbookname: 'C9Bban',
),
Books(
image: 'bangla shapath.jpg',
bookname: 'Bangla Sahapath',
banbookname: 'C9Bbansohopath',
),
];
void updateBook(index) {
Navigator.push(context, MaterialPageRoute(builder: (context) => booklist[index].banbookname));
}
return Scaffold(
appBar: AppBar(
title: Text('Book App'),
centerTitle: true,
),
body: ListView.builder(
itemCount: booklist.length,
itemBuilder: (context, index) {
return Card(
child: Row(children: <Widget>[
Expanded(
flex: 8, // 20%
child: Container(
child: ListTile(
leading: ConstrainedBox(
constraints: BoxConstraints(
maxWidth: 44,
maxHeight: 44,
),
child:
Image.asset('images/islam.jpg', fit: BoxFit.cover),
),
title: Text(
booklist[index].bookname,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
fontFamily: 'Baloo da',
),
),
subtitle: Text(
'জাতীয় শিক্ষাক্রম ও পাঠ্যপুস্তক বোর্ড',
style: TextStyle(
fontSize: 12,
fontFamily: 'Baloo da',
),
),
),
),
),
Expanded(
flex: 2, // 20%
child: GestureDetector(
onTap: () {
updateBook(index);
},
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey[300])),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(FontAwesomeIcons.book, color: Colors.green),
SizedBox(height: 5),
Text('বাংলা ভার্সন',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
)),
],
),
),
),
),
Expanded(
flex: 2, // 20%
child: GestureDetector(
onTap: () {
updateBook(index);
},
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey[300])),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(FontAwesomeIcons.book, color: Colors.green),
SizedBox(height: 5),
Text('ইংরেজি ভার্সন',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
)),
],
),
),
),
),
]),
);
}),
);
}
}
class Books {
String image;
String bookname;
String banbookname;
String engbook;
Books({this.image, this.bookname, this.banbookname});
}