Fix suggestions positioning using CompositedTransformFollower to properly position dropdown below TextField

This commit is contained in:
Leon Bösche
2026-01-24 05:06:30 +01:00
parent 65ad05ac76
commit deb8b50bb9

View File

@@ -38,6 +38,7 @@ class _OrganizationSettingsDialogState
List<User> _userSuggestions = [];
late final TextEditingController usernameController;
final GlobalKey textFieldKey = GlobalKey();
final LayerLink link = LayerLink();
@override
void initState() {
@@ -509,45 +510,48 @@ class _OrganizationSettingsDialogState
),
),
const SizedBox(height: 16),
TextField(
key: textFieldKey,
controller: usernameController,
cursorColor: AppTheme.accentColor,
decoration: InputDecoration(
hintText: 'Username',
hintStyle: TextStyle(color: AppTheme.secondaryText),
contentPadding: const EdgeInsets.all(12),
border: OutlineInputBorder(
borderSide: BorderSide(
color: AppTheme.accentColor.withValues(alpha: 0.3),
CompositedTransformTarget(
link: link,
child: TextField(
key: textFieldKey,
controller: usernameController,
cursorColor: AppTheme.accentColor,
decoration: InputDecoration(
hintText: 'Username',
hintStyle: TextStyle(color: AppTheme.secondaryText),
contentPadding: const EdgeInsets.all(12),
border: OutlineInputBorder(
borderSide: BorderSide(
color: AppTheme.accentColor.withValues(alpha: 0.3),
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: AppTheme.accentColor.withValues(alpha: 0.3),
),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppTheme.accentColor),
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: AppTheme.accentColor.withValues(alpha: 0.3),
),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppTheme.accentColor),
),
),
style: TextStyle(color: AppTheme.primaryText),
onChanged: (value) async {
if (value.length > 2) {
try {
_userSuggestions = await widget.orgApi.searchUsers(
widget.organization.id,
value,
);
} catch (e) {
style: TextStyle(color: AppTheme.primaryText),
onChanged: (value) async {
if (value.length > 2) {
try {
_userSuggestions = await widget.orgApi.searchUsers(
widget.organization.id,
value,
);
} catch (e) {
_userSuggestions = [];
}
setState(() {});
} else {
_userSuggestions = [];
setState(() {});
}
setState(() {});
} else {
_userSuggestions = [];
setState(() {});
}
},
},
),
),
DropdownButtonFormField<String>(
initialValue: selectedRole,
@@ -645,11 +649,11 @@ class _OrganizationSettingsDialogState
if (_userSuggestions.isNotEmpty) {
children.add(
Positioned(
top: 240,
left: 0,
right: 0,
CompositedTransformFollower(
link: link,
offset: const Offset(0, 48),
child: Container(
width: 300,
height: 100,
decoration: BoxDecoration(
color: AppTheme.primaryBackground,