如何将文本大纲添加到button.text?

时间:2016-10-28 17:45:04

标签: .net vb.net winforms

button with backgroundimage and text

enter image description here

由于图像颜色的问题,文本是不可读的,我能想到解决问题以使文本可读的唯一方法是通过向按钮文本添加文本轮廓,但我不知道如何添加大纲

或者在将背景图像添加到按钮后,有人可以提出任何其他好主意来解决文本的可读性问题吗?

3 个答案:

答案 0 :(得分:2)

正如其他人所提到的,没有一个简单的属性可以将文本呈现为大纲。您需要绘制文本或执行其他操作。

一个非常简单的方法是“空心”,轮廓字体:

Dim bmp As New Bitmap("C:\Temp\BigHead_thumb1.jpg")
Dim txt = "I AM BIGHEAD"
Using g = Graphics.FromImage(bmp)
    Using fnt = New Font("OutLined", 20)

        Dim sz = g.MeasureString(txt, fnt)

        Dim x = (bmp.Width - sz.Width) / 2
        Dim y = (bmp.Height - sz.Height) - 10

        g.DrawString(txt, fnt, Brushes.AntiqueWhite, x, y)
        pb1.Image = bmp

    End Using
End Using

结果:

enter image description here

我不认为结果会膨胀。如果你试图使文本脱颖而出,让图像显示文本的一部分并不能很好地服务于这个目的。图像越小,就越糟糕。

如果您必须使用字体搜索大纲样式字体,您可能需要考虑从某处购买/许可它。许多免费软件看起来都不对。

为了使其更突出,您可以在文本后面使用遮光效果。它有点粗糙,但允许最大的可读性,特别是如果图像很小:

Using g = Graphics.FromImage(bmp)
    Using fnt = New Font("VERDANA", 18)

        Dim sz = g.MeasureString(txt, fnt).ToSize()
        Dim x = (bmp.Width - sz.Width) \ 2
        Dim y = (bmp.Height - sz.Height) - 10

        Dim r = New Rectangle(x, y, sz.Width + 8, sz.Height + 2)
        g.FillRectangle(Brushes.Black, r)
        g.DrawString(txt, fnt, Brushes.AntiqueWhite, r)
        pb1.Image = bmp

    End Using
End Using

结果:

enter image description here

在这两个极端之间,您可以使用GraphicsPath绘制文本的超大图像作为后部,然后使用不同颜色的实际文本。

Using g = Graphics.FromImage(bmp)
    Using fnt = New Font("VERDANA", 18)
        Dim sz = g.MeasureString(txt, fnt).ToSize()
        Dim x = (bmp.Width - sz.Width) \ 2
        Dim y = (bmp.Height - sz.Height) - 10

        Using gp As New GraphicsPath,
            br As New SolidBrush(Color.DimGray),
            p As New Pen(Color.WhiteSmoke, 6)

            gp.AddString(" " & txt, fnt.FontFamily, 1, 
                         22, New Point(x, y), 
                         StringFormat.GenericTypographic)
            g.DrawPath(p, gp)
            g.FillPath(br, gp)

        End Using
    End Using
End Using
pb1.Image = bmp

它涉及的更多,但结果相当不错:

enter image description here

左侧的图像使用上面的代码。中心图像对两种颜色使用WhiteSmoke,外部Pen颜色使用较低的Alpha值,从而产生更柔和的外观。右边的那个使用近黑色的笔作为一种遮光效果。

最好使用一些更多的计算变量。例如,轮廓而不是22,应该是基于字体大小的一些,如+ 25%,因此结果根据使用的字体大小进行缩放。

答案 1 :(得分:0)

如果您的图片和文字是静态的,最好的办法是手动合并图像和文字并使用生成的图像。如果其中任何一个是动态的,例如,从数据库中,您可能希望查看使用GDI处理图像。

GDI将允许您直接将文本绘制到Bitmap。您可以先绘制“阴影”,然后绘制实际文本,水平和垂直偏移几个像素。渲染完整图像后,您可以使用具有按钮背景的图像。

这样的事情应该有效,但你需要修改其中一些以满足你的需要。它将拍摄一张图像,并为其添加一些阴影文本,您将希望避免使用此设置按钮的Text属性,并且仅依赖于绘图。您可能希望查看文本居中(使用Graphics.MeasureString),因为我随机选择了一些坐标来绘制文本,显然对您来说不是完全正确的。

Public Sub AddText(picture as Bitmap, text as string)
    Using g as new Graphics.FromImage(picture)
        G.DrawString(text, Me.Font, Brushes.White, 10, 10)
        G.DrawString(text, Me.Font, Brushes.Black, 12, 12)
    End Using
End Sub

我现在无法测试,所以可能会有一些错误。

答案 2 :(得分:-1)

通过在vb.Net中使用类似“TableLayoutPanel”的布局,您可以将文本与图像分开,以使用绝对和相对定位来解决您的问题