BoxLayout and positioning

[superold]

Hi,

I have a control which inherits from RadTextBox

The layout should be the following, (a textbox with a button on its side and a couple of labels) 

___________________________________________________
| TextElement TextElement                          |
|__________________________________________________|
|_TextBox ________________________________|_Button_|

Problem is I cannot get the textbox and button to lay out in the correct order. The button is always rendered to the left and the textbox to the right, any way to change this?

Thanks,

/ jorge

        protected override void CreateChildItems(RadElement parent)
        {
            base.InitializeTextElement();

            title.Text = "Title";
            title.Class = "Title";

            validation.Text = "* Validation failed";
            validation.Visibility = ElementVisibility.Collapsed;
            validation.Class = "Validation";

            validation.ForeColor = Color.Red;

            AcceptsTab = false;
            TabStop = true;
            textBoxElement.Size = new Size(402, 20);

            button.Image = global::revival.Properties.Resources.file_16;
            button.ImageAlignment = System.Drawing.ContentAlignment.MiddleCenter;
            button.TabIndex = 0;
            button.Dock = DockStyle.Right;
            button.ButtonElement.StretchHorizontally = false;
            button.ButtonElement.StretchVertically = false;
            button.ButtonElement.Margin = new Padding(4, 0, 0, 0);
            button.ButtonElement.Padding = new Padding(1);

            BoxLayout layoutTexts = new BoxLayout();
            layoutTexts.Orientation = Orientation.Horizontal;
            layoutTexts.StretchVertically = false;

            layoutTexts.Children.Add(title);
            layoutTexts.Children.Add(validation);

            BoxLayout layoutEditor = new BoxLayout();
            layoutEditor.Orientation = Orientation.Horizontal;
            layoutEditor.StretchVertically = false;

// how do i get the textbox to render to the left and the button to the right?
            layoutEditor.Children.Add(textBoxElement);
            layoutEditor.Children.Add(button.ButtonElement);

            BoxLayout layout = new BoxLayout();
            layout.Orientation = Orientation.Vertical;

            layout.Children.Add(layoutTexts);
            layout.Children.Add(layoutEditor);

            RootElement.Children.Add(layout);

            Size = new Size(425, 34);
        }

[Peter]

Hello Jorge Delgado-Lopez,

You should use the static method DockLayoutPanel.SetDock(RadElement element, Dock dock) to arrange element to the desired position.
DockLayout starts to arrange elements from Left To Right ,e.g. first added element will be arranged in most left position.

 layoutEditor.Children.Add(button.ButtonElement);
 DockLayoutPanel.SetDock(button.ButtonElement, Dock.Right);
 layoutEditor.Children.Add(textBoxElement);
 DockLayoutPanel.SetDock(textBoxElement, Dock.Left);
 layoutEditor.LastChildFill = true;

Also look our StackLayoutPanel that is similar to DockLayout panel, without docking and LastChildFill property.

Please, instead of the RadButton.Button element use only ButtonElement, because in the first case the button element will be arranged from Button layout and second time from DockLayout.

I will be glad to help you further with this custom layout.





Sincerely yours,
Peter
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.