We Keep Coding

Location of panel not correct when using different anchor style

this is for Winforms / C# btw.
So I am making my own ComboBox, just playing around.
The item List is basically a Panel, which is located under or above the ComboBox control, depending on its height and location.
This works as intended, as long as I use AnchorStyle Top / Left for my usercontrol.
As soon as I switch to Top / Right Style, the location of my listpanel breaks. Okay, makes sense, the location point of my usercontrol changes with the different anchorstyle, so how about I adjust my panel to a new location using my usercontrol.LocationChanged event? Doesen't work. Maybe because of the order of the events? Or does the origin of locations change depending on the given AnchorStyles?
Anyway, I am a bit lost. Unfortunately I couldn't find a similar case here, therefore this question.
Here's my DropDownPanel (effectively my "list"):
private Panel DropDownPanel()
{
Panel DropDownPanel = new Panel() {
Width = this.Width,
Height = 200,
BackColor = _skin.TextBoxBackColor,
BorderStyle = BorderStyle.FixedSingle,
ForeColor = _skin.TextBoxForeColor,
Visible = false,
AutoScroll = false
};
DropDownPanel.HorizontalScroll.Enabled = false;
DropDownPanel.HorizontalScroll.Visible = false;
DropDownPanel.HorizontalScroll.Maximum = 0;
DropDownPanel.AutoScroll = true;
DropDownPanel.Leave += DropDownPanel_Leave;
return DropDownPanel;
}
Here's my userControl Load Event:
private void GbComboBox_Load(object sender, EventArgs e)
{
_dropDownPanel = DropDownPanel();
this.Parent.Parent.Controls.Add(_dropDownPanel);
RelocateDropDownPanel();
_dropDownPanel.BringToFront();
ApplyItems(_items);
}
And my calculation for the location:
private void RelocateDropDownPanel()
{
if (_dropDownPanel != null)
{
int initLocY = this.Parent.Location.Y + this.Location.Y + this.Height + _dropDownPanel.Height;
int fullHeight = this.FindForm().Height;
Point p = new Point();
if (initLocY < fullHeight)
{
p = new Point(this.Parent.Location.X + this.Location.X, initLocY - _dropDownPanel.Height);
}
else
{
p = new Point(this.Parent.Location.X + this.Location.X, initLocY - _dropDownPanel.Height - this.Height);
}
_dropDownPanel.Location = p;
}
}

So I figured out a "solution".
I simply inherited the Anchor of my Panel from the Usercontrol it was associated to.
But I wanna mention, that still, this whole thing is kind of a crappy way of dealing with custom combobox desings. As #Jimi stated in his first comment, the correct way of doing this would be to ownerdraw the combobox. I haven't done this because of specific reasons, which didn't let me do this.
A little example on how this could be made:
Change ComboBox Border Color in Windows Forms

How to add multiline Text to a ListBox item?

I have a little problem and can't find a solution.
I would like to put a text at the end of a ListBox item and I have no idea how...
TagLib.File f = TagLib.File.Create(paths[i]);
listBox1.Items.Add("0" + i + ". " + f.Tag.Title +"\n" + string.Join(", ", f.Tag.Performers) + " - " + "\r" + f.Tag.Album + " " + f.Properties.Duration.TotalMinutes.ToString());
I've already tried it but unfortunately it doesn't work that way. Maybe someone knows how you can always put the text at the end, with a code?
I want the text of all items to match each other
And I can't find a solution how to put the text at the end and how the text can match each other

To add multiline text to a ListBox Control, you need to measure and draw the text yourself.
Set the ListBox.DrawMode to DrawMode.OwnerDrawVariable, then override OnMeasureItem and OnDrawItem.
→ OnMeasureItem is called before an Item is drawn, to allow to define the Item Size, setting the MeasureItemEventArgs e.ItemWidth and e.ItemHeight properties (you have to verify that the ListBox contains Items before trying to measure one).
→ When OnDrawItem is called, the e.Bounds property of its DrawItemEventArgs will be set to the measure specified in OnMeasureItem.
To measure the Text, you can use both the TextRenderer class MeasureText() method or Graphics.MeasureString. The former is preferred, since we're going to use the TextRenderer class to draw the Items' text: TextRenderer.DrawText is more predictable than Graphics.DrawString() in this context and it renders the text naturally (as the ListBox - or ListView - does).
The TextRenderer's TextFormatFlags are used to fine-tune the rendering behavior. I've added TextFormatFlags.ExpandTabs to the flags, so you can also add Tabs ("\t") to the Text when needed. See the visual example.
"\n" can be used to generate line feeds.
In the sample code, I'm adding 8 pixels to the measured height of the Items, since a line separator is also drawn to better define the limits of an Item (otherwise, when a Item spans more than one line, it may be difficult to understand where its text starts and ends).
▶ Important: the maximum Item.Height is 255 pixels. Beyond this measure, the Item's text may not be rendered or be rendered partially (but it usually just disappears). There's a Min/Max check on the item height in the sample code.
This is how it works:
I suggest to use a class object, if you haven't, to store your Items
and describe them. Then use a List<class> as the
ListBox.DataSource. This way, you can better define how each part
should be rendered. Some parts may use a Bold Font or a different
Color.
using System;
using System.Drawing;
using System.Windows.Forms;
public class ListBoxMultiline : ListBox
{
TextFormatFlags flags = TextFormatFlags.WordBreak |
TextFormatFlags.PreserveGraphicsClipping |
TextFormatFlags.LeftAndRightPadding |
TextFormatFlags.ExpandTabs |
TextFormatFlags.VerticalCenter;
public ListBoxMultiline() { this.DrawMode = DrawMode.OwnerDrawVariable; }
protected override void OnDrawItem(DrawItemEventArgs e)
{
if (Items.Count == 0) return;
if (e.State.HasFlag(DrawItemState.Focus) || e.State.HasFlag(DrawItemState.Selected)) {
using (var selectionBrush = new SolidBrush(Color.Orange)) {
e.Graphics.FillRectangle(selectionBrush, e.Bounds);
}
}
else {
e.DrawBackground();
}
TextRenderer.DrawText(e.Graphics, GetItemText(Items[e.Index]), Font, e.Bounds, ForeColor, flags);
if (e.Index != Items.Count - 1) {
Point lineOffsetStart = new Point(e.Bounds.X, e.Bounds.Bottom - 1);
Point lineOffsetEnd = new Point(e.Bounds.Right, e.Bounds.Bottom - 1);
e.Graphics.DrawLine(Pens.LightGray, lineOffsetStart, lineOffsetEnd);
}
base.OnDrawItem(e);
}
protected override void OnMeasureItem(MeasureItemEventArgs e)
{
if (Items.Count == 0) return;
var size = GetItemSize(e.Graphics, GetItemText(Items[e.Index]));
e.ItemWidth = size.Width;
e.ItemHeight = size.Height;
base.OnMeasureItem(e);
}
private Size GetItemSize(Graphics g, string itemText)
{
var size = TextRenderer.MeasureText(g, itemText, Font, ClientSize, flags);
size.Height = Math.Max(Math.Min(size.Height, 247), Font.Height + 8) + 8;
return size;
}
}

WinForms: Changing ForeColor of Selected item in ListView

I am setting the ForeColor of all items in my ListView to a different color, but this get's overrided when the item is selected (changes to Black again; changes back to custom color on deselection).
I want my items to retain my custom color, even in selection.
I'm basically asking the same question that was asked here 7 years ago, and doesn't seem to have any satisfactory answer.
I tried searching in SO and elsewhere, and no luck. The only solution provided so far is to draw the whole thing (the DrawItem method), which I gave a try but is ridiculously complicated for such a petty requirement...
Is this the only way? Say it ain't so.

Enable your ListView OwnerDraw mode, then subscribe its DrawItem and DrawColumnHeader events.
If your design requires it, also subcribe the DrawSubitem event.
At this point, you can draw anything in the related areas of your ListView.
In the example, I've painted a little symbol in the Header area.
The Header text needs to be painted too.
If the Background color doesn't change (same as in design mode), you just need to use the DrawListViewItemEventArgs e parameter function e.DrawBackground();
If not, use e.Graphics.FillRectangle() to color the Item area, defined by e.Bounds.
The Item Text is drawn using e.Graphics.DrawString().
The item Text is e.Item.Text, the text area is defined by e.Bounds again.
If you don't need any specific details/settings for the item's text, you can simply use e.DrawText();, which uses the default properties (defined at design-time).
Here, the item color complex logic is that the color is specified inside the item text. Could be anything else. The item tag, its Index position, a List<Parameters>, you name it.
This is how it might look like:
(I added e.Graphics.TextRenderingHint = [] to show how you can control the quality of the rendered text. e.Graphics.TextContrast can be also used to enhance the contrast).
Note: this code sample only draws a generic image, if the ListView has an ImageList. You should also verify whether the SmallIcon/LargeIcon ImageLists are defined and draw the related Image in the specified size. It's the same procedure, though.
protected void listView1_DrawItem(object sender, DrawListViewItemEventArgs e)
{
e.Item.UseItemStyleForSubItems = true;
int imageOffset = 0;
Rectangle rect = e.Item.Bounds;
bool drawImage = !(e.Item.ImageList is null);
Color itemColor = Color.FromName(e.Item.Text.Substring(e.Item.Text.LastIndexOf(" ") + 1));
using (var format = new StringFormat(StringFormatFlags.FitBlackBox)) {
format.LineAlignment = StringAlignment.Center;
if (drawImage) {
imageOffset = e.Item.ImageList.ImageSize.Width + 1;
rect.Location = new Point(e.Bounds.X + imageOffset, e.Item.Bounds.Y);
rect.Size = new Size(e.Bounds.Width - imageOffset, e.Item.Bounds.Height);
e.Graphics.DrawImage(e.Item.ImageList.Images[e.Item.ImageIndex], e.Bounds.Location);
}
if (e.Item.Selected) {
using (var bkgrBrush = new SolidBrush(itemColor))
using (var foreBrush = new SolidBrush(e.Item.BackColor)) {
e.Graphics.FillRectangle(bkgrBrush, rect);
e.Graphics.DrawString(e.Item.Text, e.Item.Font, foreBrush, rect, format);
}
e.DrawFocusRectangle();
}
else {
//e.DrawDefault = true;
using (var foreBrush = new SolidBrush(itemColor)) {
e.Graphics.DrawString(e.Item.Text, e.Item.Font, foreBrush, rect, format);
}
}
}
}
// Draws small symbol in the Header beside the normal Text
protected void listView1_DrawColumnHeader(object sender, DrawListViewColumnHeaderEventArgs e)
{
e.DrawBackground();
string extra = (e.ColumnIndex == 1) ? (char)32 + "\u2660" + (char)32 : (char)32 + "\u2663" + (char)32;
using (var brush = new SolidBrush(e.ForeColor)) {
e.Graphics.DrawString(extra + e.Header.Text, e.Font, brush, e.Bounds, StringFormat.GenericTypographic);
}
}

How do I add a button beside each node of a TreeView?

How do I add a button beside each node of a TreeView?

Adding a button beside each node of a treeview is difficult. You would have to handle drawing of the treeview yourself, and either draw the buttons yourself and emulate their functionality, or create child button controls and display them in the right places within the tree control and then handle repositioning them when the control scrolls, etc. Either way it is going to be a nightmare.
Luckily, there is an easy way out: you do not have to do any of that complicated stuff, BECAUSE YOU SHOULD NOT DO THEM!
Have you ever seen a tree control with buttons in it? No. Therefore, if your tree control has buttons in it, it will be seen by your end users as bizarre.
What you should do is consider how other applications have solved the problem that you are trying to solve without using tree controls with buttons in them, and do as they do.

The simplest way to do this is to draw tree yourself. Here is a small example (please note that PushButtonState is located inside System.Windows.Forms.VisualStyles namespace):
public class CustomTreeView : TreeView
{
private Rectangle buttonRect = new Rectangle(80, 2, 50, 26);
private StringFormat stringFormat;
public CustomTreeView()
{
SetStyle(ControlStyles.OptimizedDoubleBuffer, true);
DrawMode = TreeViewDrawMode.OwnerDrawText;
ShowLines = false;
FullRowSelect = true;
ItemHeight = 30;
stringFormat = new StringFormat();
stringFormat.Alignment = StringAlignment.Near;
stringFormat.LineAlignment = StringAlignment.Center;
}
protected override void OnDrawNode(DrawTreeNodeEventArgs e)
{
e.Graphics.DrawString(e.Node.Text, this.Font, new SolidBrush(this.ForeColor), e.Bounds, stringFormat);
ButtonRenderer.DrawButton(e.Graphics, new Rectangle(e.Node.Bounds.Location + new Size(buttonRect.Location), buttonRect.Size), "btn", this.Font, true, (e.Node.Tag != null) ? (PushButtonState)e.Node.Tag : PushButtonState.Normal);
}
protected override void OnNodeMouseClick(TreeNodeMouseClickEventArgs e)
{
if (e.Node.Tag != null && (PushButtonState)e.Node.Tag == PushButtonState.Pressed)
{
e.Node.Tag = PushButtonState.Normal;
MessageBox.Show(e.Node.Text + " clicked");
// force redraw
e.Node.Text = e.Node.Text;
}
}
protected override void OnMouseDown(MouseEventArgs e)
{
TreeNode tnode = GetNodeAt(e.Location);
if (tnode == null) return;
Rectangle btnRectAbsolute = new Rectangle(tnode.Bounds.Location + new Size(buttonRect.Location), buttonRect.Size);
if (btnRectAbsolute.Contains(e.Location))
{
tnode.Tag = PushButtonState.Pressed;
tnode.Text = tnode.Text;
}
}
}
Also, you can achieve this even without creating custom control - just add these event handlers to standard TreeView

Can I display links in a ListView's detail mode?

I'm displaying a set of search results in a ListView. The first column holds the search term, and the second shows the number of matches.
There are tens of thousands of rows, so the ListView is in virtual mode.
I'd like to change this so that the second column shows the matches as hyperlinks, in the same way as a LinkLabel shows links; when the user clicks on the link, I'd like to receive an event that will let me open up the match elsewhere in our application.
Is this possible, and if so, how?
EDIT: I don't think I've been sufficiently clear - I want multiple hyperlinks in a single column, just as it is possible to have multiple hyperlinks in a single LinkLabel.

You can easily fake it. Ensure that the list view items you add have UseItemStyleForSubItems = false so that you can set the sub-item's ForeColor to blue. Implement the MouseMove event so you can underline the "link" and change the cursor. For example:
ListViewItem.ListViewSubItem mSelected;
private void listView1_MouseMove(object sender, MouseEventArgs e) {
var info = listView1.HitTest(e.Location);
if (info.SubItem == mSelected) return;
if (mSelected != null) mSelected.Font = listView1.Font;
mSelected = null;
listView1.Cursor = Cursors.Default;
if (info.SubItem != null && info.Item.SubItems[1] == info.SubItem) {
info.SubItem.Font = new Font(info.SubItem.Font, FontStyle.Underline);
listView1.Cursor = Cursors.Hand;
mSelected = info.SubItem;
}
}
Note that this snippet checks if the 2nd column is hovered, tweak as needed.

Use ObjectListView -- an open source wrapper around a standard ListView. It supports links directly:
This recipe documents the (very simple) process and how you can customise it.

The other answers here are great, but if you don't want to have to hack some code together, look at the DataGridView control which has support for LinkLabel equivalent columns.
Using this control, you get all the functionality of the details view in a ListView, but with more customisation per row.

You can by inheriting the ListView control override the method OnDrawSubItem.
Here is a VERY simple example of how you might do:
public class MyListView : ListView
{
private Brush m_brush;
private Pen m_pen;
public MyListView()
{
this.OwnerDraw = true;
m_brush = new SolidBrush(Color.Blue);
m_pen = new Pen(m_brush)
}
protected override void OnDrawColumnHeader(DrawListViewColumnHeaderEventArgs e)
{
e.DrawDefault = true;
}
protected override void OnDrawSubItem(DrawListViewSubItemEventArgs e)
{
if (e.ColumnIndex != 1) {
e.DrawDefault = true;
return;
}
// Draw the item's background.
e.DrawBackground();
var textSize = e.Graphics.MeasureString(e.SubItem.Text, e.SubItem.Font);
var textY = e.Bounds.Y + ((e.Bounds.Height - textSize.Height) / 2);
int textX = e.SubItem.Bounds.Location.X;
var lineY = textY + textSize.Height;
// Do the drawing of the underlined text.
e.Graphics.DrawString(e.SubItem.Text, e.SubItem.Font, m_brush, textX, textY);
e.Graphics.DrawLine(m_pen, textX, lineY, textX + textSize.Width, lineY);
}
}

You can set HotTracking to true so that when the user hovers mouse over the item it appears as link.