Flutter Custom Title Dropdown (Material Page Filter)

I did find some things that helped my situation... The widgets DropdownButtonHideUnderline and Theme will help control how the dropdown looks in the title of the AppBar

new AppBar(  title: new Theme(      child: new DropdownButtonHideUnderline(      child: new DropdownButton<String>(        value: _value,        items: <DropdownMenuItem<String>>[          new DropdownMenuItem(            child: new Text('My Page'),            value: 'one',          ),        ],         onChanged: (String value) {          setState(() => _value = value);        },      ),    ),     data: new ThemeData.dark(),  ),),

However, now the popup's background color is black to match the dark theme... not sure if there's a way to have the theme not affect the actual popup.

I personally can live with the black background color of the popup... unless someone can also solve that.

Do something like this:

appBar: AppBar(    title: Row(      mainAxisSize: MainAxisSize.min,      mainAxisAlignment: MainAxisAlignment.center,      children: <Widget>[        DropdownButton(          value: _selectedItem,          items: _dropdownMenuItems,          underline: SizedBox(height: 0,),          //underline: SizedBox(),          onChanged: onChangeDropdownItem,        ),       ],      ),    ),

Then change your dropdown menu's style here:

/// Initialize dropdown menuList<DropdownMenuItem<String>> buildDropdownMenuItems(List menu) {List<DropdownMenuItem<String>> items = List();for (String li in menu) {  items.add(    DropdownMenuItem(      value: li,      child: SizedBox(        width: 100,         child: Text(li, style:  TextStyle(color: labelColor, fontWeight:                FontWeight.bold),                textAlign: TextAlign.center, overflow: TextOverflow.ellipsis,),),    ),  );}return items;

}

Please just change your code to the one I have mentioned below and this one might work for your app., sorry for the bad editing of the picture. I have included the full code for your reference,.

import 'package:flutter/material.dart';void main() {  runApp(new MaterialApp(    home: new MyHomePage(),  ));}class MyHomePage extends StatefulWidget {  MyHomePage({Key key, this.title}) : super(key: key);  final String title;  @override  _MyHomePageState createState() => new _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {  String _value = 'one';  @override  void initState() {    super.initState();  }  @override  Widget build(BuildContext context) {    return new Scaffold(      appBar: new AppBar(          title:          new Row(         mainAxisSize: MainAxisSize.min,        children: <Widget>[          new DropdownButton<String>(            value: _value,            items: <DropdownMenuItem<String>>[              new DropdownMenuItem(                child: new Text('one'),                value: 'one',              ),              new DropdownMenuItem(child: new Text('two'), value: 'two'),            ],            onChanged: (String value) {              setState(() => _value = value);            },          ),        ],      ) ),      body: new Center(        child: new Column(          mainAxisAlignment: MainAxisAlignment.center,          children: <Widget>[            new Text(              'hello world',            ),          ],        ),      ),    );  }}

See the demo here: https://codepen.io/andrerpena/pen/LYpZRqG