RadDropDownButtonElement scroll bar

14 posts, 1 answers
  1. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 11 Feb 2009 Link to this post

    Hello, I am running into an odd display issue with a dropdown element in RibbonBar.  I am using the drop down to allow user to select font for text, and showing a preview of the text within drop down directly using the suggested code in following forum post (http://www.telerik.com/community/forums/winforms/ribbonbar/font-in-ribbon-bar.aspx). 

    While the text is showing up in the specified fonts, no scroll bar is appearing in the drop down, and the list takes up the entire height of the app.  How can I get the scroll bar to appear, as well as limit the size of the list when drop down button pushed?

    (as a side point, is it also possible to set the font size for each list item?  Some of items the text is too small toread clearly...)

    Thanks!
    Justin
  2. Peter
    Admin
    Peter avatar
    1148 posts

    Posted 13 Feb 2009 Link to this post

    Hi Justin,

    Thank you for writing.

    I could not reproduce the described issue, so I will appreciate more details, if possible. For example how do you add the ComboBox into the RibbonBar? Could you send us a simple project that demonstrates the issue?

    I would also suggest trying to set these two RadComboBox properties to false:

    radComboBox1.IntegralHeight = false;
    radComboBox1.Virtualized = false;

    I am looking forward to your feedback.

    Greetings,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for WinForms is Visual Studio 2017 Ready
  4. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 13 Feb 2009 Link to this post

    I am not using RadComboBox - rather I am using RadDropDownButtonElement which is what is available within the "Add" button list when using VS Designer on a RadRibbonBar control. 

    FYI - RadDropDownButtonElement does not contain the two properties that you mentioned.

    I went ahead and put together a small/simple sample program to illustrate what I am seeing with setting up the drop down in different ways: 
    1. Adding RadComboBox to a form
    2. Adding RadDropDownButtonElement to RadRibbonBar

    RadComboBox
    Using just RadComboBox seems to have slightly better results.  The height of the drop down list is limited to the size of the form, and there is a scroll bar to get to the entries below the cutoff point of the drop down box.

    RadDropDownButtonElement 
    When I add a RadRibbonBar to the form, and then add RadDropDownButtonElement.  Using the same method to populate the list of font families seems fine.  However, when I click on the arrow button the drop down box takes up the entire screen (above and below form), and there is no scroll bar to get to other fonts that are not displayed.

    Even the RadComboBox is not perfect using this method, as the text are all different sizes, and in some cases the text is overlapping the text below it...

    As i could not figure out how to attach zip file to this message, following is from designer.cs

    private void InitializeComponent()  
            {  
                this.components = new System.ComponentModel.Container();  
                Telerik.WinControls.UI.RadRibbonBarCommandTab radRibbonBarCommandTab1 = new Telerik.WinControls.UI.RadRibbonBarCommandTab();  
                System.ComponentModel.ComponentResourceManager resources = new System.ComponentModel.ComponentResourceManager(typeof(Form1));  
                this.radComboBox1 = new Telerik.WinControls.UI.RadComboBox();  
                this.radRibbonBar1 = new Telerik.WinControls.UI.RadRibbonBar();  
                this.tabItem1 = new Telerik.WinControls.UI.TabItem();  
                this.radRibbonBarChunk1 = new Telerik.WinControls.UI.RadRibbonBarChunk();  
                this.radRibbonBarButtonGroup1 = new Telerik.WinControls.UI.RadRibbonBarButtonGroup();  
                this.radDropDownButtonElement1 = new Telerik.WinControls.UI.RadDropDownButtonElement();  
                ((System.ComponentModel.ISupportInitialize)(this.radComboBox1)).BeginInit();  
                ((System.ComponentModel.ISupportInitialize)(this.radRibbonBar1)).BeginInit();  
                this.SuspendLayout();  
                //   
                // radComboBox1  
                //   
                this.radComboBox1.Location = new System.Drawing.Point(172, 177);  
                this.radComboBox1.Name = "radComboBox1";  
                //   
                //   
                //   
                this.radComboBox1.RootElement.AutoSizeMode = Telerik.WinControls.RadAutoSizeMode.WrapAroundChildren;  
                this.radComboBox1.Size = new System.Drawing.Size(106, 20);  
                this.radComboBox1.TabIndex = 0;  
                this.radComboBox1.Text = "radComboBox1";  
                //   
                // radRibbonBar1  
                //   
                this.radRibbonBar1.BackColor = System.Drawing.Color.FromArgb(((int)(((byte)(191)))), ((int)(((byte)(219)))), ((int)(((byte)(254)))));  
                radRibbonBarCommandTab1.Items.AddRange(new Telerik.WinControls.RadItem[] {  
                this.radRibbonBarChunk1});  
                radRibbonBarCommandTab1.Tab = this.tabItem1;  
                this.radRibbonBar1.CommandTabs.AddRange(new Telerik.WinControls.UI.RadRibbonBarCommandTab[] {  
                radRibbonBarCommandTab1});  
                this.radRibbonBar1.Dock = System.Windows.Forms.DockStyle.Top;  
                this.radRibbonBar1.EnableKeyMap = true;  
                //   
                //   
                //   
                //   
                //   
                //   
                this.radRibbonBar1.ExitButton.ButtonElement.Class = "RadMenuButtonElement";  
                this.radRibbonBar1.ExitButton.ButtonElement.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;  
                this.radRibbonBar1.ExitButton.Text = "Exit";  
                this.radRibbonBar1.Location = new System.Drawing.Point(0, 0);  
                this.radRibbonBar1.Name = "radRibbonBar1";  
                //   
                //   
                //   
                //   
                //   
                //   
                this.radRibbonBar1.OptionsButton.ButtonElement.Class = "RadMenuButtonElement";  
                this.radRibbonBar1.OptionsButton.ButtonElement.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;  
                this.radRibbonBar1.OptionsButton.Text = "Options";  
                this.radRibbonBar1.QuickAccessToolbarBelowRibbon = false;  
                //   
                //   
                //   
                this.radRibbonBar1.RootElement.AutoSizeMode = Telerik.WinControls.RadAutoSizeMode.WrapAroundChildren;  
                this.radRibbonBar1.Size = new System.Drawing.Size(410, 141);  
                this.radRibbonBar1.StartButtonImage = ((System.Drawing.Image)(resources.GetObject("radRibbonBar1.StartButtonImage")));  
                this.radRibbonBar1.TabIndex = 1;  
                this.radRibbonBar1.Text = "radRibbonBar1";  
                //   
                // tabItem1  
                //   
                this.tabItem1.CanFocus = true;  
                this.tabItem1.Class = "TabItem";  
                //   
                // tabItem1.ContentPanel  
                //   
                this.tabItem1.ContentPanel.BackColor = System.Drawing.Color.Transparent;  
                this.tabItem1.ContentPanel.CausesValidation = true;  
                this.tabItem1.IsSelected = true;  
                this.tabItem1.Name = "tabItem1";  
                this.tabItem1.Text = "Test";  
                //   
                // radRibbonBarChunk1  
                //   
                this.radRibbonBarChunk1.Items.AddRange(new Telerik.WinControls.RadItem[] {  
                this.radRibbonBarButtonGroup1});  
                this.radRibbonBarChunk1.Name = "radRibbonBarChunk1";  
                this.radRibbonBarChunk1.Orientation = System.Windows.Forms.Orientation.Horizontal;  
                this.radRibbonBarChunk1.Text = "New chunk";  
                //   
                // radRibbonBarButtonGroup1  
                //   
                this.radRibbonBarButtonGroup1.Items.AddRange(new Telerik.WinControls.RadItem[] {  
                this.radDropDownButtonElement1});  
                this.radRibbonBarButtonGroup1.Name = "radRibbonBarButtonGroup1";  
                this.radRibbonBarButtonGroup1.Orientation = System.Windows.Forms.Orientation.Horizontal;  
                this.radRibbonBarButtonGroup1.ShowBackColor = true;  
                this.radRibbonBarButtonGroup1.ShowBorder = true;  
                this.radRibbonBarButtonGroup1.Text = "radRibbonBarButtonGroup1";  
                //   
                // radDropDownButtonElement1  
                //   
                this.radDropDownButtonElement1.ArrowButtonMinSize = new System.Drawing.Size(12, 12);  
                this.radDropDownButtonElement1.DropDownDirection = Telerik.WinControls.UI.RadDirection.Down;  
                this.radDropDownButtonElement1.ExpandArrowButton = false;  
                this.radDropDownButtonElement1.HasTwoColumnDropDown = false;  
                this.radDropDownButtonElement1.Name = "radDropDownButtonElement1";  
                this.radDropDownButtonElement1.Text = "radDropDownButtonElement1";  
                this.radDropDownButtonElement1.TextImageRelation = System.Windows.Forms.TextImageRelation.Overlay;  
                //   
                // Form1  
                //   
                this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);  
                this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;  
                this.ClientSize = new System.Drawing.Size(410, 432);  
                this.Controls.Add(this.radRibbonBar1);  
                this.Controls.Add(this.radComboBox1);  
                this.Name = "Form1";  
                this.Text = "radRibbonBar1";  
                this.Load += new System.EventHandler(this.Form1_Load);  
                ((System.ComponentModel.ISupportInitialize)(this.radComboBox1)).EndInit();  
                ((System.ComponentModel.ISupportInitialize)(this.radRibbonBar1)).EndInit();  
                this.ResumeLayout(false);  
                this.PerformLayout();  
     
            }
            #endregion  
     
            private Telerik.WinControls.UI.RadComboBox radComboBox1;  
            private Telerik.WinControls.UI.RadRibbonBar radRibbonBar1;  
            private Telerik.WinControls.UI.RadRibbonBarChunk radRibbonBarChunk1;  
            private Telerik.WinControls.UI.RadRibbonBarButtonGroup radRibbonBarButtonGroup1;  
            private Telerik.WinControls.UI.RadDropDownButtonElement radDropDownButtonElement1;  
            private Telerik.WinControls.UI.TabItem tabItem1; 


    and this is how data is being populated:


     
    private void FillFontNameInCombo(RadComboBox radComboBox1)  
            {  
                foreach (FontFamily font in FontFamily.Families)  
                {  
                    RadComboBoxItem item = new RadComboBoxItem(font.Name);  
                    item.MaxSize = new Size(0, 20);  
     
                    if (font.IsStyleAvailable(FontStyle.Regular))  
                    {  
                        item.Font = new Font(font.Name, item.Font.Size);  
                    }  
     
                    radComboBox1.Items.Add(item);  
                }  
            }  
     
            private void FillFontNameInRibbonCombo(RadDropDownButtonElement comboElement)  
            {  
                foreach (FontFamily font in FontFamily.Families)  
                {  
                    RadComboBoxItem item = new RadComboBoxItem(font.Name);  
                    item.MaxSize = new Size(0, 20);  
     
                    if (font.IsStyleAvailable(FontStyle.Regular))  
                    {  
                        item.Font = new Font(font.Name, item.Font.Size);  
                    }  
     
                    comboElement.Items.Add(item);  
                }  
            } 


  5. Peter
    Admin
    Peter avatar
    1148 posts

    Posted 16 Feb 2009 Link to this post

    Hi Justin,

    The RadDropDown button is not designed to manipulate multiple data items. You should use RadComboBox for this purpose.

    Do not forget to set these RadComboBox properties:

    radComboBox1.IntegralHeight = false;
    radComboBox1.Virtualized = false;

    Do not hesitate to contact us if you have other questions.

    Greetings,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 16 Feb 2009 Link to this post

    Thanks Peter - good to know.

    In that case, how does one add a RadComboBox to a RadRibbonControl?  Specifically in design view, as my preference is to be able to get an idea of how everything looks visually without having to test the app each time :)

    Justin
  7. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 18 Feb 2009 Link to this post

    Hello Justin,

    You can easily add a RadComboBox into a RadRibbonBar. Please follow the steps below in order to achieve this:

    1. Add a RadRibbonBar control to your form.

    2. Add a new tab with a chunk.

    3. Choose the 'Edit Items' option for the Chunk by using the Smart Tag in the Visual Studio Designer.

    4. Insert a RadButtonGroup.

    5. Select the button group and again by clicking on the Smart Tag choose 'Edit Items'.

    6. You can now add a RadComboBox item by clicking on the drop down button in the editor.

    You can also edit the RadComboBox by selecting it in the designer and use the property grid on the right.

    I hope this helps.

    Do not hesitate to get back to me if you need further assistance.

    Best wishes,
    Deyan
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 18 Feb 2009 Link to this post

    Deyan, I am sorry if I am missing something, but from what I can tell the steps that you provided below do not work.  If RadComboBox was listed as an option in the "Edit Items" editor of RadButtonGroup of RadRibbonBar then I would have chosen that in the first place - instead of RadDropDownButtonElement  :)

    This is why I am confused on how to add a combo box to ribbon bar - within the designer it does not appear to be possible. 

    FYI - I am using 2008 Q3 version of RadWinControls

    Justin
  9. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 23 Feb 2009 Link to this post

    Hello Justin,

    Thanks for getting back to me.

    I have prepared a series of screenshots that demonstrate how you can add a RadDropDownButtonElement in a RadButtonGroup of a Chunk.

    I hope I am not missing something. Please, refer to the screenshots attached and write back if you have more questions.

    All the best,
    Deyan
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  10. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 23 Feb 2009 Link to this post

    Deyan - appreciate the response - however I think there is some confusion here.  I started this thread because I HAD been using RadDropDownButtonElement - and you suggested that I use RadComboBox instead.  The problem I am having now is that I do not see anyway to add a RadComboBox to RadRibbonBar in the designer....

    Justin
  11. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 24 Feb 2009 Link to this post

    Hello Justin,

    I am sorry for the misunderstanding.

    I have now used the code you sent us earlier and created a sample project that should demonstrate how to achieve your goal. In this project I have entirely used the RadRibbonBar designer to insert a RadComboBoxElement. I have added a new method called FillInRadComboBoxElement in order to load the fonts available on the OS. In fact, there is a case when you will not be able to see the RadComboBoxElement in the drop down of the RadItem Collection Editor dialog. This is undesired behavior in the Ribbon Bar and I have put it in our TODO list for fixing. Actually, when you create a Button Group and use its Smart Tag to open its RadItem Collection Editor, you will not see all items you are able to add within the group. Therefore I suggest that you use the Property Grid on the right in order to edit the items of the Button Group. Just find the Items property and open the RadItem Collection Editor from there. You should be able to add a RadComboBoxElement from there.

    Please, take a look at the demo project I sent. I have prepared another series of screenshots as well, which should guide you how to add the RadComboBoxElement in a RadButtonGroup (in a RadRibbonChunk :-)  ) of a RadRibbonBar.

    I hope this clarifies the case and will help you achieve your goal.

    I am also eager to get feedback from you on this so do not hesitate to get back to me in case of further problems.

    Kind regards,
    Deyan
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  12. Justin
    Justin avatar
    35 posts
    Member since:
    Apr 2008

    Posted 02 Mar 2009 Link to this post

    Deyan - appreciate your assistance in this matter.  I have downloaded both archive files you provided - I first followed the screenshots you provided to try and add a RadComboBox to a RadRibbonButtonGroup, and again when adding a new item there is no option to add RadComboBox.

    I looked at the sample application that you sent back, and while I see the RadComboBox that you added to the RibbonBar (which looks exactly like what I want!), I am still not able to see the option to add a RadComboBox in the list of items - no matter how I try to add.  Whether from Smart Tag, or Item Collection in Property Grid....

    I am really stumped as to why this is not working for me.  I have gone ahead and added RadComboBox manually the designer.cs file - but really curious as to what might be going on here.  Is it possible there is a difference in version of the control?

    Justin
  13. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 05 Mar 2009 Link to this post

    Hello Justin,

    Thanks for getting back to me.

    The reason for the behavior could be due to some version differences, but we have not introduced any major changes in the RadRibbonBar in our previous releases which could lead to this.

    I would appreciate a detailed description (screen shots will be helpful) that clearly show the steps you undertake in order to add a RadComboBoxElement over the designer. That might bee of a great help when solving the case. You will need to open a new support ticket to send us the files.

    However, since the new and improved version of the RadRibbonBar ships with our Q1 2009 release, I would suggest that you wait until then and upgrade.

    I am sorry for the inconvenience.

    All the best,
    Deyan
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  14. Brandon
    Brandon avatar
    30 posts
    Member since:
    Nov 2010

    Posted 21 Feb 2011 Link to this post

    Im having the same issue in version 2010.3.10.1109.

    It seems that trying to add a RadComboBox from the designer does not exist. The only option i'm seeing is a RadComboBoxElement which is not the same???
    When I add the RadComboBoxElement, i'm not able to get a handle to any of the events that fire so this is not useful to me.

    I also tried changing the RadComboBoxElement to a RadComboBox in the designer code, but visual studio gives me the error that it's unable to convert a RadComboBox to a RadItem???

    Long story short, it appears that a RadComboBox cannot be added to the RadRibbonBar.
    I downloaded the example project and it works the way I would want my combo box work, but the combo box in your project was not in the ribbon control. If you try adding the combo box to the ribbon control then you might see our issue.

    Can this be addressed in anyway?

    Thanks!
  15. Answer
    Richard Slade
    Richard Slade avatar
    3000 posts
    Member since:
    May 2009

    Posted 21 Feb 2011 Link to this post

    Hello Brandon,

    It's correct to add a RadComboBoxElement to the RadRibbonBar. You are able to add elements to controls, not other RadControls.
    Using the designer...
     
    • Add a RadComboBoxElement
    • Go to the properties of RadComboBoxElement1
    • Add in some Items to the RadItem collection Editor
    • Go to the Events section, and add an event handler for RadComboBoxElement1_SelectedIndexChanged
    • Add the following code
    Private Sub RadComboBoxElement1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles RadComboBoxElement1.SelectedIndexChanged
        MessageBox.Show(Me.RadComboBoxElement1.Items(Me.RadComboBoxElement1.SelectedIndex).Text)
    End Sub

    All should work as expected. I'm using the latest Q3 2010 SP1 version, but the principal should be the same.
    Let me know if you have any issues
    Richard
Back to Top
UI for WinForms is Visual Studio 2017 Ready