左侧带有图像的标签 - 防止文字出现在图片上？答案

【问题标题】：Label with an Image on the left - preventing the text to come over the picture?左侧带有图像的标签 - 防止文字出现在图片上？
【发布时间】：2012-01-28 23:35:25
【问题描述】：

我想报告用 C# 编写的 WinForm 应用程序中的操作状态。为了更方便用户使用，我想根据状态在左侧显示一个图标。

过程中的动画 GIF
确定或错误图标取决于结果。

我想使用原生 WinForms Label 控件，它可以很好地处理动画 GIF 并且看起来尽可能标准。

然而，我的问题是文字是写在图片上的。似乎没有任何属性可以为文本设置边距。我尝试了最明显的方法，就是在它前面加上空格，这很有效，除非文本换行到下一行，如下所示。

如果可能的话，我宁愿不要花太多时间为此编写/测试/调试派生控件... 我可以放一个快速而肮脏的用户控件，在标签的左侧放一个图片框，但感觉不是很干净。

有什么技巧可以快速优雅地解决这个问题，或者有人可以指出一个支持这个相对轻量级的 Label 派生类吗？（我查看了 CodeProject，但找不到太多内容）。

谢谢。

【问题讨论】：

标签： c# winforms label

【解决方案1】：

一个简单的替代方法是使用Button 而不是Label，如下所示：

通过使用以下属性，您可以设置Button 的样式，使其看起来像Label，同时还可以选择保持图像和文本彼此相邻对齐：

FlatAppearance ↴
  BorderSize         = 0
  MouseDownBackColor = Control
  MouseOverBackColor = Control
FlatStyle            = Flat
Image                = [Your image]
ImageAlign           = MiddleLeft
Text                 = [Your text]
TextAlign            = MiddleLeft
TextImageRelation    = ImageBeforeText

达到预期效果的简单方法；没有用户控件！

【讨论】：

聪明的想法，虽然在我的情况下我仍然可以点击它，然后按钮看起来被按下。将 Enabled 设置为 false 使其看起来不同（图像变灰，gif 动画停止）。
@KharlosDominguez 这很奇怪，我设法让它看起来很完美。稍后我会看看它并报告！
@KharlosDominguez 我不认为您将FlatAppearance → MouseDownBackColor 设置为Control（或您的背景颜色）。这是我唯一能复制你所说的话的方法。
你好，丹尼。简单但完美的解决方案。您的答案可能会被选为最佳答案。
我喜欢这个答案。我可以轻松地将图像及其文本居中在表单的中心，而无需添加任何代码。

【解决方案2】：

带有图像和单独标签的快捷用户控件是您的最佳选择。只需添加一个公共字符串属性来设置标签的文本，就大功告成了。

【讨论】：

【解决方案3】：

这是一个不同的解决方案，我发现它比“样式按钮”方法更简单。它还允许您设置图像和文本之间的距离（间距）。

class ImageLabel : Label
{
    public ImageLabel()
    {
        ImageAlign = ContentAlignment.MiddleLeft;
    }

    private Image _image;
    public new Image Image
    {
        get { return _image; }

        set
        {
            const int spacing = 4;

            if (_image != null)
                Padding = new Padding(Padding.Left - spacing - _image.Width, Padding.Top, Padding.Right, Padding.Bottom);

            if (value != null)
                Padding = new Padding(Padding.Left + spacing + value.Width, Padding.Top, Padding.Right, Padding.Bottom);

            _image = value;
        }
    }

    protected override void OnPaint(PaintEventArgs e)
    {
        if (Image != null)
        {
            Rectangle r = CalcImageRenderBounds(Image, ClientRectangle, ImageAlign);
            e.Graphics.DrawImage(Image, r);
        }

        base.OnPaint(e); // Paint text
    }
}

【讨论】：

这适用于左对齐，我正在尝试将它用于中间居中对齐但它不起作用，关于什么填充值适用于 middlecenter 有什么建议吗？

【解决方案4】：

UserControl 的替代方法是使用具有两列和一行的TableLayoutPanel，将图像控件放在一个单元格中，将文本控件放在另一个单元格中。

【讨论】：

【解决方案5】：

这是一个老问题，但也许有人会像我一样看这里......

您可以在图像和文本上使用对齐：

label.TextAlign = ContentAlignment.MiddleRight;
label.ImageAlign = ContentAlignment.MiddleLeft;

【讨论】：

不正确。根据控件的大小，您的解决方案仍然可以将文本与图像重叠。它也确实解决了这个问题。您实际上是在试图使它们彼此远离
它可以工作，因为您的标签文本大小和图像大小足够小。如果您尝试使标签更小，它们将重叠。在某些情况下，如果您不调整控件大小或更改标签文本，您的解决方案是可以接受的。但是您没有解决问题（尝试使其与多行文本一起使用，如问题所示）

【解决方案6】：

nameoftextlabel.hidden=1

应该可以。

【讨论】：

1) hidden 不是有效属性； 2) 1 不是一个有效的布尔值； 3) 隐藏标签无论如何也无济于事