Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

It is not accepted to change the value in the Dropdown in the bottom sheet?

Flutter . It is not accepted to change the value in the Dropdown in the bottom sheet ?

I made all the changes and it didn’t work !

Knowing that on a normal screen it works

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

please help me

class _AddPostState extends State<AddPost> {

  List<DropdownMenuItem<String>> get itemse{
    List<DropdownMenuItem<String>> menuItems = [

      DropdownMenuItem(
        value: '1',
        child: Container(

          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(width: 15,),
              Icon(Icons.lock_outline,size: 19,),
              SizedBox(width: 10,),
              Text('Only me'),
            ],
          ),
        ),
      ),
      DropdownMenuItem(
        value: '2',
        child: Container(

          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(width: 15,),
              Icon(Icons.group_rounded,size: 19,),
              SizedBox(width: 10,),
              Text('Friends'),
            ],
          ),
        ),
      ),
      DropdownMenuItem(
        value: '3',
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(width: 15,),
              Icon(Icons.public,size: 19,),
              SizedBox(width: 10,),
              Text('Public'),
            ],
          ),
        ),
      ),

    ];
    return menuItems;
  }
  String? selectedValue = '1';

  @override
  Widget build(BuildContext context) {

     return Scaffold(
      appBar: AppBar(
        foregroundColor: Colors.black,
        backgroundColor: Colors.white,
        title: const Text('Add Post'),
      ),
      body: Center(
        child: ElevatedButton(
          child: const Text('Open'),
          onPressed: bottomSheet,
        ),
      ),
    );
  }

  void bottomSheet(){
    showCupertinoModalBottomSheet(
      expand: true,
      context: context,
      backgroundColor: Colors.transparent,
      builder: (context) =>Scaffold(
        appBar: AppBar(backgroundColor: Colors.white,foregroundColor: Colors.black,),

          body: Column(
          children: [
            DropdownButton(
              value: selectedValue,
              items: itemse,

              onChanged: (y) {
                setState(() {
                  selectedValue = y! as String;
                });

              },

            )
          ],
        ),
      ),
    );
  }

}

Seven days, I searched for a solution to the problem and did not find the solution. Please help

enter image description here

>Solution :

From the code i see you are not using the StatefulBuilder which will rebuild the sheet and change your value. From the code that you provided i have just created and example for you which might help you.

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<DropdownMenuItem<String>> get itemse {
    List<DropdownMenuItem<String>> menuItems = [
      DropdownMenuItem(
        value: '1',
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(
                width: 15,
              ),
              Icon(
                Icons.lock_outline,
                size: 19,
              ),
              SizedBox(
                width: 10,
              ),
              Text('Only me'),
            ],
          ),
        ),
      ),
      DropdownMenuItem(
        value: '2',
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(
                width: 15,
              ),
              Icon(
                Icons.group_rounded,
                size: 19,
              ),
              SizedBox(
                width: 10,
              ),
              Text('Friends'),
            ],
          ),
        ),
      ),
      DropdownMenuItem(
        value: '3',
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: const [
              SizedBox(
                width: 15,
              ),
              Icon(
                Icons.public,
                size: 19,
              ),
              SizedBox(
                width: 10,
              ),
              Text('Public'),
            ],
          ),
        ),
      ),
    ];
    return menuItems;
  }

  String? selectedValue = '1';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        foregroundColor: Colors.black,
        backgroundColor: Colors.white,
        title: const Text('Add Post'),
      ),
      body: Center(
        child: ElevatedButton(
          child: const Text('Open'),
          onPressed: bottomSheet,
        ),
      ),
    );
  }

  void bottomSheet() {
    showCupertinoModalBottomSheet(
      expand: true,
      context: context,
      backgroundColor: Colors.transparent,
      builder: (context) =>
          StatefulBuilder(builder: (BuildContext context, StateSetter setState /*You can rename this!*/) {
        return Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.white,
            foregroundColor: Colors.black,
          ),
          body: Column(
            children: [
              DropdownButton(
                value: selectedValue,
                items: itemse,
                onChanged: (y) {
                  setState(() {
                    selectedValue = y! as String;
                  });
                },
              )
            ],
          ),
        );
      }),
    );
  }
}

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading