A Flutter package with an advanced dropdown Button which let you give different design on DropdownButton

Last update: Dec 17, 2021

Use decorated_dropdown button to add DropdownButton with decoration properties like box shadow, border, background color, border radius, gradient background, icons, and many more in Flutter App.

Features

This package will help you to add decoration on DropdownButton

Getting started

To start using this package, add the following lines in pubspec.yaml file.

dependencies:
  decorated_dropdownbutton: ^0.0.1

Import package in your script:

import 'package:decorated_dropdownbutton/decorated_dropdownbutton.dart';

Usage

You can use DecoratedDropdownButton() like below:

DecoratedDropdownButton(
    value: "item1",
    items: [ 
        DropdownMenuItem(
            child: Text("Dropdown Item I"), 
            value: "item1"
        ),

        DropdownMenuItem(
            child: Text("Dropdown Item II"), 
            value: "item2"
        )
    ],
    onChanged: (value){
       print("You selected $value");
    },
)

Add More Design to DecoratedDropdownButton():

DecoratedDropdownButton(
    value: "item1",
    items: [ 
        DropdownMenuItem(
            child: Text("Dropdown Item I"), 
            value: "item1"
        ),

        DropdownMenuItem(
            child: Text("Dropdown Item II"), 
            value: "item2"
        )
    ],
    onChanged: (value){
       print("You selected $value");
    },
    color: Colors.orange, //background color
    border: Border.all(color:Colors.redAccent, width: 2), //border 
    borderRadius: BorderRadius.circular(20), //border radius
    style: TextStyle( //text style
        color:Colors.white,
        fontSize: 20
    ),
    icon: Icon(Icons.arrow_downward), //icon
    iconEnableColor: Colors.white, //icon enable color
    dropdownColor: Colors.orange,  //dropdown background color
)

Additional information

You can get further more information regarding dropdown button in Flutter.

Visit, FlutterCampus.com for Flutter Tutorials, Guides and App Templates

GitHub

https://github.com/hpchari/decorated_dropdownbutton
You might also like...

Full screen menu for Flutter apps to give a user a broad variety of variants in beautiful way

Full screen menu for Flutter apps to give a user a broad variety of variants in beautiful way

Full screen menu for Flutter apps to give a user a broad variety of variants in beautiful way

May 24, 2022

Swipeable button view - Create Ripple Animated Pages With Swipeable Button View

Swipeable button view - Create Ripple Animated Pages With Swipeable Button View

swipeable_button_view You can create ripple animated pages with swipeable_button

Apr 22, 2022

Arissettingsmenuexm - Settings Menu with different choices by clicking on a Popup Menu Button in Flutter

Arissettingsmenuexm - Settings Menu with different choices by clicking on a Popup Menu Button in Flutter

Flutter Tutorial - Settings Menu & AppBar Dropdown Menu Show a Flutter Settings

Jan 9, 2022

A CustomPaint example where we can draw with different colors and different stroke sizes

A CustomPaint example where we can draw with different colors and different stroke sizes

CustomPaint A CustomPaint example where we can draw with different colors and different stroke sizes. A Flutter application which runs on iOS, Android

Dec 27, 2021

The LoginRadius Flutter SDK will let you integrate LoginRadius' customer identity platform with your Flutter application(s).

TODO: Put a short description of the package here that helps potential users know whether this package might be useful for them. Features TODO: List w

Feb 3, 2022

A WEB 3 Exploration Flutter APP that let you view NFTS

A WEB 3 Exploration Flutter APP that let you view NFTS

It is simply a WEB 3 Exploration APP that let you view NFTS (News about web 3 ar

Jul 27, 2022

A simplistic mobile application with Material design that helps you communicate using different phonetic alphabets

A simplistic mobile application with Material design that helps you communicate using different phonetic alphabets

Speak NATO A simplistic mobile application with Material design that helps you communicate using different phonetic alphabets. Installation Screenshot

Oct 9, 2021

Dropdown List Choices Widget For Flutter

Dropdown List Choices Widget For Flutter

Dropdown List Choices Highly versatile Widget to search through a single or mult

Aug 10, 2022

A Flutter select form field widget. It shows a list of options in a dropdown menu.

A Flutter select form field widget. It shows a list of options in a dropdown menu.

select_form_field A Flutter select field widget. It shows a list of options in a dropdown menu. This widget extend TextField and has a similar behavio

Jun 27, 2022

Related

This project is a NGO which let you donate anything or even let you ask for help to people.

ngo_app This app is written in flutter using dart language. Getting Started This project is a NGO which let you donate anything or even let you ask fo

May 8, 2022
A new Flutter material DropdownButton package.

A Flutter material DropdownButton Plus package. platform enable Android ✔️ IOS ✔️ Web ✔️ Macos ✔️ Windows ✔️ Linux ✔️ Github pub.dev Getting started ?

Jul 18, 2022
DropdownButton, ToggleButton & CheckboxListTile implementation in Flutter as a Mobile App Development exercise.
DropdownButton, ToggleButton & CheckboxListTile implementation in Flutter as a Mobile App Development exercise.

Sort & Filter UI A new Flutter project. Getting Started This project is a starting point for a Flutter application. ⏮ Preview A few resources to get y

Sep 29, 2021
This package give you ability to integrate with Drone API easily in any platform using Dart
This package give you ability to integrate with Drone API easily in any platform using Dart

Drone Dart Dart is a multi client programming language which allow you to compile and run your code on multiple platforms. Because of that we decided

Apr 5, 2022
An advanced story viewer for Flutter. Quite easy & Quite advanced
An advanced story viewer for Flutter. Quite easy & Quite advanced

AdvStory ?? Quite simple & Quite advanced ?? Advanced Story viewer for Flutter. Supports image, video and custom stories. Full control over stories fo

Aug 10, 2022
Magical 8 ball app will give you the answers to all the tricky questions in life
Magical 8 ball app will give you the answers to all the tricky questions in life

Magical 8 ball app will give you the answers to all the tricky questions in life. You can make the ball change at the press of a button.

Jan 6, 2022
Jan 20, 2022
This package allows you to scroll/select the value directly from the dropdown with less effort and time.

Direct Select This package allows you to scroll/select the value directly from the dropdown with less effort and time. Inspired by Virgil Pana shot Sa

May 16, 2022
A flutter app for NFTs which let you see and browse NFTs.
A flutter app for NFTs which let you see and browse NFTs.

NFT Museum A flutter project to explore the world of NFTs and APIs Purpose of this project The purpose of this project is to explore the flutter and N

Jul 27, 2022
Written using flutter,Give animals a new home

flutter_rehoming A new Flutter application. Getting Started This project is a starting point for a Flutter application. A few resources to get you sta

Jun 29, 2022