Telerik RadSplitContainer SizeInfo RelativeRatio - c#

According to the Telerik docs, the relative size of the panels in a RadSplitContainer are set with the RelativeRatio property. I can't figure out how to use this property.
I would like a left panel and a right panel, the left panel 50% of the width of the right panel.
http://www.telerik.com/help/winforms/splitcontainer-overview.html

It's quite easy:
Set both panels inside the splitcontainer to relative
Then set the RelativeRatio of the right panel = 0.66, 0 and the
RelativeRatio of the left panel = 0.33,0:
Example:
EDIT :
EDIT 2:
splitPanel1.SizeInfo.SizeMode = Telerik.WinControls.UI.Docking.SplitPanelSizeMode.Relative;
splitPanel2.SizeInfo.SizeMode = Telerik.WinControls.UI.Docking.SplitPanelSizeMode.Relative;
splitPanel1.SizeInfo.RelativeRatio = new SizeF(0.33f, 0f);
splitPanel2.SizeInfo.RelativeRatio = new SizeF(0.66f, 0f);

Related

I don't understand how to use the Margin property in WinForms (Windows Forms) applications

Can anyone help me to understand the usefulness of the Margin property?
Using the simple scenario below, I can't see how it's useful
SET UP
I created a simple app to test this:
Created a new WinForms app from the template
Opened Form1 in the designer
Added a 'Panel' (called Panel1) onto Form1 from the toolbox, with:
Dock = Fill;
Size.Width = 800px;
Size.Height = 450px`;
Added two child 'Panels' onto Panel1
Panel2 has Dock = Left
Panel3 has Dock = Right
Both Panel2 and Panel3 have Size.Width = 400px, Size.Height = 450px (so Panel2 and Panel3 effectively split Panel1 into 2 down the middle)
WHY THE PADDING PROPERTY MAKES SENSE TO ME:
The usefulness of Padding is obvious in the designer - it enforces space between the border of the parent (Panel1) and its contents (Panel2 and Panel3)).
So if I set Panel1.Padding.All = 10, then the Size.Height of both Panel2 and Panel3 is forced to decrease (by 20px) to 430px.
Their Size.Width stays the same (they just become overlapped).
Winforms then prevents the Size.Height of Panel2/Panel3 from being increased above 430px, as this would encroach into the padding space of Panel1.
This all makes sense to me
WHY THE MARGIN PROPERTY DOES NOT MAKE SENSE TO ME
Margin is the space around the border of an element - it keeps other elements from getting too close to the element you're setting the Margin on.
So I thought that if I set Margin.Right (on Panel2) to 10px, this would force the Size.Width of Panel3 to decrease (so that it wasn't encroaching on the margin of Panel2).
Instead, setting this right margin appears to have no visible impact on the form?
The Margin property is primarily used by the visual designer and reflected with "snaplines" when positioning controls on the design surface.
See this walkthrough from Microsoft.
One way to think about it (generally) is that Margin is something that happens outside the control whereas Padding is something that happens inside. Also, the "total" effect can be the result of the parent's padding added to the margin of the child control.
The MainForm has padding of 25 (shown in blue) and contains a FlowLayoutPanel set to Dock.Fill. To avoid confusion, the padding and margin of the flow layout panel is set to 0.
The 6 child controls of the flow layout panel set their own left-top margin to 10 and bottom margin to 40. At the top left and the bottom of each child the BackColor of LightSalmon shows through. There is a total of 50 from the bottom of one child to the top of the next one below. Each child control also sets its padding value to 15 which will apply on all four sides of the buttons it contains.
The padding and margin of Button are also set to 0. The the button is auto-sized and centered because it is anchored on all sides.
public partial class MainForm : Form
{
public MainForm()
{
InitializeComponent();
// Main form Padding in light blue
BackColor = Color.LightSkyBlue;
Padding = new Padding(25);
flowLayoutPanel.BackColor = Color.LightSalmon;
// Set these to 0 and let the individual controls
// manage the padding and margins.
flowLayoutPanel.Margin = new Padding(all: 0);
flowLayoutPanel.Padding = new Padding(all: 0);
for (int i = 1; i <= 6; i++)
{
var panel = new TableLayoutPanel
{
Name = $"panel{i}",
Size = new Size(200, 100),
// Margin 'outside' the panel will show in Light Salmon.
// This will space the panels inside the FlowLayoutPanel
Margin = new Padding(left: 10, top: 10, right: 0, bottom: 40),
// The button inside this panel will have Padding around it.
Padding = new Padding(all: 15),
BackColor = Color.LightGreen,
BackgroundImage = new Bitmap(
Path.Combine(
AppDomain.CurrentDomain.BaseDirectory,
"Images",
"back-image.png"
)),
BackgroundImageLayout = ImageLayout.Stretch,
};
// Add button to internal panel
var button = new Button
{
Name = $"button{i}",
Text = $"Button {(char)(64 + i)}",
BackColor = Color.DarkSeaGreen,
ForeColor = Color.WhiteSmoke,
// By anchoring the button, it will autosize
// respecting the Padding of its parent.
Anchor = AnchorStyles.Left | AnchorStyles.Top | AnchorStyles.Right | AnchorStyles.Bottom,
Margin = new Padding(all: 0),
Padding = new Padding(all: 0),
};
panel.Controls.Add(button);
flowLayoutPanel.Controls.Add(panel);
}
}
}

Show completely MonthCalendar control inside a GroupBox

I'm trying to show a month calendar completely inside a groupbox, I read, you can use a Panel and change the poperty AutoScroll into true, but it does not work.
Is there another way to show it or I am wrong?
The GroupBox control can be goofy to work with, because the Client space will overlap the GroupBox's title, but the DisplayRectangle will adjust correctly the upper left position of the "control space".
So try adjusting the size of the GroupBox using code (I don't think the designer is good at this):
groupBox1.AutoSize = false;
monthCalendar1.Location = groupBox1.DisplayRectangle.Location;
int w = monthCalendar1.Size.Width + groupBox1.Padding.Left +
groupBox1.Padding.Right;
int h = monthCalendar1.Size.Height + groupBox1.DisplayRectangle.Top +
groupBox1.Padding.Bottom;
groupBox1.ClientSize = new Size(w, h);

Panel in winform behaving wrongly

I am having a panel in Winforms which loads panels in it during a method call.
In the method call I have written following code:
//to get number of panel present in main panel so that new panel position can be set
int counT = panel1.Controls.Count;
Panel p = new Panel();
p.Location = new Point(3, 3 + (counT * 197));
p.Size = new Size(280, 150);
//To add panel to parent panel
panel1.Controls.Add(p);
Every time I call the method it will load a panel in the main panel. Everything works fine if i didn't scroll the scroll bar. Once I scroll the Scroll bar to down and after that i call the method, the distance between panels increases.
As per logic written the distance between two panel should be 197 pixel along Y axis, but it is increasing by more.
I have set AutoScroll=true
Any help !!!
That's quite strange behavior which I didn't know until now (and I have a lot experience in WF). It can be seen when the parent panel is scrolled when the code above is executed. I was thinking that child control positions are relative to the ClientRectangle, but it turns out that they are accounting the DisplayRectangle.
Shortly, instead of this
p.Location = new Point(3, 3 + (counT * 197));
use this
var parentRect = panel1.DisplayRectangle;
p.Location = new Point(parentRect.X + 3, parentRect.Y + 3 + (counT * 197));
Panel.AutoScrollPosition affects Location property of all child controls. Scrolling works in this way. So you should keep in mind that, for example you could store current scroll position, move position to (0,0), add new controls, and restore scroll position after all
//to get number of panel present in main panel so that new panel position can be set
int counT = panel1.Controls.Count;
var pos = this.panel1.AutoScrollPosition; // Whe are storing scroll position
this.panel1.AutoScrollPosition = new Point(Size.Empty);
Panel p = new Panel();
p.Location = new Point(3, 3 + (counT * 197));
p.Size = new Size(280, 150);
p.BorderStyle = BorderStyle.FixedSingle;
//To add panel to parent panel
panel1.Controls.Add(p);
this.panel1.AutoScrollPosition = new Point(Math.Abs(pos.X), Math.Abs(pos.Y)); // We are restoring scroll position

Hide FlowLayoutPanel's Horizontal Scrollbar [duplicate]

I have a FlowLayoutPanel and there are multiple controls on it. I only want to scroll in vertical direction. But when I set AutoScroll = true, I got both Vertical and Horizontal Scroll bars. How could I disable the horizontal scroll bar and only keep the vertical scroll bar working?
Set AutoScroll to true
Set WrapContents to false.
Make sure the size is wider than the
controls' width plus the width of a vertical scrollbar.
The horizontal scrollbar should disappear. If it doesn't, please provide some more information.
Set AutoScroll to true.
Set WrapContents to false.
Set Padding Right to 10.
It's work pretty fine for me.
Here is how I implement to have multiple labels on a FlowLayoutPanel with wrap text(WrapContents = true), verticalscrollbar only.
I have a flowLayoutPanel1 on a form
Set properties of form and flowLayoutPanel1 like below:
form:
AutoScroll = True
FormBorderStyle = Sizable(default)
flowLayoutPanel1:
Anchor = Top, Left, Right
AutoSize = True
FlowDirection = TopDown
WrapContents = true
Implement this code on form class for testing
int coorY = 0;
public Form2()
{
InitializeComponent();
for (int i = 0; i < 100; i++)
{
flowLayoutPanel1.Controls.Add(new Label
{
Location = new Point(0, coorY + 20),
Font = new Font("Segoe UI", 10f),
Text = "I have a FlowLayoutPanel and there are multiple controls on it. I only want to scroll in vertical",
Width = flowLayoutPanel1.Width,
AutoSize = true
});
coorY += 20;
}
}
Vertical scrollbar in action

Setting ScrollBar bar size?

I'm creating a scrollbar in codebehind like so:
ScrollBar b = new ScrollBar();
Grid ScrollbarGrid = GetTemplateChild( "ScrollbarGrid" ) as Grid;
b.Orientation = Orientation.Horizontal;
ScrollbarGrid.Children.Add(b);
What I need is for the scrollbar handle to be of a size I set myself if that is at all possible?
You can use ViewportSize
like b.ViewportSize = 5;
take a look at here for more information.
and MSDN's Track Class how thumb size calculates
You can set the Height and Width property of the scroll bar, is this what you need ?

Categories