4
$\begingroup$

For certain Appearance options of Button you can control the Background, but how does one alter the style of the frame in these cases?

Button["xxx", Null, Appearance -> #, Background -> RandomColor[], 
   FrameMargins -> 5] & /@ {"Frameless", "DialogBox", "Palette", None}

enter image description here

It seems like the Button's frame must be styleable, probably with BaseStyle, but for some reason I can't figure it out.

Update:

I need a button with Appearance->"DialogBox" and a specific background and frame style. Your suggestion isn't pixel perfect:

Magnify[Framed[Button["x", Null, 
   Appearance -> "DialogBox", Background -> Yellow, 
   ImageMargins->0], FrameMargins->None, 
   FrameStyle->Yellow], 8]

enter image description here

$\endgroup$
2
  • $\begingroup$ What are you trying to do here? Do you want to use a nine-patch as the Appearance (this gives the most variability in appearances) or are you just trying to get a different frame styling? If that's the case I'd just used Framed[Button[..., ImageMargins->0], FrameMargins->None] or something along those lines $\endgroup$
    – b3m2a1
    Apr 14, 2020 at 1:42
  • $\begingroup$ @b3m2a1 see update $\endgroup$
    – M.R.
    Apr 14, 2020 at 5:23

2 Answers 2

4
$\begingroup$

I'm not sure what you exactly need but you might have better control using Graphics combined with frameless appearance?

    Button[Mouseover[Graphics[{Rectangle[]}], 
  Graphics[{Black, Rectangle[], White, Text["Check", {0.5, 0.5}]}]], 
 Print[10!], Background -> White, Appearance -> "Frameless"]
$\endgroup$
3
$\begingroup$
{default, hover, pressed} = Rasterize[Framed[Style["button ... ", 16], 
     Background -> #[[1]], 
     RoundingRadius -> 10, FrameMargins -> 15, 
     FrameStyle ->   Directive[#[[2]], AbsoluteThickness[5]]], 
   Background -> None, ImageResolution -> 200] & /@
  {{Yellow, Orange}, {LightBlue, Blue}, {LightGray, Gray}}

enter image description here

Row[{default, hover, pressed}, 
   Spacer[10], Background -> Black, Frame -> True, FrameMargins -> 5]

enter image description here

Button["",  
  Appearance -> {"Default" -> default, "Hover" -> hover, "Pressed" -> pressed}]

enter image description here

Update: The issue mentioned by Sau in comments re white background in the corners in CreateDialog window is probably version/os related. It does not arise in Version 13.1.0 (Windows 10 -64bit).

CreateDialog[{TextCell["Click OK to close"], 
  Column[{Button["", Appearance -> {"Default" -> default, "Hover" -> hover, 
       "Pressed" -> pressed}, ImageMargins -> 5], 
       DefaultButton[]}, 
   Alignment -> Center]}]

enter image description here

$Version
"11.3.0 for Microsoft Windows (64-bit) (March 7, 2018)"
$\endgroup$
5
  • $\begingroup$ If I put the button inside a CreateDialog, it shows the white background at the corners. ``` CreateDialog[Button["", Appearance -> {"Default" -> default, "Hover" -> hover, "Pressed" -> pressed}]]```. Can you tell a workaround for this? $\endgroup$
    – Sâu
    Dec 29, 2020 at 12:31
  • $\begingroup$ @Sâu, you can add the option Background -> None to Rasterize. $\endgroup$
    – kglr
    Dec 29, 2020 at 22:21
  • $\begingroup$ That doesn’t fix it. The white corners still exist after rasterizing with Background set to none. $\endgroup$
    – Sâu
    Dec 30, 2020 at 2:00
  • 1
    $\begingroup$ @Sau, the issue is probably version/os related (it does not arise in v 11.3.0 (windows 10). You might want to post this as a separate question with version/os information. $\endgroup$
    – kglr
    Dec 30, 2020 at 2:22
  • $\begingroup$ Thanks for the input. I will look into this. $\endgroup$
    – Sâu
    Dec 30, 2020 at 3:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.