Size of DropDown

36 posts, 2 answers
  1. DenisCL
    DenisCL avatar
    69 posts
    Member since:
    Dec 2009

    Posted 18 Jan 2011 Link to this post

    Hello,

    I would like to make the dropdown size bigger in order to display fully all the items. (please see screenshot attached)

    I've check the post on this forum but I didn't find a way to do it.
    Do you have any advice to give for this?.

    Thanks a lot
    Regards
  2. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 18 Jan 2011 Link to this post

    Hello,

    You'd need to set the MinSize property of the drop down to see al litems. In the code below, I assume that the items are standard size (16px height) and then add a little padding

    for (int i = 0; i < 20; i++)
    {
        RadListDataItem item = new RadListDataItem("Item " + i.ToString());
        this.radDropDownList1.Items.Add(item);
    }
    // assuming you have standard size items (16px height) then set min height based on #items x 16 + a little padding
    this.radDropDownList1.DropDownMinSize = new Size(0, (this.radDropDownList1.Items.Count * 16) + 2);

    Hope that helps
    Richard
  3. UI for WinForms is Visual Studio 2017 Ready
  4. DenisCL
    DenisCL avatar
    69 posts
    Member since:
    Dec 2009

    Posted 18 Jan 2011 Link to this post

    Hello and thanks for help.
    In fact I would like to make the dropdown's width bigger for letting user to see the full item name

    Thanks for help
    Regards
  5. Answer
    Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 18 Jan 2011 Link to this post

    Hello,

    This will dynamically resize the popup element of the drop down according to the widest text length in your drop down.

    1: Add in a mix of items, and declare the PopUpOpened event handler
    for (int i = 0; i < 5; i++)
    {
        RadListDataItem item = new RadListDataItem("Some short strings " + i.ToString());
        this.radDropDownList1.Items.Add(item);
    }
    for (int i = 0; i < 20; i++)
    {
        RadListDataItem item = new RadListDataItem("Item with long text string that is wider than the drop down " + i.ToString());
        this.radDropDownList1.Items.Add(item);
    }
    this.radDropDownList1.DropDownListElement.PopupOpened += new EventHandler(DropDownListElement_PopupOpened);


    2: Declare a local variable that will hold the width of the widest item
    private int m_Widest = 0;

    3: When the pop up opens, resize it according to the widest item and height of all the items inthe drop down
    private void DropDownListElement_PopupOpened(Object sender, EventArgs e)
    {
        DefaultListControlStackContainer container = (DefaultListControlStackContainer)this.radDropDownList1.DropDownListElement.ListElement.Children[0];
        foreach (RadListVisualItem item in container.Children)
        {
            Telerik.WinControls.Primitives.TextParams tParams = new Telerik.WinControls.Primitives.TextParams();
            tParams.text = item.Text;
            if (item.GetTextSize(tParams).Width > m_Widest)
            {
                m_Widest = item.GetTextSize(tParams).ToSize().Width;
            }
        }
        this.radDropDownList1.Popup.MinimumSize = new Size(m_Widest, (this.radDropDownList1.Items.Count * 16) + 2);
    }

    Hope that helps
    Richard
  6. DenisCL
    DenisCL avatar
    69 posts
    Member since:
    Dec 2009

    Posted 19 Jan 2011 Link to this post

    Hello and thx for this code.

    It works well but I had to add a delta with very long items texts.

    Here is a little point on combo I would like to fix too:
    When my combo is disabled, it's displayed like on screenshot attached (combo disabled.jpg)
    I traced in yellow the problem. Basically the selected item text is "Société banque populaire".
    I simply want to display "Société banque pop..." instead of "e banque populaire                      ".

    Do you have any advices?

    Thanks a lot.


  7. Answer
    Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 19 Jan 2011 Link to this post

    Hello,

    In order to change the display text, you can do this in the following way

    this.radDropDownList1.TextChanged += new System.EventHandler(this.radDropDownList1_TextChanged);

    private void radDropDownList1_TextChanged(object sender, EventArgs e)
    {
        if (radDropDownList1.Text.Length > 20) // make up your own text length here...
        {
            radDropDownList1.DropDownListElement.TextBox.Text = radDropDownList1.Text.Substring(0, 16); //.. and here
        }
    }

    Hope that helps
    Richard
  8. DenisCL
    DenisCL avatar
    69 posts
    Member since:
    Dec 2009

    Posted 19 Jan 2011 Link to this post

    Thanks for your help.

    Everything is fine now regarding these points

    best regards
  9. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 19 Jan 2011 Link to this post

    You're welcome. Glad I could be of help
    Richard
  10. Alastair Waddell
    Alastair Waddell avatar
    8 posts
    Member since:
    Apr 2008

    Posted 25 Jan 2011 Link to this post

    The above works as a default size, but if I have 2 drop down lists, and one is smaller than the other, then setting the text to only show 16 (or however many) chars will look odd in the longer box.

    I did try Me.RadDropDownList1.SelectText(0, 0) but that didnt seem to work.


    a
  11. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 25 Jan 2011 Link to this post

    Hello,

    Can you clarify what you mean please? If you have two drop down lists, then you can handle the text changed event, and therefore the length in different event handlers.
    Regards,
    Richard
  12. Alastair Waddell
    Alastair Waddell avatar
    8 posts
    Member since:
    Apr 2008

    Posted 26 Jan 2011 Link to this post

    I am trying to implement a "generic" solution where it doesnt matter what size the dropdown list is, it always goes to the left of the text.

    eg. the list contails "foo" "bar" "family" "really long string" and the width is set wide enough to show "family".
    When "really long string" is selected the displayed text in the box is "y long string" when I would prefer to see "really long s"

    Alastair

  13. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 27 Jan 2011 Link to this post

    Hello,

    You would need to have the text "unselected" to do this. For example

    Private Sub RadDropDownList1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As Telerik.WinControls.UI.Data.PositionChangedEventArgs) Handles RadDropDownList1.SelectedIndexChanged
        Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionStart = 0
        Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionLength = 0
    End Sub

    Hope that helps
    Richard
  14. Alastair Waddell
    Alastair Waddell avatar
    8 posts
    Member since:
    Apr 2008

    Posted 27 Jan 2011 Link to this post

    Still no good.

    I have created a simple demo to show you the behaviour. (I can only attach images - so here is the code)
    i am using VS2010 with 4.0 framework and Telerik Controls  2010.3.10.1215

    Create new windows app - add a RadDropdownlist and a button to the form set the size of the RadDropdown to 147, 21 and use the following code

     Public Class Form1

        Dim comboItems As List(Of ComboBoxItems)

        Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

            Me.RadDropDownList1.DisplayMember = "Description"
            Me.RadDropDownList1.ValueMember = "ID"
            Me.RadDropDownList1.DataSource = comboItems

        End Sub

        Public Sub New()

            InitializeComponent()

            comboItems = New List(Of ComboBoxItems)
            comboItems.Add(New ComboBoxItems With {.ID = 1, .Description = "Test"})
            comboItems.Add(New ComboBoxItems With {.ID = 2, .Description = "Silly String"})
            comboItems.Add(New ComboBoxItems With {.ID = 3, .Description = "Sometimes we have long text"})
            comboItems.Add(New ComboBoxItems With {.ID = 4, .Description = "I dont get paid enough"})

        End Sub

        Private Sub RadDropDownList1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As Telerik.WinControls.UI.Data.PositionChangedEventArgs) Handles RadDropDownList1.SelectedIndexChanged

            Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionStart = 0
            Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionLength = 0

        End Sub

    End Class

    Class ComboBoxItems
        Property ID As Integer
        Property Description As String
    End Class

     


    Select the 3rd item in the list and click the button - so the combo loses focus.

    Alastair
  15. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 28 Jan 2011 Link to this post

    Hello,

    Just add the same code as above to the LostFocus event.

    Private Sub RadDropDownList1_LostFocus(ByVal sender As System.Object, ByVal e As EventArgs) Handles RadDropDownList1.LostFocus
        Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionStart = 0
        Me.RadDropDownList1.DropDownListElement.TextBox.TextBoxItem.SelectionLength = 0
    End Sub

    Hope that helps but let me know if you need more information
    Richard
  16. Alastair Waddell
    Alastair Waddell avatar
    8 posts
    Member since:
    Apr 2008

    Posted 30 Jan 2011 Link to this post

    That has worked.

    I must have looked at everything but the LostFocus event - go figure....


    Thanks, Alastair
  17. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 30 Jan 2011 Link to this post

    You're welcome. Glad that it helped you.
    All the best
    Richard
  18. DenisCL
    DenisCL avatar
    69 posts
    Member since:
    Dec 2009

    Posted 28 Feb 2011 Link to this post

    Hello Richard,

    I come back to you regarding the size of DropDown.
    EVerythign is fine for this code, but when my combobox autocompleteMode property is set to suggestAppend, the dropdown seems still small.

    I looked for some events which could help but I didn't find anything good.
    How can I resize this suggestappend dropdown, which seems to not be the same as normal dropdown?
    This dropdown looks different, it's resizable (see screenshot attached)

    Thanks for your help
  19. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 28 Feb 2011 Link to this post

    Hello,

    For information on the size of the AutoCompleteDropDown please see the answers in this forum post
    Thanks
    Richard
  20. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 01 Mar 2011 Link to this post

    Hello DenisCL,

    Whilst this probably wasn't the answer you were looking for, it it answered your question, please remember to mark as answer. If you need further help please let me know
    Thanks
    Richard
  21. Ivan Todorov
    Admin
    Ivan Todorov avatar
    688 posts

    Posted 03 Mar 2011 Link to this post

    Hello Denis,

    The forum thread Richard gave link to is about our RadTextBox control. The case with the RadDropDownList is a bit different e.g. you can change the size of the auto suggest drop-down. This forum thread explains how.

    Hope this will help you. Should you have any further questions, do not hesitate to ask.

    Greetings,
    Ivan Todorov
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  22. Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 03 Mar 2011 Link to this post

    @Ivan - thanks for correcting me about this
    @Denis - My apologies for giving you the wrong information
    Richard
  23. Bruno
    Bruno avatar
    3 posts
    Member since:
    Dec 2010

    Posted 17 Mar 2011 Link to this post

    I set the DropDownMinSize to the size I want, showing 20 items in the list. This works just fine when I press the arrow to open the dropdown. So far, so good.

    But I also have set the AutoCompleteMode to SuggestAppend. This will automatically open the dropdown when I start typing a value in the box. But in this case, the DropDownMinSize does not seem to be applied. It only shows 6 items in the list. Furthermore a resize option is available in the list allthough DropDownSizingMode is set to "None".

    Is there a way to keep the appearance of the AutoCompleteSuggest:DropDownList equal to the main DropDownList?
    (I also posted this in the "Autocomplete list size" thread)
  24. Peter
    Admin
    Peter avatar
    1148 posts
  25. Don
    Don avatar
    60 posts
    Member since:
    Aug 2010

    Posted 03 May 2011 Link to this post

    I tried the autosizing code in VB (translated using the code converter on the Telerik site) and it worked fairly well, except for one quirk. I had to open the dropdownlist twice for the width to expand properly. I got around this by using the exact same code to handle the PopupOpening and PopupOpened events. I'm not sure if this is just do to something in our environment here, if this is just a VB thing or if it is a bug.

    Here is the translated code from Richard's C# suggestion:
    Private Sub DropDownListElement_PopupOpened(sender As [Object], e As EventArgs)
        Dim container As DefaultListControlStackContainer = DirectCast(Me.radDropDownList1.DropDownListElement.ListElement.Children(0), DefaultListControlStackContainer)
        For Each item As RadListVisualItem In container.Children
            Dim tParams As New Telerik.WinControls.Primitives.TextParams()
            tParams.text = item.Text
            If item.GetTextSize(tParams).Width > m_Widest Then
                m_Widest = item.GetTextSize(tParams).ToSize().Width
            End If
        Next
        Me.radDropDownList1.Popup.MinimumSize = New Size(m_Widest, (Me.radDropDownList1.Items.Count * 16) + 2)
    End Sub
     
    '=======================================================
    'Service provided by Telerik (www.telerik.com)
    'Conversion powered by NRefactory.
    'Twitter: @telerik, @toddanglin
    'Facebook: facebook.com/telerik
    '=======================================================
  26. Peter
    Admin
    Peter avatar
    1148 posts

    Posted 06 May 2011 Link to this post

    Hi Don,

    Thank you for the question.

    I tested the case using our latest release - Q1 2011 SP1 and I was not able to reproduce the issue.
    Could you please try to modify the attached project in order to reproduce the experienced behavior? Please note that you should open a new support ticket in order to be able to attach files.

    Thank you for your time and cooperation.

    I am looking forward to your reply.

    All the best,
    Peter
    the Telerik team
    Q1’11 SP1 of RadControls for WinForms is available for download; also available is the Q2'11 Roadmap for Telerik Windows Forms controls.
  27. Don
    Don avatar
    60 posts
    Member since:
    Aug 2010

    Posted 06 May 2011 Link to this post

    I figured out what was causing my issue. We have some in-house controls we derive from, rather than the Windows controls, and the in-house derivation is affecting the dropdown behavior. I'll just have to remember to take this into account when building dropdowns and potentially some other control types. Thanks for the help, Peter and Richard!
  28. Peter
    Admin
    Peter avatar
    1148 posts

    Posted 11 May 2011 Link to this post

    Hello Don,

    Feel free to write back, we will be glad to help.

    Best wishes,
    Peter
    the Telerik team
    Q1’11 SP1 of RadControls for WinForms is available for download; also available is the Q2'11 Roadmap for Telerik Windows Forms controls.
  29. Suresh
    Suresh avatar
    4 posts
    Member since:
    Aug 2014

    Posted 01 Aug 2014 Link to this post

    Hello,
    could you make GridViewComboBoxColumn popup size bigger in a radgridview...
    Thanks in advance
  30. Ralitsa
    Admin
    Ralitsa avatar
    176 posts

    Posted 04 Aug 2014 Link to this post

    Hi Suresh, 

    Thank you for contacting us. 

    You need to subscribe to the CellEditorInitialized event and change the DropDownWidth and DropDownHeight. Please take a look at the following code snippet: 
    void radGridView1_CellEditorInitialized(object sender, GridViewCellEventArgs e)
    {
        if (e.ActiveEditor is RadDropDownListEditor)
        {
            RadDropDownListEditor editor = e.ActiveEditor as RadDropDownListEditor;
            RadDropDownListEditorElement element = (RadDropDownListEditorElement)editor.EditorElement;
            element.DropDownWidth = 150;
            element.DropDownHeight = 100;
        }
    }

    Should you have further questions, I would be glad to help. 

    Regards,
    Ralitsa
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  31. Suresh
    Suresh avatar
    4 posts
    Member since:
    Aug 2014

    Posted 04 Aug 2014 in reply to Ralitsa Link to this post

    Thanks for the reply, I don't want to fix the width of dropdown item, because it can be vary, it should be increased based on the character length like normal dropdownlist item, is it possible...
      
Back to Top
UI for WinForms is Visual Studio 2017 Ready