c# .NET - Tabpage margin - c#

I have a tabcontrol with 3 tabpages. I need to add a left margin to the first tabpage ( so move all tabpages move right of 200px ). How can I do it??
Using Visual Studio 2008 / c#

EDIT Reading again I think you're more looking for the controls on each page to be on the right of the tabs rather than moving the buttons.
As Hans suggests a panel would be the easiest way. But it's not pretty.
private void Form1_Load(object sender, EventArgs e)
{
// Create spacer tab with a name long enough to reach the 200px mark
TabPage spacer = new TabPage("..............................................................");
tabControl1.TabPages.Insert(0, spacer);
// Create a panel at the same location of the tab control.
Panel spacerBlock = new Panel();
spacerBlock.Name = "spacer";
spacerBlock.Location = tabControl1.Location;
spacerBlock.Width = 198;
spacerBlock.Height = 20;
this.Controls.Add(spacerBlock);
spacerBlock.BringToFront();
}
private void tabControl1_SelectedIndexChanged(object sender, EventArgs e)
{
// Ensure the user can't use the keyboard to somehow select the spacer tab.
if (tabControl1.SelectedIndex == 0)
tabControl1.SelectedIndex = 1;
// Check if the second (first I guess) tab is selected and adjust the panel to keep the look consistant.
if (tabControl1.SelectedIndex == 1)
this.Controls["spacer"].Width = 198;
else
this.Controls["spacer"].Width = 200;
}
You'll want to make sure the tab isn't selectable by the user via keyboard shortcuts thus the index change check.
Also note the panel will have to have its width adjusted if the second (first in your case) tab is selected due to the 3d GUI effect.
Honestly the hassle of taking into account the appearance settings of the end user to ensure the spacer tab's text and the panel width are correct length doesn't really make up for fancy look IMHO.
Only other option I could think of would be a tab panel with a 16px height. Again this would have to be adjusted depending on the end users appearance settings, not to mention the excess overhead in getting it all working.

If it's the AjaxControlToolkit tab control, add this CSS class:
.TabContainer .ajax__tab_header
{
padding-left: 200px;
}

you would need a work-around for that because tab pages can't be moved. You might wanna place a groupbox inside the tabpage and then you can add all the controls inside the groupbox as you desire...
// tabPage 1
this.tabPage1.Controls.Add(this.groupBox1);
// groupBox1
this.groupBox1.Location = new System.Drawing.Point(200,6);
this.groupBox1.Controls.Add(this.textBox1);
this.groupBox1.Controls.Add(this.AnyControls); //etc

Related

Tab system using panels

I'm trying to make it to where a panel becomes visible and it sent to the front so it can be seen and interacted with, like this.
private void SettingsButton_Click(object sender, EventArgs e)
{
SettingsPanel.Visible = true;
SettingsPanel.BringToFront();
}
The problem is that after clicking a few of the buttons, it will either display the wrong panel or none at all. Is there a way to fix this?
EDIT: Before y'all ask, i'm using WinForms.
OK, so I was wrong, WinForms is smarter than I thought. Here's a test you can do. I'm not exactly sure what you are trying to do, but this should help you along. To start, we're going to build a small WinForms app. With one exception, we aren't going to set any properties of the controls we drop on the screen:
Create a new WinForms app
In the designer, drop a Panel (which will be named panel1) on the form
In the properties pane, set the BorderStyle to FixedSingle (that's the only property we are going to set)
Make two copies of that panel (panel2 and panel3). Position them so that panels do not overlap at all.
On each panel drop a couple of controls (I put labels (labels 1-3) and textboxes (also 1-3)) on each one
Beside each panel (arranged so that there is no overlap) drop three buttons on the form (buttons 1-3) make it so that visually, each button is associated with the similarly numbered panel
Duplicate panel3 including its contained controls (so that you get panel4, label4 and textbox4). Position the duplicate so that it significantly overlaps panel 3
Now we're going to look at the code that the designer creates for your form. Don't mess with this code (you can, but if you don't know what you are doing, it can turn out bad - and, we're keeping this simple).
In the Solution Explorer click the unfilled triangle to the left of Form1.cs. Note that it rotates and turns solid. Also note that Form1.Designer.cs is displayed. That's a normally hidden source file that contains all the designer created code that corresponds with the form and the controls you dropped on it.
Open Form1.Designer.cs
Click the little grey plus sign icon next to Windows Form Designer generated code
Inspect the file. Note that every action you did in the designer has a corresponding line of code in the Designer.cs file (more or less)
Look at the code for one of the panels (say panel1).
See that it includes:
this.panel1.Controls.Add(this.textBox1);
this.panel1.Controls.Add(this.label1);
Scroll all the way down to the Form1 code and see that the panels and buttons get added to the Form's Controls collection:
Like:
this.Controls.Add(this.button3);
this.Controls.Add(this.button2);
this.Controls.Add(this.button1);
this.Controls.Add(this.panel4);
this.Controls.Add(this.panel3);
this.Controls.Add(this.panel2);
this.Controls.Add(this.panel1);
Note that the order is reversed. The order is important, it sets the Z-Order (i.e., what overlaps what) for the form and the controls on the form.
Wiring up the buttons
Select all three buttons and press <Enter>. This will open the Form1.cs file and generate three button click handlers that you can fill in.
Use this code for the three button handlers:
private void button1_Click(object sender, EventArgs e) {
var wasVisible = panel1.Visible;
panel1.Visible = !wasVisible;
}
private void button2_Click(object sender, EventArgs e) {
panel2.BringToFront();
}
private void button3_Click(object sender, EventArgs e) {
panel3.BringToFront();
}
The first one will toggle the first panel's visibility (I put in an extra variable so you can set a breakpoint and see what's going on). The second one brings panel2 to the front, changing its Z-Order (it's called Z-Order because the position on the screen is measure in X and Y, which the overlap position is related to the "depth" of the screen, or the Z-coordinate). The last one does the same thing to panel3.
Run the program.
When you press the first button, the first panel and its controls disappear (this surprised me, WinForms is smarter than I thought)
When you press the second button, nothing appears to happen. This is because the only thing that panel2 intersects is the form, and panel2 already covers the form, so you don't see any effect. (and because WinForms is smarter than I thought)
When you press the third button, panel2 (and it's controls) jump to the front of the stack of controls, covering the intersecting part of panel4.
Does this help you understand how Visible and BringToFront() work?
What you're describing is similar to a TabControl alternative. Here's an example:
You can manage the current panel simply by making it visible and docked to fill. Hide the other panels.
public partial class FormTabsAlternative
: Form
{
int m_current = 0;
List<Panel> m_tabs = new List<Panel>();
public FormTabsAlternative()
{
InitializeComponent();
AddTab(pnl1);
AddTab(pnl2);
AddTab(pnl3);
AddTab(pnl4);
SetUpTabsAndButtons();
}
private void AddTab(Panel pnl)
{
m_tabs.Add(pnl);
pnl.Dock = DockStyle.Fill;
}
private void OnLeftClick(object sender, EventArgs e)
{
if (m_current > 0)
{
m_current--;
SetUpTabsAndButtons();
}
}
private void OnRightClick(object sender, EventArgs e)
{
if (m_current < m_tabs.Count - 1)
{
m_current++;
SetUpTabsAndButtons();
}
}
private void SetUpTabsAndButtons()
{
for (int index = 0; index < m_tabs.Count; index++)
{
var panel = m_tabs[index];
panel.Visible = index == m_current;
}
btnLeft .Enabled = m_current > 0;
btnRight.Enabled = m_current < m_tabs.Count - 1;
}
}

windows forms can't add more components

I want to build a form that has 100 label and 100 text box
what I did is:
add new form
add panel to that form using drag and drop
change the dock property of that panel to fill
change the AutoScroll property to True
start adding the labels and text boxes using drag and drop
The problem
I added like 40 labels and text boxes but I can't add any more because I can't expand the form nor the label vertically.
Note
I can minimize the size of the panel and a vertical scroll bar appears. (maybe this information helps you to help me).
A data entry window with that many text boxes is going to require scrolling. So set the Panel's AutoScrollMinSize property to, say, (1000, 1000) as a first guess. You'll see the scrollbars appear. They work at design time as well, allowing you to scroll the panel and place the controls. High odds you should be using a DataGridView btw.
Something that needs to be said: the odds that you can get a human to enter 100 data items without any mistake are very close to zero. A very frustrating job for the hapless user, it will take him 10 or more minutes only to arrive at failure. Create a user friendly UI, one that partitions the data entry job in small steps that can be successfully completed. Automatically solves this problem as well.
Set parent form's properties AutoSize and AutoScroll to true. Then disable docking for your panel. This way you can set any size to panel and scroll form contents to add new controls. When panel design is done, set docking to Fill again.
Or you can set position for newly added controls using Properties panel. This will move controls to appropriate position on the panel.
This is a sample method I've used to add an unknown number of controls to a form. The trick is a FlowLayoutPanel.
As has been said before: you don't want 100 manually added controls on your page.
private void AddMappingControls() {
HeaderFlowLayoutPanel.Controls.Clear();
MappingFlowLayoutPanel.Controls.Clear();
Label sourceHeaderLabel = new Label();
sourceHeaderLabel.Text = "Velden in Excel (bron)";
sourceHeaderLabel.Name = "BronLabel";
sourceHeaderLabel.Width = MappingFlowLayoutPanel.Width / 2 - 20;
HeaderFlowLayoutPanel.Controls.Add(sourceHeaderLabel);
Label destinationHeaderLabel = new Label();
destinationHeaderLabel.Text = "Velden in Word sjabloon (bestemming)";
destinationHeaderLabel.Name = "BestemmingLabel";
destinationHeaderLabel.Width = MappingFlowLayoutPanel.Width / 2 - 20;
HeaderFlowLayoutPanel.Controls.Add(destinationHeaderLabel);
foreach (string destination in this.destinationFields) {
ComboBox sourceFieldComboBox = new ComboBox();
sourceFieldComboBox.BindingContext = new System.Windows.Forms.BindingContext();
sourceFieldComboBox.DropDownStyle = ComboBoxStyle.DropDownList;
//sourceFieldComboBox.AutoCompleteMode = AutoCompleteMode.SuggestAppend;
sourceFieldComboBox.Name = destination + "ComboBox";
sourceFieldComboBox.ValueMember = destination;
sourceFieldComboBox.DataSource = this.sourceFields;
sourceFieldComboBox.Width = MappingFlowLayoutPanel.Width / 2 - 20;
MappingFlowLayoutPanel.Controls.Add(sourceFieldComboBox);
Label nameLabel = new Label();
nameLabel.Text = destination;
nameLabel.Name = destination + "Label";
nameLabel.Width = MappingFlowLayoutPanel.Width / 2 - 20;
MappingFlowLayoutPanel.Controls.Add(nameLabel);
}
}
I meant exactly the same as MeanGreen but he was first. I have created sample solution: https://www.amazon.com/clouddrive/share?s=i9N7raPPQPEjOdHPRn99uE

Is it possible to add more than one panel in same location

i'm using telerik control.
So i want to ask,
In winforms application ,Is it possible to add more than one panel in same location and display one at a time just like show/hide property.
Make sure you have placed all panel control in same container or form. then you can use Visible property to show and hide panel. BringFront and SendToBack function will be used to bring panel on top or send it to back. If you have placed any panel in another panel then that will be disappeared when you Hide parent panel. So, Make sure all panels' parent control must be same. To determine the parent control simply select that panel and press escape key to select their parent.
private void LoadPanels()
{
panel1.Location = new Point(10,10);
panel2.Location = new Point(10,10);
panel3.Location = new Point(10,10);
panel4.Location = new Point(10,10);
panel5.Location = new Point(10,10);
VisiblePanel("panel1");
}
private void VisiblePanel(string panelName)
{
string[] panels = new string[]{"panel1","panel2","panel3","panel4","panel5"};
for (int i=0;i<panels.Length;i++)
this.Controls[panels[i]].Visible = (panels[i] == panelName);
this.Controls[panelName].BringToFront(); //Not required you can remove this line.
}
Here's a slightly different approach you might want to consider...
Are you wanting to be able to programmatically select the contents of a rectangular area at runtime, selecting among various controls to display? If so, you could use a custom TabControl which has its tabs (not the pages) hidden.
Then you can select which page is displayed by programmatically changing its SelectedIndex property at runtime.
Doing it like this means that your form editor will show a normal tab control, which allows you to much more easily add the content to each page - but at runtime the tabs will be hidden from the user; they will just see the contents of the currently selected page.
See Hans Passant's answer here for how to create such a custom tab control.
(However, you might also want to override the OnKeyDown for the custom tab control in order to ignore Ctrl-Tab.)

Center Checkboxes in Table Layout Panel

I'm trying to center my checkboxes in a TableLayoutPanel, but they always end up looking left-aligned due to the nature of the checkbox control. See picture below:
I want each rows checks to be left-aligned, but for it to appear more centered. Something like the following:
I've checked around online, and I can center the checkboxes by setting AnchorStyles.None which is not what I want, because then the checkboxes are not aligned. I have them set to Dock.Fill so you can click anywhere in the cell to activate the checkbox.
I'm currently just padding my table to achieve a similar effect, but it's by far not an acceptable solution long-term. Also, padding the cells will line break the checkbox text without taking up all the available space on the row (since some of the row is being eaten by padding). The same goes for using a spacer-cell on the left of the table, not an ideal solution.
Does anyone have any ideas? Thanks!
This may work for you:
Set all the ColumnStyles of your TableLayoutPanel as .SizeType = SizeType.AutoSize.
Set your TableLayoutPanel.AutoSize = true and TableLayoutPanel.AutoSizeMode = AutoSizeMode.GrowAndShrink;
Add this code to center your checkboxes (as well as your TableLayoutPanel) dynamically:
//SizeChanged event handler of your tableLayoutPanel1
private void tableLayoutPanel1_SizeChanged(object sender, EventArgs e){
//We just care about the horizontal position
tableLayoutPanel1.Left = (tableLayoutPanel1.Parent.Width - tableLayoutPanel1.Width)/2;
//you can adjust the vertical position if you need.
}
UPDATE
As for your added question, I think we have to change some things:
Set your CheckBox AutoSize to false. The solution before requires it to be true.
Add more code (beside the code above):
int checkWidth = CheckBoxRenderer.GetGlyphSize(yourCheckBox.CreateGraphics(),System.Windows.Forms.VisualStyles.CheckBoxState.MixedNormal).Width;
//TextChanged event handler of your CheckBoxes (used for all the checkBoxes)
private void checkBoxes_TextChanged(object sender, EventArgs e){
UpdateCheckBoxSize((CheckBox)sender);
}
//method to update the size of CheckBox, the size is changed when the CheckBox's Font is bolded and AutoSize = true.
//However we set AutoSize = false and we have to make the CheckBox wide enough
//to contain the bold version of its Text.
private void UpdateCheckBoxSize(CheckBox c){
c.Width = TextRenderer.MeasureText(c.Text, new Font(c.Font, FontStyle.Bold)).Width + 2 * checkWidth;
}
//initially, you have to call UpdateCheckBoxSize
//this code can be placed in the form constructor
foreach(CheckBox c in tableLayoutPanel1.Controls.OfType<CheckBox>())
UpdateCheckBoxSize(c);
//add this to make your CheckBoxes centered even when the form containing tableLayoutPanel1 resizes
//This can also be placed in the form constructor
tableLayoutPanel1.Parent.SizeChanged += (s,e) => {
tableLayoutPanel1.Left = (tableLayoutPanel1.Parent.Width - tableLayoutPanel1.Width)/2;
};
Instead of having the checkboxes in cells, having each one inside a panel all inside a groupbox will allow the checkboxes to fill each panel and have a click able area around them. then with the groupbox dock set to fill and the panels' anchors set to top,bottom they all stay centered.

how can i achieve this in c#

i'm developing a windows form application.in the form, the left part is a tree menu, and the right part is show area. how can i change the show area according to what i click on the tree menu.
(source: 126.net)
i use treenode class to implement treemenu like this:
System.Windows.Forms.TreeNode treeNode27 = new System.Windows.Forms.TreeNode("basic operation");
what i try to do is use several panels. each panel bounds to a menu item. by setting the visible property, i can achieve that goal. but it is too inconvenient.especially when i try to design each panel.
any good suggestion?
You could design each "Panel" as a new User Control. That way you can design all of the "panels / areas" on their own, independently of the Main Form.
On your Main Form, create a single panel for the right hand side area and add all of the controls to that one panel.
Then when the TreeNode selection event happens you can set all the user controls to .Visible = false; except for the one you are showing and set that to .Visible = true; and .Dock = DockStyle.Fill;
What you need is an event handler that will be called at the time of the user clicking the treeview (Use TreeView from the toolBox). You can do that by selecting the treeview on the design page and under properties click on Events. Then select NodeMouseDoubleClick or NodeMouseClick depending upon what you want. Below is a code that captures the values selected...Enjoy...;)
private void treeView1_NodeMouseDoubleClick(object sender, TreeNodeMouseClickEventArgs e)
{
if (treeView1.SelectedNode.Level == 2)
{
//text on the first level
string text = treeView1.SelectedNode.Text;
}
else if (treeView1.SelectedNode.Level == 1)
{
//text on the second level
string text = treeView1.SelectedNode.Text;
}
}

Categories