PureBasic Forums - English

Posted: **Sat Oct 18, 2014 8:38 pm**

Anyone know how to create transluscent Windows that are new in Yosemite?

Posted: **Sun Oct 19, 2014 6:46 am**

It looks like you need NSVisualEffectView for that.
Something like ...

#NSFullSizeContentViewWindowMask = 1 << 15

Enumeration
  #NSVisualEffectBlendingModeBehindWindow
  #NSVisualEffectBlendingModeWithinWindow
EndEnumeration

Enumeration
  #NSVisualEffectMaterialAppearanceBased
  #NSVisualEffectMaterialLight
  #NSVisualEffectMaterialDark
  #NSVisualEffectMaterialTitlebar
EndEnumeration

Enumeration
  #NSVisualEffectStateFollowsWindowActiveState
  #NSVisualEffectStateActive
  #NSVisualEffectStateInactive
EndEnumeration

Enumeration
  #NSWindowTitleVisible
  #NSWindowTitleHidden
EndEnumeration

If OpenWindow(0, 100, 200, 195, 260, "PureBasic Window", #PB_Window_Invisible | #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_MaximizeGadget)
  
  Frame.NSRect\size\width = WindowWidth(0)
  Frame\size\height = WindowHeight(0)
  
  Window0_ID = WindowID(0)
  
  styleMask = CocoaMessage(0, Window0_ID, "styleMask") | #NSFullSizeContentViewWindowMask
  CocoaMessage(0, Window0_ID, "setStyleMask:", styleMask)
  CocoaMessage(0, Window0_ID, "setTitleVisibility:", #NSWindowTitleHidden)
  CocoaMessage(0, Window0_ID, "setTitlebarAppearsTransparent:", #YES)
  
  blurryView = CocoaMessage(0, CocoaMessage(0, 0, "NSVisualEffectView alloc"), "initWithFrame:@", @Frame)
  CocoaMessage(0, blurryView, "setBlendingMode:", #NSVisualEffectBlendingModeBehindWindow)
  CocoaMessage(0, blurryView, "setMaterial:", #NSVisualEffectMaterialLight)
  CocoaMessage(0, blurryView, "setState:", #NSVisualEffectStateActive)
  CocoaMessage(0, CocoaMessage(0, Window0_ID, "contentView"), "addSubview:", blurryView)
  
  HideWindow(0, #False)
  
  Repeat
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow
  
EndIf

Edit:
Updated the code with NSFullSizeContentViewWindowMask mentioned by Danilo

Posted: **Sun Oct 19, 2014 8:06 am**

Somehow the light material does not work for me. The following works here:

Code: Select all

Procedure SetWindowAlpha(window,alpha.CGFloat)
    CocoaMessage(0,WindowID(window),"setAlphaValue:@",@alpha)
EndProcedure

Procedure SetWindowMoveableByBackground(window,yesNo)
    CocoaMessage(0,WindowID(window),"setMovableByWindowBackground:",yesNo)
EndProcedure

Procedure SetGadgetAlpha(gadget,alpha.CGFloat)
    CocoaMessage(0,GadgetID(gadget),"setAlphaValue:@",@alpha)
EndProcedure

Procedure YosemiteGlassWindow(window)
    CocoaMessage(@visualEffectView,0,"NSVisualEffectView alloc")
    If visualEffectView
        rect.NSREct
        rect\size\width = WindowWidth(window);*0.5
        rect\size\height = WindowHeight(window)
        
        CocoaMessage(0,visualEffectView,"initWithFrame:@",@rect)
        CocoaMessage(0,visualEffectView,"setMaterial:",2)
        CocoaMessage(0,visualEffectView,"setState:",1)
        
        CocoaMessage(0,CocoaMessage(0,WindowID(window),"contentView"),"addSubview:@",@visualEffectView)
        CocoaMessage(0,WindowID(window),"setTitlebarAppearsTransparent:",#YES)
    EndIf
EndProcedure



Procedure OnBtnClick()
    End
EndProcedure

OpenWindow(0,0,0,800,600,"Transparent Window",#PB_Window_Invisible|#PB_Window_ScreenCentered|#PB_Window_BorderLess)
SetWindowColor(0,RGB($40,$40,$40))
SetWindowMoveableByBackground(0,#YES)

If OSVersion() < 10100
    SetWindowAlpha(0,0.8)
Else
    YosemiteGlassWindow(0)
EndIf


ButtonGadget(0,20,20,100,25,"Quit")
;SetGadgetAlpha(0,0.5)
BindGadgetEvent(0,@OnBtnClick())


OpenWindow(1,0,0,300,200,"Tool",#PB_Window_Invisible|#PB_Window_WindowCentered|#PB_Window_TitleBar,WindowID(0))
SetWindowColor(1,RGB($40,$40,$40))
SetWindowMoveableByBackground(1,#YES)

If OSVersion() < 10100
    SetWindowAlpha(1,0.8)
Else
    YosemiteGlassWindow(1)
EndIf




HideWindow(0,#False)
HideWindow(1,#False)

Repeat:Until WaitWindowEvent()=#PB_Event_CloseWindow

Posted: **Sun Oct 19, 2014 12:25 pm**

Comparison of some Yosemite styles, including glass window that extends into the titlebar.
In my opinion the effect is much better by using the dark style.

Code: Select all

Procedure SetWindowAlpha(window,alpha.CGFloat)
    CocoaMessage(0,WindowID(window),"setAlphaValue:@",@alpha)
EndProcedure

Procedure SetWindowMoveableByBackground(window,yesNo)
    CocoaMessage(0,WindowID(window),"setMovableByWindowBackground:",yesNo)
EndProcedure

Procedure SetGadgetAlpha(gadget,alpha.CGFloat)
    CocoaMessage(0,GadgetID(gadget),"setAlphaValue:@",@alpha)
EndProcedure



Enumeration ;GlassWindowStyle
    #GlassWindow_Light      = 1
    #GlassWindow_Dark       = 2
    #GlassWindow_Lighter    = 3
    #GlassWindow_FullSize   = 1 << 8
    #GlassWindow_Titlebar   = 1 << 9
EndEnumeration

Enumeration
    #GlassWindowState_ActiveOnly = 0
    #GlassWindowState_Always     = 1
EndEnumeration

Procedure YosemiteGlassWindow(window,glassWindowStyle,glassWindowState=#GlassWindowState_Always)
    CocoaMessage(@visualEffectView,0,"NSVisualEffectView alloc")
    If visualEffectView
        rect.NSREct
        rect\size\width = WindowWidth(window);*0.5
        rect\size\height = WindowHeight(window)
        
        CocoaMessage(0,visualEffectView,"initWithFrame:@",@rect)
        CocoaMessage(0,visualEffectView,"setMaterial:",glassWindowStyle & %11)
        CocoaMessage(0,visualEffectView,"setState:",glassWindowState)
        CocoaMessage(0,visualEffectView,"setAutoresizingMask:",#NSViewWidthSizable|#NSViewHeightSizable)
        
        CocoaMessage(0,CocoaMessage(0,WindowID(window),"contentView"),"addSubview:@",@visualEffectView)
        If glassWindowStyle & #GlassWindow_Titlebar
            CocoaMessage(0,WindowID(window),"setTitlebarAppearsTransparent:",#YES)
        EndIf
        If glassWindowStyle & #GlassWindow_FullSize
            CocoaMessage(0,WindowID(window),"setStyleMask:",CocoaMessage(0,WindowID(window),"styleMask")|1<<15) ; 1 << 15 = NSFullSizeContentViewWindowMask ?
        EndIf
    EndIf
EndProcedure



Procedure OnBtnClick()
    End
EndProcedure

OpenWindow(0,0,0,800,600,"Dark Style, default Titlebar",#PB_Window_Invisible|#PB_Window_ScreenCentered|#PB_Window_BorderLess)
SetWindowColor(0,RGB($40,$40,$40))
SetWindowMoveableByBackground(0,#YES)
SetWindowAlpha(0,0.97)

If OSVersion() < 10100
Else
    YosemiteGlassWindow(0,#GlassWindow_Dark)
EndIf


ButtonGadget(0,20,20,100,25,"Quit")
;SetGadgetAlpha(0,0.5)
BindGadgetEvent(0,@OnBtnClick())


OpenWindow(1,WindowX(0)-150,WindowY(0)+50,300,150,"Light Style, default Titlebar",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(1,RGB($40,$40,$40))
;SetWindowMoveableByBackground(1,#YES)

If OSVersion() < 10100
    SetWindowAlpha(1,0.8)
Else
    YosemiteGlassWindow(1,#GlassWindow_Light)
EndIf

OpenWindow(2,WindowX(0)-150,WindowY(0)+220,300,150,"Light Style, Full Size",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(2,RGB($40,$40,$40))
;SetWindowMoveableByBackground(2,#YES)

If OSVersion() < 10100
    SetWindowAlpha(2,0.8)
Else
    YosemiteGlassWindow(2,#GlassWindow_Light|#GlassWindow_FullSize)
EndIf

OpenWindow(3,WindowX(0)-150,WindowY(0)+390,300,200,"Light Style, Full Glass Titlebar",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(3,RGB($40,$40,$40))
;SetWindowMoveableByBackground(3,#YES)

If OSVersion() < 10100
    SetWindowAlpha(3,0.8)
Else
    YosemiteGlassWindow(3,#GlassWindow_Lighter|#GlassWindow_FullSize|#GlassWindow_Titlebar)
EndIf


OpenWindow(4,WindowX(0)+WindowWidth(0)-150,WindowY(0)+50,300,150,"Dark Style, default Titlebar",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(4,RGB($40,$40,$40))
;SetWindowMoveableByBackground(4,#YES)

If OSVersion() < 10100
    SetWindowAlpha(4,0.8)
Else
    YosemiteGlassWindow(4,#GlassWindow_Dark)
EndIf


OpenWindow(5,WindowX(0)+WindowWidth(0)-150,WindowY(0)+220,300,150,"Dark Style, Full Size",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(5,RGB($40,$40,$40))
;SetWindowMoveableByBackground(4,#YES)

If OSVersion() < 10100
    SetWindowAlpha(5,0.8)
Else
    YosemiteGlassWindow(5,#GlassWindow_Dark|#GlassWindow_FullSize)
EndIf

OpenWindow(6,WindowX(0)+WindowWidth(0)-150,WindowY(0)+390,300,150,"Dark Style, Full Glass Titlebar",#PB_Window_Invisible|#PB_Window_SystemMenu|#PB_Window_SizeGadget,WindowID(0))
SetWindowColor(6,RGB($40,$40,$40))
;SetWindowMoveableByBackground(6,#YES)

If OSVersion() < 10100
    SetWindowAlpha(6,0.8)
Else
    YosemiteGlassWindow(6,#GlassWindow_Dark|#GlassWindow_FullSize|#GlassWindow_Titlebar)
EndIf

For i = 0 To 6
    HideWindow(i,#False)
Next

Repeat:Until WaitWindowEvent()=#PB_Event_CloseWindow

EDIT: Made the 6 tool windows resize-able.

Posted: **Sun Oct 19, 2014 4:44 pm**

Can this effect be used on a Toolbar or only on Windows?

Posted: **Sun Oct 19, 2014 5:47 pm**

spacebuddy wrote:Can this effect be used on a Toolbar or only on Windows?

If you only want the effect on the Toolbar, you can use NSFullSizeContentViewWindowMask and specify a frame for the NSVisualEffectView view that only covers the toolbar.
If you want the toolbar next to the close, minimize and maximize buttons instead of below them, you can use setTitleVisibility: and set it to NSWindowTitleHidden

Posted: **Mon Oct 20, 2014 6:22 am**

Another test, switching between VibrantDark and VibrantLight styles at runtime (requires OS X 10.10 - Yosemite).

Shows how to make a glass-styled ContainerGadget:

Code: Select all

Enumeration ;GlassWindowStyle
    #GlassWindow_Light      = 1
    #GlassWindow_Dark       = 2
    #GlassWindow_Lighter    = 3
    #GlassWindow_FullSize   = 1 << 8
    #GlassWindow_Titlebar   = 1 << 9
EndEnumeration

Enumeration
    #GlassWindowState_ActiveOnly = 0
    #GlassWindowState_Always     = 1
EndEnumeration

Enumeration windowAppearance
    #WindowAppearance_Aqua
    #WindowAppearance_LightContent
    #WindowAppearance_VibrantDark
    #WindowAppearance_VibrantLight
EndEnumeration

Enumeration gadgetAppearance
    #GadgetAppearance_Aqua
    #GadgetAppearance_LightContent
    #GadgetAppearance_VibrantDark
    #GadgetAppearance_VibrantLight
EndEnumeration


Procedure YosemiteGlassWindow(window,glassWindowStyle,glassWindowState=#GlassWindowState_Always)
    CocoaMessage(@visualEffectView,0,"NSVisualEffectView alloc")
    If visualEffectView
        rect.NSREct
        rect\size\width = WindowWidth(window);*0.5
        rect\size\height = WindowHeight(window)
        
        CocoaMessage(0,visualEffectView,"initWithFrame:@",@rect)
        CocoaMessage(0,visualEffectView,"setMaterial:",glassWindowStyle & %11)
        CocoaMessage(0,visualEffectView,"setState:",glassWindowState)
        CocoaMessage(0,visualEffectView,"setAutoresizingMask:",#NSViewWidthSizable|#NSViewHeightSizable)
        
        CocoaMessage(0,CocoaMessage(0,WindowID(window),"contentView"),"addSubview:@",@visualEffectView)
        If glassWindowStyle & #GlassWindow_Titlebar
            CocoaMessage(0,WindowID(window),"setTitlebarAppearsTransparent:",#YES)
        EndIf
        If glassWindowStyle & #GlassWindow_FullSize
            CocoaMessage(0,WindowID(window),"setStyleMask:",CocoaMessage(0,WindowID(window),"styleMask")|1<<15) ; 1 << 15 = NSFullSizeContentViewWindowMask ?
        EndIf
    EndIf
EndProcedure

Procedure GlassContainerGadget(gadget,x,y,width,height,flags=#PB_Container_BorderLess,glassContainerStyle=#GlassWindow_Lighter)
    Protected container = ContainerGadget(gadget,x,y,width,height,flags)
    If gadget = #PB_Any
        gadget = container
    EndIf
    CocoaMessage(@visualEffectView,0,"NSVisualEffectView alloc")
    If visualEffectView
        Protected rect.NSREct
        rect\size\width = GadgetWidth(gadget)
        rect\size\height = GadgetHeight(gadget)
        
        CocoaMessage(0,visualEffectView,"initWithFrame:@",@rect)
        CocoaMessage(0,visualEffectView,"setMaterial:",glassContainerStyle & %11)
        CocoaMessage(0,visualEffectView,"setState:",#GlassWindowState_Always)
        CocoaMessage(0,visualEffectView,"setAutoresizingMask:",#NSViewWidthSizable|#NSViewHeightSizable)
        
        CocoaMessage(0,CocoaMessage(0,GadgetID(gadget),"contentView"),"addSubview:@",@visualEffectView)
        SetGadgetData(gadget,visualEffectView)
    EndIf
    ProcedureReturn container
EndProcedure

Procedure SetWindowAppearance(window,windowAppearance)
    Protected appearanceName.s = "NSAppearanceNameAqua"
    Select windowAppearance
        Case #WindowAppearance_LightContent : appearanceName = "NSAppearanceNameLightContent"
        Case #WindowAppearance_VibrantLight : appearanceName = "NSAppearanceNameVibrantLight"
        Case #WindowAppearance_VibrantDark  : appearanceName = "NSAppearanceNameVibrantDark"
    EndSelect

    CocoaMessage(0,WindowID(window),"setAppearance:",CocoaMessage(0,0,"NSAppearance appearanceNamed:$",@appearanceName))
EndProcedure

Procedure SetGadgetAppearance(gadget,gadgetAppearance)
    Protected appearanceName.s = "NSAppearanceNameAqua"
    Select gadgetAppearance
        Case #WindowAppearance_LightContent : appearanceName = "NSAppearanceNameLightContent"
        Case #WindowAppearance_VibrantLight : appearanceName = "NSAppearanceNameVibrantLight"
        Case #WindowAppearance_VibrantDark  : appearanceName = "NSAppearanceNameVibrantDark"
    EndSelect

    CocoaMessage(0,GadgetID(gadget),"setAppearance:",CocoaMessage(0,0,"NSAppearance appearanceNamed:$",@appearanceName))
    If GadgetType(gadget) = #PB_GadgetType_Container
        Protected visualEffectView = GetGadgetData(gadget)
        If visualEffectView
            If PeekS( CocoaMessage(0, CocoaMessage(0,visualEffectView,"className"), "UTF8String"), -1, #PB_UTF8) = "NSVisualEffectView"
                If gadgetAppearance = #GadgetAppearance_VibrantDark
                    gadgetAppearance = #GlassWindow_Dark
                Else
                    gadgetAppearance = #GlassWindow_Light
                EndIf
                CocoaMessage(0,visualEffectView,"setMaterial:",gadgetAppearance)
            EndIf
        EndIf
    EndIf
EndProcedure

Procedure OnStyleChanged()
    Select EventGadget()
        Case 10 : SetWindowAppearance(0,#WindowAppearance_VibrantDark)
                  SetGadgetAppearance(0,#GadgetAppearance_VibrantDark)
                  SetGadgetAppearance(7,#GadgetAppearance_VibrantDark)
        Case 11 : SetWindowAppearance(0,#WindowAppearance_VibrantLight)
                  SetGadgetAppearance(0,#GadgetAppearance_VibrantLight)
                  SetGadgetAppearance(7,#GadgetAppearance_VibrantLight)
        Case 12 : SetWindowAppearance(0,#WindowAppearance_Aqua)
                  SetGadgetAppearance(0,#GadgetAppearance_Aqua)
                  SetGadgetAppearance(7,#GadgetAppearance_Aqua)
        Case 13 : SetWindowAppearance(0,#WindowAppearance_LightContent)
                  SetGadgetAppearance(0,#GadgetAppearance_LightContent)
                  SetGadgetAppearance(7,#GadgetAppearance_LightContent)
    EndSelect
EndProcedure

Procedure OnSizeWindow()
    ResizeGadget(0,10,10,220,WindowHeight(0)-20)
    ResizeGadget(7,240,330,WindowWidth(0)-250,WindowHeight(0)-340)
EndProcedure

OpenWindow(0,0,0,670,440,"Yosemite Styles",#PB_Window_Invisible|
                                           #PB_Window_SystemMenu|
                                           #PB_Window_SizeGadget|
                                           #PB_Window_ScreenCentered)

BindEvent(#PB_Event_SizeWindow,@OnSizeWindow())

; YosemiteGlassWindow(0,#GlassWindow_Lighter)                   ; ENABLE TO MAKE WINDOW TRANSPARENT
SetWindowAppearance(0,#WindowAppearance_VibrantDark)

GlassContainerGadget(0,10,10,220,580,#PB_Container_BorderLess,#GlassWindow_Dark)

    TextGadget(09,10,10,200,25,"Style:")
    OptionGadget(10,10,40,200,25,"Vibrant Dark") : SetGadgetState(10,1)
    OptionGadget(11,10,70,200,25,"Vibrant Light")
    OptionGadget(12,10,100,200,25,"Aqua Style")
    OptionGadget(13,10,130,200,25,"LightContent Style")
    
    For i = 10 To 13
        BindGadgetEvent(i,@OnStyleChanged())
    Next
   
CloseGadgetList()
    
ButtonGadget(1,240,10,100,25,"Button 1")

ListViewGadget(2,240,40,200,200)
For i = 0 To 100
    AddGadgetItem(2,-1,"ListViewGadget Item "+Str(i))
Next

TreeGadget(3,460,40,200,200)
For i = 0 To 100
    AddGadgetItem(3,-1,"TreeGadget Item "+Str(i),0,subItem)
    subItem + 1
    If subItem % 5 = 0
        subItem = 0
    EndIf
Next

StringGadget(4,240,260,200,25,"StringGadget")

TextGadget(5,460,260,200,25,"TextGadget")

CheckBoxGadget(6,240,295,200,25,"CheckBox 1")

GlassContainerGadget(7,240,330,420,100,#PB_Container_BorderLess,#GlassWindow_Dark)

SetActiveGadget(6)

OnSizeWindow()

HideWindow(0,#False)

Repeat:Until WaitWindowEvent()=#PB_Event_CloseWindow

PureBasic Forums - English

Yosemite

Yosemite

Re: Yosemite

Re: Yosemite

Re: Yosemite

Re: Yosemite

Re: Yosemite

Re: Yosemite