タブコントロールに「x」(閉じるボタン)と「+」(新しいタブボタン)を持たせようとしています。 _x button
_ を追加するソリューションを見つけました。タブは次のようになります。
しかし、私は_+
_を追加したいと思います。今、その黒い円はどこにありますか。方法がわかりません。最後のタブのPaint
イベントを次のように描画してみました:
_var p = tabs.TabPages[tabs.TabCount - 1];
p.Paint += new PaintEventHandler(tab_OnDrawPage);
private void tab_OnDrawPage(object sender, PaintEventArgs e)
{
// e.ClipRectangle.
e.Graphics.DrawString("+",
new Font("verdana",
10,
FontStyle.Bold),
Brushes.Black,
e.ClipRectangle.X + 10,
e.ClipRectangle.Y + 10);
}
_
しかし、それは何も引き分けを示しませんでした。 DrawString()
呼び出しに渡した位置に関係していると思いますが、使用する適切な位置がわかりません。 +10を使用して、最後のタブから引き離しました。それを修正する方法は?私は自分でカスタム描画を行ったことがなく、それを学んでいます。
オプションとして、追加アイコンを表示するタブを追加できます ユーザーがそのタブをクリックしたときに確認し、その前に新しいTabPage
を挿入します。
また、Selecting
のTabControl
イベントを使用するだけで、その余分なタブを選択しないようにすることもできます。このように、最後のタブは、IEやChromeのように、追加ボタンのようにのみ機能します。
実装の詳細
所有者の描画タブを使用して、各タブに閉じるアイコンを表示し、最後のタブに追加アイコンを表示します。 DrawItem
を使用して閉じるアイコンを描画し、MouseDown
を使用して閉じるボタンをクリックして追加し、Selecting
を使用して最後のタブが選択されないようにし、HandleCreated
を使用してタブの幅を調整します。以下のすべての実装設定とコードを確認できます。
初期化
パディングとDrawMode
を設定し、DrawItem
、MouseDown
、Selecting
、およびHandleCreated
イベントにイベントハンドラーを割り当てます。
this.tabControl1.Padding = new Point(12, 4);
this.tabControl1.DrawMode = TabDrawMode.OwnerDrawFixed;
this.tabControl1.DrawItem += tabControl1_DrawItem;
this.tabControl1.MouseDown += tabControl1_MouseDown;
this.tabControl1.Selecting += tabControl1_Selecting;
this.tabControl1.HandleCreated += tabControl1_HandleCreated;
閉じるボタンをクリックしてボタンを追加する
MouseDown
またはMouseClick
イベントを処理し、最後のタブ長方形にマウスクリックポイントが含まれているかどうかを確認してから、最後のタブの前にタブを挿入できます。その他、閉じるボタンの1つにクリックされた場所が含まれているかどうかを確認してから、閉じるボタンがクリックされたタブを閉じます。
private void tabControl1_MouseDown(object sender, MouseEventArgs e)
{
var lastIndex = this.tabControl1.TabCount - 1;
if (this.tabControl1.GetTabRect(lastIndex).Contains(e.Location))
{
this.tabControl1.TabPages.Insert(lastIndex, "New Tab");
this.tabControl1.SelectedIndex = lastIndex;
}
else
{
for (var i = 0; i < this.tabControl1.TabPages.Count; i++)
{
var tabRect = this.tabControl1.GetTabRect(i);
tabRect.Inflate(-2, -2);
var closeImage = Properties.Resources.DeleteButton_Image;
var imageRect = new Rectangle(
(tabRect.Right - closeImage.Width),
tabRect.Top + (tabRect.Height - closeImage.Height) / 2,
closeImage.Width,
closeImage.Height);
if (imageRect.Contains(e.Location))
{
this.tabControl1.TabPages.RemoveAt(i);
break;
}
}
}
}
最後のタブでの選択を防ぐ
最後のタブが選択されないようにするには、制御のSelecting
イベントを処理し、選択しているタブが最後のタブであるかどうかを確認し、イベントをキャンセルします。
private void tabControl1_Selecting(object sender, TabControlCancelEventArgs e)
{
if (e.TabPageIndex == this.tabControl1.TabCount - 1)
e.Cancel = true;
}
閉じるボタンを描画してボタンを追加
閉じるボタンを描画してボタンを追加するには、DrawItem
イベントを処理できます。私はこれらのアイコンを追加に使用しました 閉じます ボタン。
private void tabControl1_DrawItem(object sender, DrawItemEventArgs e)
{
var tabPage = this.tabControl1.TabPages[e.Index];
var tabRect = this.tabControl1.GetTabRect(e.Index);
tabRect.Inflate(-2, -2);
if (e.Index == this.tabControl1.TabCount - 1)
{
var addImage = Properties.Resources.AddButton_Image;
e.Graphics.DrawImage(addImage,
tabRect.Left + (tabRect.Width - addImage.Width) / 2,
tabRect.Top + (tabRect.Height - addImage.Height) / 2);
}
else
{
var closeImage = Properties.Resources.DeleteButton_Image;
e.Graphics.DrawImage(closeImage,
(tabRect.Right - closeImage.Width),
tabRect.Top + (tabRect.Height - closeImage.Height) / 2);
TextRenderer.DrawText(e.Graphics, tabPage.Text, tabPage.Font,
tabRect, tabPage.ForeColor, TextFormatFlags.Left);
}
}
タブ幅の調整
タブの幅を調整し、最後のタブの幅を狭くするには、HandleCreated
イベントを処理して、 TCM_SETMINTABWIDTH
コントロールに移動し、タブ幅に許可される最小サイズを指定します。
[DllImport("user32.dll")]
private static extern IntPtr SendMessage(IntPtr hWnd, int msg, IntPtr wp, IntPtr lp);
private const int TCM_SETMINTABWIDTH = 0x1300 + 49;
private void tabControl1_HandleCreated(object sender, EventArgs e)
{
SendMessage(this.tabControl1.Handle, TCM_SETMINTABWIDTH, IntPtr.Zero, (IntPtr)16);
}
ダウンロード
ここでコードをダウンロードするか、リポジトリのクローンを作成できます。
通常、このようなことを行うための直接的な「低レベル」の方法は、Paint
イベントを処理してTabControl
自体に描画し、次にマウス入力イベントを処理してクリックを検出することです。あなたが描いた場所。
ただし、a)それは面倒であり、b)TabControl
はPaint
イベントを抑制するため、さらに下位レベルに移動して_WM_Paint
_メッセージを処理せずに処理することはできません。 WndProc()
メソッドのオーバーライド。
あなたの目的のために、私は単に新しいコントロールを追加することをお勧めします。 Button
をForm
に移動し、ユーザーがクリックできるようにするTabControl
の場所のすぐ上に配置します。次に、_Button.Click
_イベントハンドラーで、必要に応じて新しいページを追加できます。 Button
とTabControl
の組み合わせをカプセル化する場合は、UserControl
を使用できます。
例えば:
TabControlWithAdd.Designer.cs:
_partial class TabControlWithAdd
{
/// <summary>
/// Required designer variable.
/// </summary>
private System.ComponentModel.IContainer components = null;
/// <summary>
/// Clean up any resources being used.
/// </summary>
/// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
protected override void Dispose(bool disposing)
{
if (disposing && (components != null))
{
components.Dispose();
}
base.Dispose(disposing);
}
#region Component Designer generated code
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.button1 = new System.Windows.Forms.Button();
this.tabControl1 = new System.Windows.Forms.TabControl();
this.tabPage1 = new System.Windows.Forms.TabPage();
this.tabPage2 = new System.Windows.Forms.TabPage();
this.tabControl1.SuspendLayout();
this.SuspendLayout();
//
// button1
//
this.button1.Anchor = ((System.Windows.Forms.AnchorStyles)((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Right)));
this.button1.Location = new System.Drawing.Point(247, 3);
this.button1.Name = "button1";
this.button1.Size = new System.Drawing.Size(23, 23);
this.button1.TabIndex = 0;
this.button1.Text = "+";
this.button1.UseVisualStyleBackColor = true;
this.button1.Click += new System.EventHandler(this.button1_Click);
//
// tabControl1
//
this.tabControl1.Anchor = ((System.Windows.Forms.AnchorStyles)((((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Bottom)
| System.Windows.Forms.AnchorStyles.Left)
| System.Windows.Forms.AnchorStyles.Right)));
this.tabControl1.Controls.Add(this.tabPage1);
this.tabControl1.Controls.Add(this.tabPage2);
this.tabControl1.Location = new System.Drawing.Point(3, 3);
this.tabControl1.Name = "tabControl1";
this.tabControl1.SelectedIndex = 0;
this.tabControl1.Size = new System.Drawing.Size(267, 181);
this.tabControl1.TabIndex = 1;
//
// tabPage1
//
this.tabPage1.Location = new System.Drawing.Point(4, 25);
this.tabPage1.Name = "tabPage1";
this.tabPage1.Padding = new System.Windows.Forms.Padding(3);
this.tabPage1.Size = new System.Drawing.Size(259, 152);
this.tabPage1.TabIndex = 0;
this.tabPage1.Text = "tabPage1";
this.tabPage1.UseVisualStyleBackColor = true;
//
// tabPage2
//
this.tabPage2.Location = new System.Drawing.Point(4, 25);
this.tabPage2.Name = "tabPage2";
this.tabPage2.Padding = new System.Windows.Forms.Padding(3);
this.tabPage2.Size = new System.Drawing.Size(192, 71);
this.tabPage2.TabIndex = 1;
this.tabPage2.Text = "tabPage2";
this.tabPage2.UseVisualStyleBackColor = true;
//
// TabControlWithAdd
//
this.AutoScaleDimensions = new System.Drawing.SizeF(8F, 16F);
this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
this.Controls.Add(this.button1);
this.Controls.Add(this.tabControl1);
this.Name = "TabControlWithAdd";
this.Size = new System.Drawing.Size(273, 187);
this.tabControl1.ResumeLayout(false);
this.ResumeLayout(false);
}
#endregion
private System.Windows.Forms.Button button1;
private System.Windows.Forms.TabControl tabControl1;
private System.Windows.Forms.TabPage tabPage1;
private System.Windows.Forms.TabPage tabPage2;
}
_
TabControlWithAdd.cs:
_public partial class TabControlWithAdd : UserControl
{
public TabControlWithAdd()
{
InitializeComponent();
}
private void button1_Click(object sender, EventArgs e)
{
tabControl1.TabPages.Add("Tab " + (tabControl1.TabPages.Count + 1));
}
}
_
上記ではButton
を使用していますが、もちろん、Label
(ボタンの境界線の外観が必要ない場合など)など、他のクリック可能なコントロールを使用して、視覚効果を生成することもできます。欲しいです。
別の方法は、TabControl
クラスを拡張する新しいTabControl
を作成することです。私は一度同じ問題を抱えていましたが、それが私がそれをした方法でした、私は完成したコードを見つけることができませんでしたが、これはあなたのタブにX
を追加することで機能します、同じことが+
記号にも適用できます:
public delegate bool PreRemoveTab(int indx);
public class TabControlEx : TabControl
{
public TabControlEx()
: base()
{
PreRemoveTabPage = null;
this.DrawMode = TabDrawMode.OwnerDrawFixed;
}
public PreRemoveTab PreRemoveTabPage;
protected const int size = 5;
protected int moveRight = 0;
protected int MoveRight
{
get { return moveRight; }
set { moveRight = value; }
}
protected override void OnDrawItem(DrawItemEventArgs e)
{
Brush b = new SolidBrush(Color.Salmon);
Brush b1 = new SolidBrush(Color.Black);
Font f = this.Font;
Font f1 = new Font("Arial", 9,FontStyle.Bold);
if (e.Index != 0)
{
Rectangle r = e.Bounds;
r = GetTabRect(e.Index);
r.Offset(2, 2);
r.Width = size;
r.Height = size;
Pen p = new Pen(b,2);
string title = this.TabPages[e.Index].Text;
string boldLetter = title.Substring(0, 1);
title = title.Remove(0, 1);
MoveRight = ((Int32)e.Graphics.MeasureString(title, f, 200).Width) + 1; // -1
e.Graphics.DrawLine(p, r.X +10 + MoveRight - 2, r.Y, r.X +10 + MoveRight + r.Width, r.Y + r.Height+2);
e.Graphics.DrawLine(p, r.X +10 + MoveRight + r.Width, r.Y, r.X + 10 + MoveRight-2, r.Y + r.Height+2);
e.Graphics.DrawString(boldLetter, f1, b1, new PointF(r.X, r.Y));
e.Graphics.DrawString(title, f, b1, new PointF(r.X+8, r.Y+1));
}
else
{
Rectangle r = GetTabRect(e.Index);
e.Graphics.DrawString(this.TabPages[e.Index].Text, f, b1, new PointF(r.X + 5, r.Y));
}
}
protected override void OnMouseClick(MouseEventArgs e)
{
Point p = e.Location;
for (int i = 0; i < TabCount; i++)
{
Rectangle r = GetTabRect(i);
r.Offset(2, 2);
r.Width = size+2;
r.Height = size+2;
r.X = r.X + MoveRight + 8;
if (r.Contains(p))
{
if (i != 0)
{
CloseTab(i);
}
}
}
}
private void CloseTab(int i)
{
if (PreRemoveTabPage != null)
{
bool closeIt = PreRemoveTabPage(i);
if (!closeIt)
return;
}
TabPages.Remove(TabPages[i]);
}
}
ニーズに合うまで少し変更してみてください。