Code Monkey home page Code Monkey logo

Comments (7)

lcuis avatar lcuis commented on September 3, 2024 1

Hi @blue492 ,

Here is the example without changing anything:
image

Here is the example generated with the code below:

image

      SearchChoices.single(
        items: items,
        value: selectedValueSingleDialog,
        hint: "Select one",
        searchHint: "Select one",
        onChanged: (value) {
          setState(() {
            selectedValueSingleDialog = value;
          });
        },
        isExpanded: true,
        displayItem: (item, selected) {
          return (
            Expanded(
              child: item,
            )
        );
        },
        buildDropDownDialog: (
          Widget titleBar,
          Widget searchBar,
          Widget list,
          Widget closeButton,
          BuildContext dropDownContext,
        ) {
          return (AnimatedContainer(
            padding: MediaQuery.of(dropDownContext).viewInsets,
            duration: const Duration(milliseconds: 100),
            child: Card(
              margin: EdgeInsets.symmetric(vertical: 0, horizontal: 0),
              child: Container(
                padding: EdgeInsets.symmetric(vertical: 0, horizontal: 0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    titleBar,
                    searchBar,
                    list,
                    closeButton,
                  ],
                ),
              ),
            ),
          ));
        },
      )

I hope this is a good starting point to achieve what you are trying to do.

from search_choices.

blue492 avatar blue492 commented on September 3, 2024

@lcuis do you have any suggestions, thanks

from search_choices.

lcuis avatar lcuis commented on September 3, 2024

Hello @blue492 .

Sorry for the delay. I am on holiday without access to my coding hardware. Maybe some past closed issues contain the solution to your issue?
Otherwise, I'll try to get back to you as soon as I can.

from search_choices.

blue492 avatar blue492 commented on September 3, 2024

@lcuis Thanks for reply, I want that the modal be like [image 2] (https://github.com/lcuis/search_choices/assets/66443263/fd1a346f-d4d4-466b-a644-f1550f8068fd)

Your solution is full size in the screen with no margin, and dropdownbutton is not designed as I want.
Thanks for help

from search_choices.

lcuis avatar lcuis commented on September 3, 2024

Thanks for your reply @blue492 .

I agree, my example is not exactly as your image2. However, I believe that the code I shared with you is a good starting point. With a few adaptations, you can certainly reach a situation much closer to the desired outcome. If something is not possible because the plugin lacks flexibility, please let me know.

from search_choices.

blue492 avatar blue492 commented on September 3, 2024

@lcuis thanks for your buildDropDownDialog solution, I could design my items by displayItem function.

I hope you continue upgrade SearchChoices

from search_choices.

lcuis avatar lcuis commented on September 3, 2024

Hi @blue492 , I also hope I will keep upgrading SearchChoices. Thanks for your message!

from search_choices.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.