how to display drop down next to he elevated button - flutter

Question

this is two search and dropdown sections I have implemented using animated_custom_dropdown.
I want that "Get Quote Filter " button to place next to the(right side) set location drop down..................................................................................................................................
........................................................................................................................................
import 'package:animated_custom_dropdown/custom_dropdown.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import '../constants/colors.dart';
const _labelStyle = TextStyle(fontWeight: FontWeight.w600);
class FantomSearch extends StatefulWidget {
const FantomSearch({Key? key}) : super(key: key);
#override
State<FantomSearch> createState() => _FantomSearchState();
}
class _FantomSearchState extends State<FantomSearch> {
final formKey = GlobalKey<FormState>();
final List<String> list = ['Heating', 'Electricians', 'Repair or Service', 'Accessibility Planner'];
final jobRoleFormDropdownCtrl = TextEditingController(),
jobRoleSearchDropdownCtrl = TextEditingController();
#override
void dispose() {
jobRoleFormDropdownCtrl.dispose();
jobRoleSearchDropdownCtrl.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
return Scaffold(
//backgroundColor:AppGreen,
appBar: AppBar(
systemOverlayStyle: SystemUiOverlayStyle.dark.copyWith(
statusBarColor: AppGreen,
),
backgroundColor: AppGreen,
elevation: .10,
),
body: Container(
height: 200,
color: AppGreen,
child: ListView(
padding: const EdgeInsets.all(16.0),
children: [
CustomDropdown.search(
hintText: 'Search Services',
items: list,
controller: jobRoleSearchDropdownCtrl,
fillColor: DarkGreen,
),
const SizedBox(height: 24),
// using form for validation
Form(
key: formKey,
child: Padding(
padding: const EdgeInsets.only(right: 150),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
CustomDropdown(
hintText: 'Set Location',
items: list,
controller: jobRoleFormDropdownCtrl,
excludeSelected: false,
fillColor: DarkGreen,
),
const SizedBox(height: 16),
SizedBox(
child: ElevatedButton(
onPressed: () {
if (!formKey.currentState!.validate()) {
return;
}
},
child: const Text(
'Get Quotes filter',
style: TextStyle(fontWeight: FontWeight.w600),
),
style: ElevatedButton.styleFrom(primary: ContainerGreen),
),
),
],
),
),
),
],
),
),
);
}
}

Answer 1

From your code, I believe that currently "Get quotes filter" showing below to the "Set Location" correct?
If this is the issue, you need to update Column widget to Row which is inside Padding.
Like,
Container(
height: 200,
child: SingleChildScrollView(
child: Column(
children: [
/**/
Row(
children: [
Expanded(
child: CustomDropdown.search(
hintText: 'Search Services',
items: list,
controller: jobRoleSearchDropdownCtrl,
fillColor: DarkGreen,
),
),
Padding(
padding: EdgeInsets.only(left: 15, top: 20, right: 15, bottom: 20),
child: Text(
"cancel"
),
)
],
),
const SizedBox(height: 24),
// using form for validation
Padding(
padding: const EdgeInsets.only(right: 70),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
/**/
Expanded(
child: CustomDropdown(
hintText: 'Set Location',
items: list,
controller: jobRoleFormDropdownCtrl,
excludeSelected: false,
fillColor: DarkGreen,
),
),
const SizedBox(width: 16),
SizedBox(
child: ElevatedButton(
onPressed: () {
if (!formKey.currentState!.validate()) {
return;
}
},
child: const Text(
'Get Quotes filter',
style: TextStyle(fontWeight: FontWeight.w600),
),
style: ElevatedButton.styleFrom(primary: Colors.green),
),
),
],
),
),
],
),
),
)
If this still not worked, please share the expected output and what you are getting now. Because I am not able to compile your code due to custom widgets.
I have updated the color so please update it as per your need. The output is something like,