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( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
if (tags.isNotEmpty) if (tags.isNotEmpty)
Padding( Padding(
padding: const EdgeInsets.only(bottom: 8), padding: const EdgeInsets.only(bottom: 8),
child: Wrap( // Stretched column so each tag pill spans the available width.
spacing: 6, // Long text wraps inside the chip instead of overflowing.
runSpacing: 6, child: Column(
children: tags.map((tag) { crossAxisAlignment: CrossAxisAlignment.stretch,
return Container( children: [
padding: const EdgeInsets.symmetric( for (int i = 0; i < tags.length; i++) ...[
horizontal: 12, if (i > 0) const SizedBox(height: 6),
vertical: 6, Container(
), padding: const EdgeInsets.symmetric(
decoration: BoxDecoration( horizontal: 12,
color: AppColors.accentOrange.withValues(alpha: 0.1), vertical: 8,
borderRadius: BorderRadius.circular(20), ),
border: Border.all( decoration: BoxDecoration(
color: AppColors.accentOrange.withValues(alpha: 0.3), 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( TextFormField(