How can I create a help button that looks more "professional"?
Why not just use the graphic in the question, or any other images that you like:
Use ImageSize
to control the final size of the button:
An alternative, that I use in some applications, is something like this:
help[$helpmessage_: "", $videolink_: ""] :=
ActionMenu[
Graphics[{{RGBColor[0.689647, 0.761166, 0.805478],
Disk[{0, 0}, 0.1]}, {GrayLevel[0], Circle[{0, 0}, 0.1],
Style[Inset["?", {0.01, 0}], "Label", FontSize -> 11]}},
ImageSize -> {20, 20}],
{"Help Notes" :> MessageDialog[
Grid[{
{Style[$helpmessage, LineIndent -> 0]}
},
Alignment -> {Center, Center},
ItemSize -> {Automatic, All},
Spacings -> {0, 0}],
Background -> White],
"View Video" :> SystemOpen[$videolink]},
Appearance -> None,
BaseStyle -> {},
FrameMargins -> {{0, 0}, {-2, -2}},
ImageSize -> {20, 20}];
A couple of images that come with Mathematica. Caveat: There's no guarantee that they will be present in all (future) versions.
Button[
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Popups",
"CodeCompletion", "[email protected]"}]
],
Beep[], (* your help dialog here *)
Appearance -> "Frameless"]
Button[
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Ribbons", "Common",
"[email protected]"}]
],
Beep[], (* your help dialog here *)
Appearance -> "Frameless"]
Update
These change color slightly when the mouse is over the button:
Button[
Mouseover[
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Popups",
"CodeCompletion", "[email protected]"}]
],
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Popups",
"CodeCompletion", "[email protected]"}]
]
],
Beep[],
Appearance -> "Frameless"]
Button[
Mouseover[
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Ribbons", "Common",
"[email protected]"}]
],
Import[FileNameJoin[{$InstallationDirectory, "SystemFiles",
"FrontEnd", "SystemResources", "Bitmaps", "Ribbons", "Common",
"[email protected]"}]
]
],
Beep[],
Appearance -> "Frameless"]
Here's the general way this type of thing seems to be handled in the built-in things plus code to build the type of buttons you want.
First the button code:
makeDisk[gradSpec_, n_] :=
Rasterize[
Module[{img, disk, edge},
img =
RadialGradientImage[
gradSpec,
n
];
Graphics[
{
Inset[img, Center, Center, Scaled[1]],
White,
Annulus[{0, 0}, {1, 2}],
GrayLevel[.8],
EdgeForm[Gray],
Annulus[{0, 0}, {1, 1.1}]
},
Background -> None,
PlotRange -> {{-1.2, 1.2}, {-1.2, 1.2}},
ImageSize -> n
]
],
Background -> None
];
With[{n = 80},
imOut =
makeDisk[
{{.8*n, 5}, {n, n}} ->
{Hue[.6, .6, 1], Hue[.6, 1, 1],
Hue[.6, .3, 1]},
n
];
imHov =
makeDisk[
{{.8*n, 5}, {n, n}} ->
{Hue[.6, .4, 1], Hue[.6, .8, 1],
Hue[.6, .3, 1]},
n
];
imIn =
makeDisk[
{{.3*n, .6*n}, {n, 5}} ->
Reverse@{Hue[.6, .6, 1], Hue[.6, 1, 1], Hue[.6, 1, 1]},
n
];
{imOut, imHov, imIn}
]
And here's a way to get hover actions and things:
Button[
Style["asd", White, Bold],
Appearance ->
{
"Default" -> imOut,
"Hover" -> imHov,
"Pressed" -> imIn
}
]