Skip to content

Commit fa48551

Browse files
authored
fix: service card overflow (#1562)
2 parents b8ef47e + 6f85e56 commit fa48551

File tree

2 files changed

+129
-93
lines changed

2 files changed

+129
-93
lines changed

packages/uni_app/lib/view/faculty/widgets/service_cards.dart

Lines changed: 114 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -36,96 +36,126 @@ class AllServiceCardsState extends State<AllServiceCards> {
3636

3737
@override
3838
Widget build(BuildContext context) {
39-
return Column(
40-
children: [
41-
Row(
42-
children: [
43-
const SizedBox(width: 20),
44-
Text(
45-
'Services',
46-
style: Theme.of(context).textTheme.headlineLarge,
47-
),
48-
const Spacer(),
49-
IconButton(
50-
onPressed: changeCardsToList,
51-
icon: const UniIcon(UniIcons.list),
52-
),
53-
IconButton(
54-
onPressed: changeCardsToGrid,
55-
icon: const UniIcon(UniIcons.grid),
56-
),
57-
],
58-
),
59-
Container(
60-
margin: const EdgeInsets.all(7),
61-
child: GridView.count(
62-
crossAxisCount: isGrid ? 2 : 1,
63-
mainAxisSpacing: 2,
64-
crossAxisSpacing: 2,
65-
childAspectRatio: isGrid ? 1.84 : 3.7,
66-
physics: const NeverScrollableScrollPhysics(),
67-
shrinkWrap: true,
39+
final services = <Widget>[
40+
ServicesCard(
41+
name: 'FEUP ${S.of(context).copy_center}',
42+
openingHours: const [
43+
'9:00h - 11:30h',
44+
'12:30h - 18:00h',
45+
],
46+
location: S.of(context).copy_center_building.split(' | ')[0],
47+
telephone: '+351 220 994 122',
48+
),
49+
ServicesCard(
50+
name: 'AEFEUP ${S.of(context).copy_center}',
51+
openingHours: const [
52+
'9:00h - 11:30h',
53+
'12:30h - 18:00h',
54+
],
55+
location: S.of(context).copy_center_building.split(' | ')[1],
56+
telephone: '+351 220 994 132',
57+
58+
),
59+
ServicesCard(
60+
name: S.of(context).dona_bia,
61+
openingHours: const [
62+
'8:30h - 12:00h',
63+
'13:30h - 19:00h',
64+
],
65+
location: S.of(context).dona_bia_building,
66+
telephone: '+351 225 081 416',
67+
68+
),
69+
const ServicesCard(
70+
name: 'Infodesk',
71+
openingHours: [
72+
'9:30h - 13:00h',
73+
'14:00h - 17:30h',
74+
],
75+
location: 'FEUP Entrance',
76+
telephone: '+351 225 081 400',
77+
78+
),
79+
ServicesCard(
80+
name: S.of(context).multimedia_center,
81+
openingHours: const [
82+
'9:00h - 12:30h',
83+
'14:30h - 17:00h',
84+
],
85+
location: '${S.of(context).room} B123',
86+
telephone: '+351 225 081 466',
87+
88+
),
89+
ServicesCard(
90+
name: S.of(context).academic_services,
91+
openingHours: const [
92+
'11:00h - 16:00h',
93+
],
94+
telephone: '+351 225 081 977',
95+
),
96+
];
97+
98+
return Padding(
99+
padding: const EdgeInsets.all(7),
100+
child: Column(
101+
children: [
102+
Row(
68103
children: [
69-
ServicesCard(
70-
name: 'FEUP ${S.of(context).copy_center}',
71-
openingHours: const [
72-
'9:00h - 11:30h',
73-
'12:30h - 18:00h',
74-
],
75-
location: S.of(context).copy_center_building.split(' | ')[0],
76-
telephone: '+351 220 994 122',
77-
),
78-
ServicesCard(
79-
name: 'AEFEUP ${S.of(context).copy_center}',
80-
openingHours: const [
81-
'9:00h - 11:30h',
82-
'12:30h - 18:00h',
83-
],
84-
location: S.of(context).copy_center_building.split(' | ')[1],
85-
telephone: '+351 220 994 132',
86-
87-
),
88-
ServicesCard(
89-
name: S.of(context).dona_bia,
90-
openingHours: const [
91-
'8:30h - 12:00h',
92-
'13:30h - 19:00h',
93-
],
94-
location: S.of(context).dona_bia_building,
95-
telephone: '+351 225 081 416',
96-
104+
const SizedBox(width: 20),
105+
Text(
106+
'Services',
107+
style: Theme.of(context).textTheme.headlineLarge,
97108
),
98-
const ServicesCard(
99-
name: 'Infodesk',
100-
openingHours: [
101-
'9:30h - 13:00h',
102-
'14:00h - 17:30h',
103-
],
104-
location: 'FEUP Entrance',
105-
telephone: '+351 225 081 400',
106-
109+
const Spacer(),
110+
IconButton(
111+
onPressed: changeCardsToList,
112+
icon: const UniIcon(UniIcons.list),
107113
),
108-
ServicesCard(
109-
name: S.of(context).academic_services,
110-
openingHours: const [
111-
'11:00h - 16:00h',
112-
],
113-
telephone: '+351 225 081 977',
114-
),
115-
ServicesCard(
116-
name: S.of(context).multimedia_center,
117-
openingHours: const [
118-
'9:00h - 12:30h',
119-
'14:30h - 17:00h',
120-
],
121-
location: '${S.of(context).room} B123',
122-
telephone: '+351 225 081 466',
123-
114+
IconButton(
115+
onPressed: changeCardsToGrid,
116+
icon: const UniIcon(UniIcons.grid),
124117
),
125118
],
126119
),
127-
),
128-
],
120+
const SizedBox(height: 7),
121+
LayoutBuilder(
122+
builder: (context, constraints) {
123+
if (isGrid) {
124+
const spacing = 7.0;
125+
final itemWidth = (constraints.maxWidth - spacing * 2) / 2;
126+
127+
return Wrap(
128+
spacing: spacing,
129+
runSpacing: spacing,
130+
children: services
131+
.map(
132+
(service) => SizedBox(
133+
width: itemWidth,
134+
child: service,
135+
),
136+
)
137+
.toList(),
138+
);
139+
} else {
140+
return Column(
141+
children: services
142+
.map(
143+
(service) => Padding(
144+
padding: const EdgeInsetsDirectional.only(
145+
start: 7,
146+
end: 7,
147+
bottom: 7,
148+
),
149+
child: service,
150+
),
151+
)
152+
.toList(),
153+
);
154+
}
155+
},
156+
),
157+
],
158+
),
129159
);
130160
}
131161
}

packages/uni_ui/lib/cards/service_card.dart

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,10 @@ class ServiceCard extends StatelessWidget {
2323
tooltip: tooltip,
2424
onClick: () => function?.call(context),
2525
child: Column(
26-
mainAxisAlignment: MainAxisAlignment.center,
26+
mainAxisAlignment: MainAxisAlignment.start,
2727
crossAxisAlignment: CrossAxisAlignment.start,
2828
children: [
29+
const SizedBox(height: 6),
2930
Row(
3031
mainAxisAlignment: openingHours.length == 0
3132
? MainAxisAlignment.center
@@ -55,16 +56,21 @@ class ServiceCard extends StatelessWidget {
5556
color: Theme.of(context).shadowColor,
5657
),
5758
const SizedBox(width: 5),
58-
Column(
59-
children: openingHours.map((hour) {
60-
return Text(
61-
hour,
62-
style: Theme.of(context).textTheme.bodyLarge,
63-
);
64-
}).toList(),
65-
)
59+
Expanded(
60+
child: Column(
61+
crossAxisAlignment: CrossAxisAlignment.start,
62+
children: openingHours.map((hour) {
63+
return Text(
64+
hour,
65+
style: Theme.of(context).textTheme.bodyLarge,
66+
overflow: TextOverflow.ellipsis,
67+
);
68+
}).toList(),
69+
),
70+
),
6671
],
6772
),
73+
const SizedBox(height: 5),
6874
],
6975
),
7076
]),

0 commit comments

Comments
 (0)