I want to use a tab control and have the tabs displayed on the left, as opposed to at the top. I have set the alignment to the left and the tabs are displayed there. However, how do I get the text to be displayed on the tab, vertically? I have looked at the msdn and it gives an example of a left aligned tab control but the tab label is still displayed horisontally!
The other thing, does anybody know how to use the tab control with left aligned tabs with the default layout so that it looks better?
Please no third party apps unless they are free, and yes I have looked at code project already.
Thanks, R.
It is an age-old bug in the visual styles renderer for the native Windows tab control. It only supports tabs at the top, the Microsoft programmer that worked on it was run over by a bus before she could finish the job, I guess.
The only thing you can do about it is selectively turn off visual styles for the control. Add a new class to your project and paste the code shown below. Compile. Drop the new control from the top of the toolbox onto your form, replacing the original.
using System;
using System.Windows.Forms;
using System.Runtime.InteropServices;
public class FixedTabControl : TabControl {
[DllImportAttribute("uxtheme.dll")]
private static extern int SetWindowTheme(IntPtr hWnd, string appname, string idlist);
protected override void OnHandleCreated(EventArgs e) {
SetWindowTheme(this.Handle, "", "");
base.OnHandleCreated(e);
}
}
If you create your own DrawItem event, you can manually write the tab headers. You could use this process:
1) Set the following properties of the TabControl:
Property | Value
----------|----------------
Alignment | Right (or left, depending on what you want)
SizeMode | Fixed
DrawMode | OwnerDrawFixed
2) Set the ItemSize.Width property to 25 and the ItemSize.Height property to 100. Adjust these values as you want, but remember that basically, the width is the height and vice versa.
3) Add an event handler for the DrawItem event and add the following code:
private void tabControl1_DrawItem(object sender, DrawItemEventArgs e)
{
Graphics g = e.Graphics;
Brush _TextBrush;
// Get the item from the collection.
TabPage _TabPage = tabControl1.TabPages[e.Index];
// Get the real bounds for the tab rectangle.
Rectangle _TabBounds = tabControl1.GetTabRect(e.Index);
if(e.State == DrawItemState.Selected)
{
// Draw a different background color, and don't paint a focus rectangle.
_TextBrush = new SolidBrush(Color.Red);
g.FillRectangle(Brushes.Gray, e.Bounds);
}
else
{
_TextBrush = new System.Drawing.SolidBrush(e.ForeColor);
e.DrawBackground();
}
// Use our own font. Because we CAN.
Font _TabFont = new Font("Arial", 10, FontStyle.Bold, GraphicsUnit.Pixel);
// Draw string. Center the text.
StringFormat _StringFlags = new StringFormat();
_StringFlags.Alignment = StringAlignment.Center;
_StringFlags.LineAlignment = StringAlignment.Center;
g.DrawString(_TabPage.Text, _TabFont, _TextBrush,
_TabBounds, new StringFormat(_StringFlags));
}
4) Profit!
(original source: http://en.csharp-online.net/TabControl)
Related
I am using a group box and there are several controls inside this.
My requirement is to set the group box title to the middle of the group box instead of Left.
How?
you can extend the group box class like this.
public class CustomGrpBox : GroupBox
{
private string _Text = "";
public CustomGrpBox()
{
//set the base text to empty
//base class will draw empty string
//in such way we see only text what we draw
base.Text = "";
}
//create a new property a
[Browsable(true)]
[Category("Appearance")]
[DefaultValue("GroupBoxText")]
[DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
public new string Text
{
get
{
return _Text;
}
set
{
_Text = value;
this.Invalidate();
}
}
protected override void OnPaint(PaintEventArgs e)
{
//first let the base class to draw the control
base.OnPaint(e);
//create a brush with fore color
SolidBrush colorBrush = new SolidBrush(this.ForeColor);
//create a brush with back color
var backColor = new SolidBrush(this.BackColor);
//measure the text size
var size = TextRenderer.MeasureText(this.Text, this.Font);
// evaluate the postiong of text from left;
int left = (this.Width - size.Width) / 2;
//draw a fill rectangle in order to remove the border
e.Graphics.FillRectangle(backColor, new Rectangle(left, 0, size.Width, size.Height));
//draw the text Now
e.Graphics.DrawString(this.Text, this.Font, colorBrush, new PointF(left, 0));
}
}
add the above class into your project and use "CustomGrpBox" instead of "GroupBox" which will be created after build in your tool box.
and you can set the text any time like this.
private void Form2_Load(object sender, EventArgs e)
{
customGrpBox1.Text = "Hello World";
}
it will look like this in design time visual studio
Unfortunately, you may set the title on the right by using the RightToLeft property, but there is no property to set it in the middle.
What you can do is to set an empty Text in your GroupBox, create a Label with the title and put that label above the GroupBox (with the same parent).
You may do it dynamically at form initialization by calling following procedure:
private void CenterGroupBoxTitle(GroupBox groupbox)
{
Label label = new Label() ;
label.Text = groupbox.Text ;
groupbox.Text = "" ;
label.Left = groupbox.Left+(groupbox.Width-label.Width)/2 ;
label.Top = groupbox.Top + 2 ; // 2 is an example : adjust the constant
label.Parent = groupbox.Parent ;
label.BringToFront() ;
}
Try to create a custom control using Panel as container and draw border around this, you can then have full control of the title's alignment.
If you would like a simple approach, you can leave the groupbox's title as empty text, and then place a label at the center position of the groupbox. You can also define this as user-control so you wouldn't need to do this repeatedly.
Not an eloquent solution, but if you have a simple GroupBox, that stays the( same size, you can just pad the beginning, and the end with spaces.
example : GroupBox.Text = " This is the groupbox text ";
The amount of padding of space's will depend on the length of the box.
Of course you'll lose some of the GroupBox's beginning and end lines on top, and if that's important, then Answer 3 seems like a good solution.
I'm developing an application for kind of touch screen device. In order be user friendly, I need to change size of combobox.
I've checked many thing including DrawItemEventHandler and MeasureItemEventHandler, but it didn't work as I want.
Basically I would like to change height of combobox without touching font size. When I change font size of combobox, it looks like left side of the image.
How can I set my combobox which will look like right side of the image?
By the way, don't know if it's effect solution, I am not using array string. I'm binding data like.
combobox.DisplayMember = "Name";
combobox.ValueMember = "ID";
combobox.DataSource = new BindingSource { DataSource = datalist };
Thanks in advance.
With TaW solution, I managed to set items as I want. The only thing I couldn't set text in middle when combobox items not droped down. How can I set this text position to the centre?
You can set the ItemHeight property and then draw the items yourself in the DrawItem event.
Not terribly hard, search for 'ownerdraw' & 'combobox'. There is one example on Code Project
Here is a minimal version, pulled from the above link:
private void comboBox1_DrawItem(object sender, DrawItemEventArgs e)
{
if (e.Index < 0) return;
Font f = comboBox1.Font;
int yOffset = 10;
if ((e.State & DrawItemState.Focus) == 0)
{
e.Graphics.FillRectangle(Brushes.White, e.Bounds);
e.Graphics.DrawString(comboBox1.Items[e.Index].ToString(), f, Brushes.Black,
new Point(e.Bounds.X, e.Bounds.Y + yOffset));
}
else
{
e.Graphics.FillRectangle(Brushes.Blue, e.Bounds);
e.Graphics.DrawString(comboBox1.Items[e.Index].ToString(), f, Brushes.White,
new Point(e.Bounds.X, e.Bounds.Y + yOffset));
}
}
You also have to set the DropDownStyle to DropDownList to get the highlighting to work and you need to set the DrawMode to OwnerDrawFixed. (Or to OwnerDrawVariable, if you want to have different heights for some itmes..)
Can I make a tab control to look like the attached picture? I managed to add a tab control, but the text is still vertical. And I would want it to be horizontal.
There is an MSDN article about how to achieve this. How to: Display Side-Aligned Tabs with TabControl
The following procedure shows how to render right-aligned tabs, with the tab text running from left to right, by using the "owner draw" feature.
Try this TabStrip control. I believe this is what you want.
i think this is default selected color
private void tabControl1_DrawItem(Object sender, System.Windows.Forms.DrawItemEventArgs e)
{
...
if (e.State == DrawItemState.Selected)
{
// Draw a different background color, and don't paint a focus rectangle.
_textBrush = new SolidBrush(Color.Black);
g.FillRectangle(Brushes.White, e.Bounds);
}
else
{
_textBrush = new System.Drawing.SolidBrush(e.ForeColor);
g.FillRectangle(Brushes.WhiteSmoke, e.Bounds);
}
...
image
I have a ComboBox on a form, and its default height is 21. How do I change it?
ComboBox auto-sizes to fit the font. Turning that off is not an option. If you want it bigger then give it a bigger font.
Set the DrawMode to OwnerDrawVariable. However customization of the ComboBox leads to other issues. See this link for a tutorial on how to do this completely:
http://www.csharphelp.com/2006/09/listbox-control-in-c/
OwnerDrawVariable sample code here:
https://msdn.microsoft.com/en-us/library/system.windows.forms.combobox.drawitem%28v=vs.110%29.aspx
Once that's done, you need to set the ItemHeight property of the combobox to set the effective height of the combobox.
Just as another option, if you'd like to increase the height of the ComboBox without increasing the font size or having to worry about drawing everything yourself, you can use a simple Win32 API call to increase the height like this:
using System;
using System.Runtime.InteropServices;
using System.Windows.Forms;
namespace Win32ComboBoxHeightExample
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
[DllImport("user32.dll")]
static extern IntPtr SendMessage(IntPtr hWnd, UInt32 Msg, Int32 wParam, Int32 lParam);
private const Int32 CB_SETITEMHEIGHT = 0x153;
private void SetComboBoxHeight(IntPtr comboBoxHandle, Int32 comboBoxDesiredHeight)
{
SendMessage(comboBoxHandle, CB_SETITEMHEIGHT, -1, comboBoxDesiredHeight);
}
private void button1_Click(object sender, EventArgs e)
{
SetComboBoxHeight(comboBox1.Handle, 150);
comboBox1.Refresh();
}
}
}
Result:
To do this, you need to set the DrawMode to OwnerDrawVariable or OwnerDrawFixed and manually draw your items. This can be done with a pretty simple class.
This example will allow you to use the ItemHeight property of the ComboBox regardless of font size. I threw in an bonus property TextAlign which will also allow you to center the items.
One thing worth mentioning is, you must set DropDownStyle to DropDownList for the selected item to respect our customizations.
// The standard combo box height is determined by the font. This means, if you want a large text box, you must use a large font.
// In our class, ItemHeight will now determine the height of the combobox with no respect to the combobox font.
// TextAlign can be used to align the text in the ComboBox
class UKComboBox : ComboBox
{
private StringAlignment _textAlign = StringAlignment.Center;
[Description("String Alignment")]
[Category("CustomFonts")]
[DefaultValue(typeof(StringAlignment))]
public StringAlignment TextAlign
{
get { return _textAlign; }
set
{
_textAlign = value;
}
}
private int _textYOffset = 0;
[Description("When using a non-centered TextAlign, you may want to use TextYOffset to manually center the Item text.")]
[Category("CustomFonts")]
[DefaultValue(typeof(int))]
public int TextYOffset
{
get { return _textYOffset; }
set
{
_textYOffset = value;
}
}
public UKComboBox()
{
// Set OwnerDrawVariable to indicate we will manually draw all elements.
this.DrawMode = System.Windows.Forms.DrawMode.OwnerDrawVariable;
// DropDownList style required for selected item to respect our DrawItem customizations.
this.DropDownStyle = ComboBoxStyle.DropDownList;
// Hook into our DrawItem & MeasureItem events
this.DrawItem +=
new DrawItemEventHandler(ComboBox_DrawItem);
this.MeasureItem +=
new MeasureItemEventHandler(ComboBox_MeasureItem);
}
// Allow Combo Box to center aligned and manually draw our items
private void ComboBox_DrawItem(object sender, DrawItemEventArgs e)
{
// Draw the background
e.DrawBackground();
// Draw the items
if (e.Index >= 0)
{
// Set the string format to our desired format (Center, Near, Far)
StringFormat sf = new StringFormat();
sf.LineAlignment = _textAlign;
sf.Alignment = _textAlign;
// Set the brush the same as our ForeColour
Brush brush = new SolidBrush(this.ForeColor);
// If this item is selected, draw the highlight
if ((e.State & DrawItemState.Selected) == DrawItemState.Selected)
brush = SystemBrushes.HighlightText;
// Draw our string including our offset.
e.Graphics.DrawString(this.Items[e.Index].ToString(), this.Font, brush,
new RectangleF(e.Bounds.X, e.Bounds.Y + _textYOffset, e.Bounds.Width, e.Bounds.Height), sf);
}
}
// If you set the Draw property to DrawMode.OwnerDrawVariable,
// you must handle the MeasureItem event. This event handler
// will set the height and width of each item before it is drawn.
private void ComboBox_MeasureItem(object sender,System.Windows.Forms.MeasureItemEventArgs e)
{
// Custom heights per item index can be done here.
}
}
Now we have full control over our font and height of the ComboBox separately. We no longer need to make a large font to size our ComboBox.
If you are wanting to adjust to the number of items in the ComboBox you can change the value of the DropDownHeight as follows, given a List of items. I'm using 24 here as a "per item amount"; this is by no means fixed.
comboBox1.DropDownHeight = SomeList.Count * 24;
ComboBox has a property 'DropDownHeight' which can be changed either via the properties window of the combobox or programmatically. i.e.
public partial class EventTestForm : Form
{
public EventTestForm()
{
InitializeComponent();
cmbOwners.DropDownHeight = 100;
}
In code, a.Height should work. In the designer, go into the properties and look in Size->Height.
Alternatively, you can change the Font Size and the combo box will grow bigger to accomodate it, but I don't think that's what you want.
I have a .NET application with a StatusStrip holding three ToolTipStatusLabels. The Text of the labels are filled from the application as they show the status. For some circumstances they can hold an empty text.
When I resize the window, the ToolTipStatusLabels are hidden when they cannot be fit in the StatusStrip. I would like to have the text truncated when the label cannot be fit in the StatusStrip. The default behavior to hide the label makes it difficult to distinguish between empty text or hidden label.
To indicate that the text is truncated automatically, this should be indicated with an ellipsis (...). How can this be done?
Set the label's Spring property to True to get is to adjust its size automatically. To get ellipses you'll need to override the painting. Add a new class to your project and paste the code shown below. Compile. You'll get the new SpringLabel control in the status strip designer dropdown list.
using System;
using System.Drawing;
using System.Windows.Forms;
using System.Windows.Forms.Design;
[ToolStripItemDesignerAvailability(ToolStripItemDesignerAvailability.StatusStrip)]
public class SpringLabel : ToolStripStatusLabel {
public SpringLabel() {
this.Spring = true;
}
protected override void OnPaint(PaintEventArgs e) {
var flags = TextFormatFlags.Left | TextFormatFlags.EndEllipsis;
var bounds = new Rectangle(0, 0, this.Bounds.Width, this.Bounds.Height);
TextRenderer.DrawText(e.Graphics, this.Text, this.Font, bounds, this.ForeColor, flags);
}
}
You'll need to do more work if you use the Image or TextAlign properties.