Skip to content

Commit 051927f

Browse files
authored
Merge pull request #23 from amfoss/development
random chore
2 parents f0b7ba6 + f1be575 commit 051927f

File tree

1 file changed

+72
-111
lines changed

1 file changed

+72
-111
lines changed

lib/components/track_tile.dart

Lines changed: 72 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
1+
import 'package:ammentor/screen/track/model/track_model.dart';
12
import 'package:flutter/material.dart';
23
import 'package:ammentor/components/theme.dart';
3-
import 'package:ammentor/screen/track/model/track_model.dart';
44

55
class TrackTile extends StatelessWidget {
66
final Track track;
77
final void Function(Track) onTrackTap;
8+
9+
/// Control flags for optional UI
810
final bool showDescription;
911
final bool showProgress;
1012
final bool showImage;
1113

12-
TrackTile({
14+
const TrackTile({
1315
super.key,
1416
required this.track,
1517
required this.onTrackTap,
@@ -20,122 +22,81 @@ class TrackTile extends StatelessWidget {
2022

2123
@override
2224
Widget build(BuildContext context) {
23-
final screenWidth = MediaQuery.of(context).size.width;
24-
final screenHeight = MediaQuery.of(context).size.height;
25+
final double screenWidth = MediaQuery.of(context).size.width;
26+
final double screenHeight = MediaQuery.of(context).size.height;
2527

26-
return Padding(
27-
padding: EdgeInsets.symmetric(
28-
vertical: screenHeight * 0.012,
29-
horizontal: screenWidth * 0.035,
30-
),
31-
child: Material(
32-
color: Colors.transparent,
33-
borderRadius: BorderRadius.circular(20),
34-
child: InkWell(
35-
borderRadius: BorderRadius.circular(20),
36-
onTap: () => onTrackTap(track),
37-
splashColor: AppColors.white.withOpacity(0.05),
38-
child: Container(
39-
padding: EdgeInsets.all(screenWidth * 0.04),
40-
decoration: BoxDecoration(
41-
color: Colors.white.withOpacity(0.03),
42-
borderRadius: BorderRadius.circular(20),
43-
boxShadow: [
44-
BoxShadow(
45-
color: Colors.black.withOpacity(0.08),
46-
blurRadius: 14,
47-
offset: Offset(0, 6),
28+
return GestureDetector(
29+
onTap: () => onTrackTap(track),
30+
child: Container(
31+
margin: EdgeInsets.symmetric(vertical: screenHeight * 0.008),
32+
padding: EdgeInsets.all(screenWidth * 0.03),
33+
decoration: BoxDecoration(
34+
color: AppColors.cardBackground,
35+
borderRadius: BorderRadius.circular(18),
36+
),
37+
child: Row(
38+
children: [
39+
if (showImage)
40+
SizedBox(
41+
width: screenWidth * 0.15,
42+
height: screenHeight * 0.08,
43+
child: ClipRRect(
44+
borderRadius: BorderRadius.circular(8),
45+
child: Image.network(
46+
track.imageUrl,
47+
fit: BoxFit.cover,
48+
errorBuilder: (context, error, stackTrace) {
49+
return Container(
50+
color: Colors.grey[300],
51+
child: const Center(child: Text('No Image')),
52+
);
53+
},
54+
),
4855
),
49-
],
50-
border: Border.all(
51-
color: Colors.white.withOpacity(0.08),
52-
),
53-
gradient: LinearGradient(
54-
colors: [
55-
Colors.white.withOpacity(0.04),
56-
Colors.white.withOpacity(0.01),
57-
],
58-
begin: Alignment.topLeft,
59-
end: Alignment.bottomRight,
6056
),
61-
),
62-
child: Row(
63-
children: [
64-
if (showImage)
65-
ClipRRect(
66-
borderRadius: BorderRadius.circular(12),
67-
child: Image.network(
68-
track.imageUrl,
69-
width: screenWidth * 0.16,
70-
height: screenWidth * 0.16,
71-
fit: BoxFit.cover,
72-
errorBuilder: (_, __, ___) => Icon(
73-
Icons.image_not_supported,
74-
color: Colors.grey,
75-
),
57+
if (showImage) SizedBox(width: screenWidth * 0.05),
58+
Expanded(
59+
child: Column(
60+
crossAxisAlignment: CrossAxisAlignment.start,
61+
children: [
62+
Text(
63+
track.name,
64+
style: AppTextStyles.subheading(context).copyWith(
65+
fontSize: 18,
66+
fontWeight: FontWeight.bold,
7667
),
7768
),
78-
if (showImage) SizedBox(width: screenWidth * 0.04),
79-
Expanded(
80-
child: Column(
81-
crossAxisAlignment: CrossAxisAlignment.start,
82-
children: [
83-
Text(
84-
track.name,
85-
style: AppTextStyles.subheading(context).copyWith(
86-
fontSize: 18,
87-
fontWeight: FontWeight.w600,
88-
letterSpacing: 0.2,
89-
color: AppColors.white,
90-
),
69+
if (showDescription) SizedBox(height: screenHeight * 0.01),
70+
if (showDescription)
71+
Text(
72+
track.description,
73+
style: AppTextStyles.subheading(context).copyWith(
74+
color: AppColors.white.withOpacity(0.7),
75+
fontSize: 14,
9176
),
92-
if (showDescription)
93-
Padding(
94-
padding: EdgeInsets.only(top: screenHeight * 0.006),
95-
child: Text(
96-
track.description,
97-
maxLines: 2,
98-
overflow: TextOverflow.ellipsis,
99-
style: AppTextStyles.body(context).copyWith(
100-
fontSize: 14,
101-
color: AppColors.white.withOpacity(0.7),
102-
),
103-
),
104-
),
105-
if (showProgress)
106-
Padding(
107-
padding: EdgeInsets.only(top: screenHeight * 0.014),
108-
child: Column(
109-
crossAxisAlignment: CrossAxisAlignment.start,
110-
children: [
111-
ClipRRect(
112-
borderRadius: BorderRadius.circular(6),
113-
child: LinearProgressIndicator(
114-
value: track.progress / 100,
115-
minHeight: screenHeight * 0.01,
116-
backgroundColor: Colors.white.withOpacity(0.05),
117-
valueColor: AlwaysStoppedAnimation<Color>(
118-
AppColors.primary,
119-
),
120-
),
121-
),
122-
SizedBox(height: screenHeight * 0.004),
123-
Text(
124-
'${track.progress.toInt()}% Complete',
125-
style: AppTextStyles.body(context).copyWith(
126-
fontSize: 12,
127-
color: AppColors.white.withOpacity(0.6),
128-
),
129-
),
130-
],
131-
),
132-
),
133-
],
134-
),
135-
),
136-
],
77+
),
78+
if (showProgress) ...[
79+
const SizedBox(height: 8),
80+
LinearProgressIndicator(
81+
value: track.progress / 100,
82+
backgroundColor: Colors.grey[700],
83+
valueColor: const AlwaysStoppedAnimation<Color>(
84+
AppColors.primary,
85+
),
86+
),
87+
const SizedBox(height: 4),
88+
Text(
89+
'${track.progress.toInt()}% Complete',
90+
style: TextStyle(
91+
color: AppColors.white.withOpacity(0.7),
92+
fontSize: 12,
93+
),
94+
),
95+
],
96+
],
97+
),
13798
),
138-
),
99+
],
139100
),
140101
),
141102
);

0 commit comments

Comments
 (0)