Having buttons look the same in RibbonBarButtonGroup and RibbonBarGroup

[rahmani mohamed samir]

Hello

Using the RibbonBar, I am adding buttons vertically to a RibbonBarGroup when there are three or less. when there more buttons, I add adjacent RibbonBarButtonGroups, then add the buttons to them.

The problem is that buttons do not look the same.
How can i make the buttons in RibbonBarButtonGroup have the exact same style as those in RibbonBarGroup ?

I use Office2007Silver theme, and the latest version.

Thanks in advance!

[Peter]

Hi rahmani mohamed samir,

Thanks for writing.

You should set RibbonBarButtonGroup's ShowBackColor and ShowBorder properties to false.
Set the ShowBorder property of the RibbonBarButtonGroup's Buttons to false as well:

this.radRibbonBarButtonGroup1.ShowBackColor = false;
this.radRibbonBarButtonGroup1.ShowBorder = false;
this.radButtonElement1.ShowBorder = false;
this.radButtonElement2.ShowBorder = false;

I hope this helps.

Kind regards,
Peter
the Telerik team

[rahmani mohamed samir]

Hi

Thank you for your suggestion.
The solution that I ended up doing was in the same direction, I removed all buttons borders by always placing them inside RibbonBarButtonGroup. this, in the same time, made them all rectangular rather than rounded corners.

in fact, what I initially wanted is to have buttons in both containers always render with border and round rectangle shape.
by editing the Office2007Silver theme in Visual Style Builder, would there be a simple way to copy all styles from ButtonInRibbonGroup to ButtonInRibbonButtonGroup ? or, by code, make buttons use the styles of ButtonInRibbonGroup rather than ButtonInRibbonButtonGroup ?

Kind regards

[Peter]

Hi rahmani mohamed samir,

Thank you for writing me back. In this case you can set the Class property. Please consider the code snippet below:

this.radRibbonBarButtonGroup1.ShowBackColor = false;
this.radRibbonBarButtonGroup1.ShowBorder = false;
this.radButtonElement1.ShowBorder = false;
this.radButtonElement2.ShowBorder = false;
this.radButtonElement1.Class = "RibbonBarButtonElement";
this.radButtonElement1.ButtonFillElement.Class = "ButtonInRibbonFill";
this.radButtonElement1.BorderElement.Class = "ButtonInRibbonBorder";
this.radButtonElement2.Class = "RibbonBarButtonElement";
this.radButtonElement2.ButtonFillElement.Class = "ButtonInRibbonFill";
this.radButtonElement2.BorderElement.Class = "ButtonInRibbonBorder";

I hope this helps. If you need further assistance, please contact me.

Kind regards,
Peter
the Telerik team

[rahmani mohamed samir]

Hi

Setting the Class property did not have any effect. To illustrate the case, I am attaching the screen shots of the obtained results.
since I could not attach the sample project, the source code is bellow.

Thanks for your assistance


--------------------File Form1.cs--------------------

using Telerik.WinControls;

namespace WindowsFormsTestApplication
{
    public partial class Form1 : Telerik.WinControls.UI.RadRibbonForm
    {
        public Form1()
        {
            InitializeComponent();
            ThemeResolutionService.ApplicationThemeName = "Office2007Silver";

            this.radButtonElement1.ShowBorder = false;
            this.radButtonElement2.ShowBorder = false;
            this.radButtonElement1.Class = "RibbonBarButtonElement";
            this.radButtonElement1.ButtonFillElement.Class = "ButtonInRibbonFill";
            this.radButtonElement1.BorderElement.Class = "ButtonInRibbonBorder";
            this.radButtonElement2.Class = "RibbonBarButtonElement";
            this.radButtonElement2.ButtonFillElement.Class = "ButtonInRibbonFill";
            this.radButtonElement2.BorderElement.Class = "ButtonInRibbonBorder";

        }
    }
}

--------------------File Form1.Designer.cs--------------------

namespace WindowsFormsTestApplication
{
    partial class Form1
    {
        /// <summary>
        /// Variable nécessaire au concepteur.
        /// </summary>
        private System.ComponentModel.IContainer components = null;

        /// <summary>
        /// Nettoyage des ressources utilisées.
        /// </summary>
        /// <param name="disposing">true si les ressources managées doivent être supprimées ; sinon, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Code généré par le Concepteur Windows Form

        /// <summary>
        /// Méthode requise pour la prise en charge du concepteur - ne modifiez pas
        /// le contenu de cette méthode avec l'éditeur de code.
        /// </summary>
        private void InitializeComponent()
        {
            this.radRibbonBar1 = new Telerik.WinControls.UI.RadRibbonBar();
            this.ribbonTab1 = new Telerik.WinControls.UI.RibbonTab();
            this.radRibbonBarGroup1 = new Telerik.WinControls.UI.RadRibbonBarGroup();
            this.radButtonElement5 = new Telerik.WinControls.UI.RadButtonElement();
            this.radRibbonBarGroup2 = new Telerik.WinControls.UI.RadRibbonBarGroup();
            this.radRibbonBarButtonGroup1 = new Telerik.WinControls.UI.RadRibbonBarButtonGroup();
            this.radButtonElement2 = new Telerik.WinControls.UI.RadButtonElement();
            this.radButtonElement1 = new Telerik.WinControls.UI.RadButtonElement();
            this.office2007SilverTheme1 = new Telerik.WinControls.Themes.Office2007SilverTheme();
            ((System.ComponentModel.ISupportInitialize)(this.radRibbonBar1)).BeginInit();
            ((System.ComponentModel.ISupportInitialize)(this)).BeginInit();
            this.SuspendLayout();
            //
            // radRibbonBar1
            //
            this.radRibbonBar1.AutoSize = true;
            this.radRibbonBar1.CommandTabs.AddRange(new Telerik.WinControls.RadItem[] {
            this.ribbonTab1});
            this.radRibbonBar1.Dock = System.Windows.Forms.DockStyle.Top;
            this.radRibbonBar1.EnableKeyMap = true;
            //
            //
            //
            this.radRibbonBar1.ExitButton.Text = "Exit";
            this.radRibbonBar1.Location = new System.Drawing.Point(0, 0);
            this.radRibbonBar1.Name = "radRibbonBar1";
            //
            //
            //
            this.radRibbonBar1.OptionsButton.Text = "Options";
            this.radRibbonBar1.Size = new System.Drawing.Size(659, 150);
            this.radRibbonBar1.StartButtonImage = null;
            this.radRibbonBar1.TabIndex = 0;
            this.radRibbonBar1.Text = "radRibbonBar1";
            //
            // ribbonTab1
            //
            this.ribbonTab1.Alignment = System.Drawing.ContentAlignment.BottomLeft;
            //
            // ribbonTab1.ContentPanel
            //
            this.ribbonTab1.ContentPanel.BackColor = System.Drawing.SystemColors.ControlLightLight;
            this.ribbonTab1.ContentPanel.CausesValidation = true;
            this.ribbonTab1.ContentPanel.Font = new System.Drawing.Font("Microsoft Sans Serif", 8.25F, System.Drawing.FontStyle.Regular, System.Drawing.GraphicsUnit.Point, ((byte)(0)));
            this.ribbonTab1.ContentPanel.ForeColor = System.Drawing.SystemColors.ControlText;
            this.ribbonTab1.ContentPanel.Location = new System.Drawing.Point(0, 0);
            this.ribbonTab1.ContentPanel.Size = new System.Drawing.Size(200, 100);
            this.ribbonTab1.IsSelected = true;
            this.ribbonTab1.Items.AddRange(new Telerik.WinControls.RadItem[] {
            this.radRibbonBarGroup1,
            this.radRibbonBarGroup2});
            this.ribbonTab1.Name = "ribbonTab1";
            this.ribbonTab1.StretchHorizontally = false;
            this.ribbonTab1.Text = "NewTab";
            //
            // radRibbonBarGroup1
            //
            this.radRibbonBarGroup1.Items.AddRange(new Telerik.WinControls.RadItem[] {
            this.radButtonElement5});
            this.radRibbonBarGroup1.Name = "radRibbonBarGroup1";
            this.radRibbonBarGroup1.Orientation = System.Windows.Forms.Orientation.Vertical;
            this.radRibbonBarGroup1.Text = "     Using RibbonBarGroup     ";
            //
            // radButtonElement5
            //
            this.radButtonElement5.Class = "RibbonBarButtonElement";
            this.radButtonElement5.Name = "radButtonElement5";
            this.radButtonElement5.StretchHorizontally = false;
            this.radButtonElement5.Text = "radButtonElement5";
            //
            // radRibbonBarGroup2
            //
            this.radRibbonBarGroup2.Items.AddRange(new Telerik.WinControls.RadItem[] {
            this.radRibbonBarButtonGroup1});
            this.radRibbonBarGroup2.Name = "radRibbonBarGroup2";
            this.radRibbonBarGroup2.Text = "     Using RibbonBarButtonGroup     ";
            //
            // radRibbonBarButtonGroup1
            //
            this.radRibbonBarButtonGroup1.Items.AddRange(new Telerik.WinControls.RadItem[] {
            this.radButtonElement2,
            this.radButtonElement1});
            this.radRibbonBarButtonGroup1.Name = "radRibbonBarButtonGroup1";
            this.radRibbonBarButtonGroup1.Orientation = System.Windows.Forms.Orientation.Vertical;
            this.radRibbonBarButtonGroup1.ShowBackColor = false;
            this.radRibbonBarButtonGroup1.ShowBorder = false;
            this.radRibbonBarButtonGroup1.Text = "radRibbonBarButtonGroup1";
            //
            // radButtonElement2
            //
            this.radButtonElement2.Class = "RibbonBarButtonElement";
            this.radButtonElement2.Margin = new System.Windows.Forms.Padding(1);
            this.radButtonElement2.Name = "radButtonElement2";
            this.radButtonElement2.ShowBorder = false;
            this.radButtonElement2.Text = "radButtonElement2";
            //
            // radButtonElement1
            //
            this.radButtonElement1.Class = "RibbonBarButtonElement";
            this.radButtonElement1.Margin = new System.Windows.Forms.Padding(1);
            this.radButtonElement1.Name = "radButtonElement1";
            this.radButtonElement1.ShowBorder = false;
            this.radButtonElement1.Text = "radButtonElement1";
            //
            // Form1
            //
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(659, 273);
            this.Controls.Add(this.radRibbonBar1);
            this.Name = "Form1";
            //
            //
            //
            this.RootElement.ApplyShapeToControl = true;
            this.Text = "radRibbonBar1";
            ((System.ComponentModel.ISupportInitialize)(this.radRibbonBar1)).EndInit();
            ((System.ComponentModel.ISupportInitialize)(this)).EndInit();
            this.ResumeLayout(false);
            this.PerformLayout();

        }

        #endregion

        private Telerik.WinControls.UI.RadRibbonBar radRibbonBar1;
        private Telerik.WinControls.UI.RibbonTab ribbonTab1;
        private Telerik.WinControls.UI.RadRibbonBarGroup radRibbonBarGroup1;
        private Telerik.WinControls.UI.RadRibbonBarGroup radRibbonBarGroup2;
        private Telerik.WinControls.UI.RadRibbonBarButtonGroup radRibbonBarButtonGroup1;
        private Telerik.WinControls.UI.RadButtonElement radButtonElement2;
        private Telerik.WinControls.UI.RadButtonElement radButtonElement1;
        private Telerik.WinControls.Themes.Office2007SilverTheme office2007SilverTheme1;
        private Telerik.WinControls.UI.RadButtonElement radButtonElement5;
    }
}

[Peter]

Hi rahmani mohamed samir

Thanks for writing back.
 
I was not able to find a way to modify the border behavior. As a suggestion you could try to turn off the borders of buttons outside the button group. For example:
 

this.radButtonElement5.ShowBorder = false;

Please, excuse us for the inconvenience.  Don't hesitate to contact us if you have other questions.
 

All the best,
Peter
the Telerik team