refactor: update tag display to use a stretched column layout for better text wrapping

This commit is contained in:
pradeepkumar
2026-05-07 15:07:18 +05:30
parent 2760c14954
commit 8a859ff56c

View File

@@ -1857,55 +1857,66 @@ class _AgentEditProfileScreenState
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
if (tags.isNotEmpty)
Padding(
padding: const EdgeInsets.only(bottom: 8),
child: Wrap(
spacing: 6,
runSpacing: 6,
children: tags.map((tag) {
return Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: AppColors.accentOrange.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(20),
border: Border.all(
color: AppColors.accentOrange.withValues(alpha: 0.3),
// Stretched column so each tag pill spans the available width.
// Long text wraps inside the chip instead of overflowing.
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
for (int i = 0; i < tags.length; i++) ...[
if (i > 0) const SizedBox(height: 6),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
decoration: BoxDecoration(
color: AppColors.accentOrange.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(20),
border: Border.all(
color: AppColors.accentOrange.withValues(alpha: 0.3),
),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
tags[i],
softWrap: true,
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 13,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
),
const SizedBox(width: 8),
GestureDetector(
onTap: () {
final newList = List<String>.from(tags)
..remove(tags[i]);
setValue(newList);
},
child: const Padding(
padding: EdgeInsets.only(top: 2),
child: Icon(
Icons.close,
size: 16,
color: AppColors.hintText,
),
),
),
],
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
tag,
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 13,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
const SizedBox(width: 4),
GestureDetector(
onTap: () {
final newList = List<String>.from(tags)..remove(tag);
setValue(newList);
},
child: const Icon(
Icons.close,
size: 14,
color: AppColors.hintText,
),
),
],
),
);
}).toList(),
],
],
),
),
TextFormField(