WinForms Checkbox button image alignment - c#

I'm trying to make a toggle button inside C# WinForms application. Now I have managed to make the toggle button look and feel with the suggestion from my previous post.
Now the problem is, I'm not able to centre align the images from my ImageList properly on the button, so its showing some of the back colors on its edges. Please see the below images for clear view.
How can I get rid of this white edges?
Things tried so far:
FlatAppearance of the Button is set to Flat.
Tried with Transparent background color but that didn't work.
ImageAlign is set to MiddleCenter.
Code generated by WinForms designer
//
// checkBox1
//
this.checkBox1.Appearance = System.Windows.Forms.Appearance.Button;
this.checkBox1.BackColor = System.Drawing.Color.White;
this.checkBox1.CausesValidation = false;
this.checkBox1.CheckAlign = System.Drawing.ContentAlignment.BottomLeft;
this.checkBox1.Cursor = System.Windows.Forms.Cursors.Hand;
this.checkBox1.FlatAppearance.BorderSize = 0;
this.checkBox1.FlatStyle = System.Windows.Forms.FlatStyle.Flat;
this.checkBox1.ForeColor = System.Drawing.Color.White;
this.checkBox1.ImageIndex = 0;
this.checkBox1.ImageList = this.imageList1;
this.checkBox1.Location = new System.Drawing.Point(88, 178);
this.checkBox1.Margin = new System.Windows.Forms.Padding(0);
this.checkBox1.Name = "checkBox1";
this.checkBox1.Size = new System.Drawing.Size(98, 62);
this.checkBox1.TabIndex = 0;
this.checkBox1.Text = "Sample Button";
this.checkBox1.TextAlign = System.Drawing.ContentAlignment.BottomCenter;
this.checkBox1.UseVisualStyleBackColor = true;
this.checkBox1.CheckedChanged += new System.EventHandler(this.checkBox1_CheckedChanged_1);
Update: I'v managed to get rid of these white edges by reducing button size 1px (both x, y) from the image size. Image size is: 99x63, Button size 98x62. But I'm not sure whether this is the correct way to do it.

This is simple. Choose therese settings:
checkBox1.FlatStyle = FlatStyle.Flat;
checkBox1.FlatAppearance.BorderSize = 0;
// make all four (!) BackColors transparent!
checkBox1.BackColor = System.Drawing.Color.Transparent;
checkBox1.FlatAppearance.CheckedBackColor = Color.Transparent;
checkBox1.FlatAppearance.MouseDownBackColor = Color.Transparent;
Note that with FlatStyle.Flat the checkboxbutton reserves 8 horizontal pixels, 6 at the left and 2 at the right edge and will cut off 8 pixels from your Image unless you enlarge it like so:
checkBox1.Size = new Size(imageList1.ImageSize.Width + 8, imageList1.ImageSize.Height);
Now all pixels are displayed, however the control is not visibly left aligned until you move it to the left by 6 pixels!
Looking at your example both issues are probably not important, though, but sometimes they are..

Related

Lowering Background Image of a Panel in C# WinForms

I am trying to build a piano and i have a panel that is designed to house the musical staffs as a background image of this panel.
I have tried to apply these as a Picture Box but this hindered a lot of my other features of this piano. These are the current settings that are related to this particular panel:
this.BorderStyle = BorderStyle.FixedSingle;
this.Size = new Size(750, 75)
this.Location = new Point(125, 75);
this.Anchor = AnchorStyles.None;
this.BackgroundImage = Image.FromFile("..\\..\\..\\Notes-Images\\Notes-Images\\staff2.bmp");
this.Visible = true;
I need to find a way how to actually have control on the location of where the background image is placed so as to lower it from the top left of the panel

C# ListView, View=List - How to get rid of unused space at the bottom?

In a C# ListView with View=List, there is empty space at the bottom, reserved for a scrollbar. Weirdly, setting Scrollable=false will only increase the size of this unused space.
How can I get rid of this space or make sure it's used to display items?
Edit:
I'm having this issue in a Windows Form Application.
Edit 2: The issue seems to be coupled with the font size somehow. I need the font size to be 9 pt. With 11 pt this problem doesn't appear.
Edit 3: I also tried Item spacing in ListView where View=List but that didn't help either.
Edit 4: It happens under Win7 with the Win7 Theme. However, at least with Scrollable = false, it doesn't happen with the Classic Theme.
Still hoping for a more elegant solution, but for now, I found this workaround:
One can use a Panel to get rid of the extra space. I got the idea from TaW's answer to Add padding to last ListView item in WinForms
Remember, this worked for me, because I don't want or need a Scrollbar.
listView1.Scrollable = true;
int itemHeight = listView1.GetItemRect(0).Height;
int numItemsPerColumn = 10;
//One needs to add 21 to the height, because even if no Scrollbar
//is needed, that space will stay reserved.
listView1.Size = new Size(500, itemHeight * numItemsPerColumn + 21);
Panel P = new Panel();
P.BackColor = listView1.BackColor;
P.Location = listView1.Location;
//The height you actually want
P.Size = new Size(500, itemHeight * numItemsPerColumn + 4);
P.BorderStyle = listView1.BorderStyle;
listView1.BorderStyle = BorderStyle.None;
listView1.Parent = P;
listView1.Location = new Point(0, 0);
this.Controls.Add(P);

C# Chart Control produces huge title for large heights

I'm developing several bar charts using chart controls in C#, one of which holds a series of ~2300 data points. In order to be able to properly display custom labels for each data point, I expanded the height of the chart to be 10000. However, it's now producing quite a large sized header and footer for the chart, as seen below:
When I set the chart to resume having a more normal height of 500, though, the title size goes back to being more reasonable. How can I manually adjust the title size?
Here's my code for the chart properties:
Chart chart = new Chart();
chart.Width = 1000;
chart.Height = 10000;
chart.BackColor = Color.FromArgb(211, 223, 240);
chart.BorderlineDashStyle = ChartDashStyle.Solid;
chart.BackGradientStyle = GradientStyle.TopBottom;
chart.BorderlineWidth = 1;
chart.Palette = ChartColorPalette.Bright;
chart.BorderlineColor = Color.FromArgb(26, 59, 105);
chart.RenderType = RenderType.BinaryStreaming;
chart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
chart.AntiAliasing = AntiAliasingStyles.All;
chart.TextAntiAliasingQuality = TextAntiAliasingQuality.Normal;
chart.Titles.Add("Hit Rate");
chart.IsSoftShadows = true;
chart.ChartAreas.Add("Left");
chart.ChartAreas["Left"].AxisX.Title = "Market Area";
chart.ChartAreas["Left"].AxisY.Title = "Hit Percentage";
UPDATE: I have added this to my code...
chart.ChartAreas["Left"].InnerPlotPosition.X = 5;
chart.ChartAreas["Left"].InnerPlotPosition.Y = 0f;
which has helped somewhat. In addition, I have found that it is not the size of the title in and of itself that is causing the problem. The height of the title is actually quite normal. Instead it is all the blank space allocated to the chart above the actual graphing area.
Let's try this :
chart.Titles[0].Position.Auto = false;
chart.Titles[0].Position.Width = 60; //change the size you want
auto = false means you manually calculate the location. I think by default the width of the title is 50% and 50% of the chart.
Ludo
Instead of setting the height and width of the chart manually why don't you leave it to set automatically according to the content and set the below:
chart.ChartAreas[0].AxisX.Interval = 1;
chart.ChartAreas[0].AxisY.Interval = 1;
(here i'm choosing chart area 0, change it according to your code)
As you add the above code do not set the height and width of the chart.
Let me know in case of issues

Get chart area bounds in C#

Just to explain what I'm doing, I draw two selectors on a chart, and the part that will not be selected should appear under that blue rectangle. The part that will be selected will appear in the white area, between the two selectors. The figure below shows only the left selector.
Now, what I'm trying to do is to draw a rectangle inside a chart that always remain inside the plotting area, even when the windows is resized.
To get the top, left and bottom bounds, to draw the rectangle as shown in the figure below, I do the following:
(...)
int top = (int)(Chart.Height * 0.07);
int bottom = (int)(Chart.Height - 1.83 * top);
int left = (int)(0.083 * Chart.Width);
Brush b = new SolidBrush(Color.FromArgb(128, Color.Blue));
e.Graphics.FillRectangle(b, left, top, marker1.X - left, bottom - top);
(...)
But that's far from perfect, and it isn't drawn in the right place when the window is resized. I want the blue rectangle to always be bound on the top, left and bottom by the plotting area grid. Is that possible?
You probably want to use StripLine to achieve this.
Look into the Stripline Class Documentation.
Also I recommend downloading the Charting Samples which are a great help to understand the various features.
StripLine stripLine = new StripLine();
stripLine.Interval = 0; // Set Strip lines interval to 0 for non periodic stuff
stripLine.StripWidth = 10; // the width of the highlighted area
stripline.IntervalOffset = 2; // the starting X coord of the highlighted area
// pick you color etc ... before adding the stripline to the axis
chart.ChartAreas["Default"].AxisX.StripLines.Add( stripLine );
This assumes you are wanting something that is not what Cursor already does (see CursorX), such as letting the user mark up areas of the plot which provides some persistence. Combining the Cursor events with the striplines above would be a good way to do that.
So to highlight the start and end of the cursor you could do this
// this would most likely be done through the designer
chartArea1.AxisX.ScaleView.Zoomable = false;
chartArea1.CursorX.IsUserEnabled = true;
chartArea1.CursorX.IsUserSelectionEnabled = true;
this.chart1.SelectionRangeChanged += new System.EventHandler<System.Windows.Forms.DataVisualization.Charting.CursorEventArgs>(this.chart1_SelectionRangeChanged);
...
private void chart1_SelectionRangeChanged(object sender, CursorEventArgs e)
{
chart1.ChartAreas[0].AxisX.StripLines.Clear();
StripLine stripLine1 = new StripLine();
stripLine1.Interval = 0;
stripLine1.StripWidth = chart1.ChartAreas[0].CursorX.SelectionStart - chart1.ChartAreas[0].AxisX.Minimum;
stripLine1.IntervalOffset = chart1.ChartAreas[0].AxisX.Minimum;
// pick you color etc ... before adding the stripline to the axis
stripLine1.BackColor = Color.Blue;
chart1.ChartAreas[0].AxisX.StripLines.Add(stripLine1);
StripLine stripLine2 = new StripLine();
stripLine2.Interval = 0;
stripLine2.StripWidth = chart1.ChartAreas[0].AxisX.Maximum - chart1.ChartAreas[0].CursorX.SelectionEnd;
stripLine2.IntervalOffset = chart1.ChartAreas[0].CursorX.SelectionEnd;
// pick you color etc ... before adding the stripline to the axis
stripLine2.BackColor = Color.Blue;
chart1.ChartAreas[0].AxisX.StripLines.Add(stripLine2);
}
Somehow I suspect you may not have discovered the cursor yet, and doing so will make all this irrelevant. But anyway, the above code will do what you described.

Programmatically assigning Margin and/or Padding to a Label

In trying to get some labels in a TableLayoutPanel to move from the top left of their cells to the center of the cells, I'm trying to experiment with adding padding and/or margins.
However, nothing I've tried works. Here's the code I've tried and the results:
// Setting the padding just cuts off the bottom part of the text
//lbl.Padding = new System.Windows.Forms.Padding(1);
// How to set Margin?
//lbl.Margin = new System.Windows.Forms.Margin(1); <- This mimics "Padding" but is not recognized
//lbl.Margin = new Thickness(6); <- This is the only example I could find, but it's for WPF
Try:
lbl.Margin = new Padding(1);
You might also want to do:
lbl.Dock = DockStyle.Fill;
lbl.TextAlign = ContentAlignment.MiddleCenter;
lbl.AutoSize = false;
labelName.Style.Add("Margin", "10px");

Categories

Resources