DEPARTMENT OF COMPUTER SCIENCE
Submitted To: MAAM – RIDA ZAHRA
Submitted By: MUSHARRIF IFTIKHAR BUTT
(049)
Department: Bs (Computer Science)
Section: B
Semester: 8TH - Semester
Due Date: 29 – MARCH – 2024
TASKS 1:
CODE:
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text(
"Card Widget Lab",
style: TextStyle(
fontWeight: FontWeight.bold,
),
),
),
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(top: 10.0, left: 10.0), //
Add padding to the top
child: Card(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.circular(8.0),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal:
6.0,vertical: 6.0), // Adjust padding here
child: Image.asset(
'assets/images/hy.jpg',
width: 250, // Adjust image width here
height: 150,
fit: BoxFit.cover,
),
),
),
const Padding(
padding: EdgeInsets.only(top: 8.0, left: 11.0),
child: Text(
'HACKER_XD_333',
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.bold,
),
),
),
const Padding(
padding: EdgeInsets.only(left: 10.0, top: 5.0),
child: Text(
'FLUTTER DEVELOPER',
style: TextStyle(
fontSize: 14.0,
color: Colors.grey,
),
),
),
const Padding(
padding: EdgeInsets.only(left: 10.0,top: 5.0),
child: Text(
'Experience: 10 years',
style: TextStyle(
fontSize: 14.0,
color: Colors.grey,
),
),
),
],
),
),
),
const SizedBox(height: 10), // Adding space between the cards
Padding(
padding: const EdgeInsets.only(top: 20.0, left: 10.0), //
Add padding to the top
child: Card(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.circular(8.0),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal:
6.0,vertical: 6.0), // Adjust padding here
child: Image.asset(
'assets/images/hy.jpg',
width: 250, // Adjust image width here
height: 150,
fit: BoxFit.cover,
),
),
),
const Padding(
padding: EdgeInsets.only(top: 8.0, left: 11.0),
child: Text(
'HACKER_XD_333',
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.bold,
),
),
),
const Padding(
padding: EdgeInsets.only(left: 10.0, top: 5.0),
child: Text(
'MOBILE APP DEVELOPER',
style: TextStyle(
fontSize: 14.0,
color: Colors.grey,
),
),
),
const Padding(
padding: EdgeInsets.only(left: 10.0,top: 5.0),
child: Text(
'Experience: 10 years',
style: TextStyle(
fontSize: 14.0,
color: Colors.grey,
),
),
),
],
),
),
),
],
),
),
),
);
}
}
TASKS 2:
CODE:
import 'package:flutter/material.dart';
void main() => runApp(const StaffApp());
class StaffApp extends StatelessWidget {
const StaffApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Staff Profiles',
home: Scaffold(
appBar: AppBar(
title: const Text('Staff Profiles'),
),
body: GridView.count(
crossAxisCount: 2,
children: const [
ProfileCard(
imagePath: 'assets/images/image1.jpg',
name: 'Tom',
occupation: 'Full Stack Developer',
age: 28,
),
ProfileCard(
imagePath: 'assets/images/abc.jpg',
name: 'Sara',
occupation: 'Machine Learning Engineer',
age: 29,
),
ProfileCard(
imagePath: 'assets/images/image1.jpg',
name: 'Mike',
occupation: 'Frontend Developer',
age: 30,
),
ProfileCard(
imagePath: 'assets/images/abc.jpg',
name: 'Linda',
occupation: 'Data Analyst',
age: 31,
),
ProfileCard(
imagePath: 'assets/images/image1.jpg',
name: 'Robert',
occupation: 'UI/UX Designer',
age: 32,
),
ProfileCard(
imagePath: 'assets/images/abc.jpg',
name: 'Julia',
occupation: 'System Architect',
age: 33,
),
],
),
),
);
}
}
class ProfileCard extends StatelessWidget {
final String imagePath;
final String name;
final String occupation;
final int age;
const ProfileCard({
super.key,
required this.imagePath,
required this.name,
required this.occupation,
required this.age,
});
@override
Widget build(BuildContext context) {
return SizedBox(
height: 10.0, // Adjust the height of the Container
width: 10.0, // Adjust the width of the Container
child: Card(
child: Column(
children: [
CircleAvatar(
radius: 45, // Adjust the CircleAvatar radius
backgroundImage: AssetImage(imagePath),
),
const SizedBox(height: 0),
Text(name, style: const TextStyle(fontSize: 20)), // Adjust the
text size
Text('Role: $occupation', style: const TextStyle(fontSize:
18)), // Adjust the text size
Text('Age: $age', style: const TextStyle(fontSize: 18)), //
Adjust the text size
],
),
),
);
}
}
