James,
What panels do you mean ?
FiveTech Support Forums
FiveWin / Harbour / xBase community
Board index FiveWin for Harbour/xHarbour Windows 11 Fluent Design
The below image is showing the shadow on the Window, but none on the panels. Note that the shadow is subtle (faint). The shadow is being generated by Windows 10 itself, not by any programming in FW.
Click the image to enlarge it, use the browsers back button to shrink it again.
Click the image to enlarge it, use the browsers back button to shrink it again.
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
FWH provides oWindowOrAnyControl:Shadow()
not sure if the effect will be the same, probably smaller
Antonio,
Fivewin panels, create from the TPanel class. That is what is showing in the sample image I just posted--two overlapping panels on a window. Note that the Window has a shadow but not the panels.
I seem to remember that I tried that with a panel and it didn't work.
What panels do you mean?
Fivewin panels, create from the TPanel class. That is what is showing in the sample image I just posted--two overlapping panels on a window. Note that the Window has a shadow but not the panels.
FWH provides oWindowOrAnyControl:Shadow()
I seem to remember that I tried that with a panel and it didn't work.
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
Antonio,
Here is my raw test code for the image posted above. Note that there is code for oPanel1():shadow() that has been commented out since it didn't work.
I am using a FWH from 2018 so this may have been fixed in a later version.
// EOF
Here is my raw test code for the image posted above. Note that there is code for oPanel1():shadow() that has been commented out since it didn't work.
I am using a FWH from 2018 so this may have been fixed in a later version.
/*
Purpose : Test Panel with shadows
Program : PanelShadow.prg
Author : James Bott, <!-- e --><a href="mailto:jbott@compuserve.com">jbott@compuserve.com</a><!-- e -->
Date : 07/09/2021 10:11:13 AM
Company : Intellitech
Copyright: Copyright © 2021 Intellitech. All rights reserved.
Language : Fivewin/xHarbour
Updated :
Notes : Attempting to figure out how to give a "panel" shadows
on all 4 sides like the new Windows 11.
*/
#include "fivewin.ch"
//#include "window.ch" // can't find this file anywhere
#define CS_DROPSHADOW 0x00020000
#define GCL_STYLE (-26)
Function Main()
Local oWnd, oPanel1, oPanel2 //, nColor:= RGB(123,123,123)
Set default to ".\"
define window oWnd title "Windows Fluent Design Test" ;
from 50,50 to 71, 101
//oWnd:shadow(,,,CS_DROPSHADOW) // makes strange show with outine on the outer edge on bottom and right side
//oWnd:setColor(rgb(23,23,23),Rgb(138,177,206)) // darker
//oWnd:setColor(rgb(23,23,23),Rgb(212,229,239))
oWnd:setColor(rgb(23,23,23), rgb(138,178,207))
@ 65,65 panel oPanel2 size 300,200 of oWnd //TRANSPARENT
oPanel2:setColor(rgb(0,0,0),Rgb(255,255,255))
//oPanel:= TPanel:New(50,50,300,550,oWnd)
//define panel oPanel from 50,50 to 300,500 of oWnd
@ 50,50 panel oPanel1 size 200,100 of oWnd //SHADOWSIZE 10 //TRANSPARENT BORDER BASE //SHADOWSIZE 10
oPanel1:setColor(rgb(0,0,0),Rgb(243,243,243))
//oPanel1:shadow() // doesn't do anything
//oPanel1:box(1,1,201,101,rgb(225,255,255)) // no effect
//oPanel1:cTitle("App Title") // doesn't work
oPanel1:say(1,1,"App title")
// Method Shadow() inherited from TWindow
// However it does nothing on oPanel. I found that this works only on upper level windows
//oPanel1:shadow(oPanel1:hWnd, GCL_STYLE, nOr( GetClassLong( oPanel1:hWnd, GCL_STYLE ), CS_DROPSHADOW) )
//oPanel2:shadow()
// msgInfo(valtype(oPanel1),"valtype(oPanel1")
// This errors with "message not found GetClassLong"
//oPanel1:SetClassLong( oWnd:hWnd, GCL_STYLE, nOr( GetClassLong( oWnd:hWnd, GCL_STYLE ), CS_DROPSHADOW ) )
activate Window oWnd center // on init
oWnd:end()
//-----------------------------------------------------------------------//
/*
Define window oWnd title "Mountian Lumber"
oWnd:setColor(rgb(23,23,23),Rgb(212,229,239))
activate window oWnd centered on init doDialogs(oWnd)
*/
Return nil
function doDialogs(oWnd)
local oDlg1,oDlg2
msgInfo("27 Invoices","Number of Outstanding Invoices")
//function Dialog1(oWnd)
DEFINE DIALOG oDlg1 FROM 5, 5 TO 15, 40 TITLE "Dialog Box" of oWnd
// oDlg:shadow() // has 4 sided shadow without this
activate dialog oDlg
//return nil
/*
//function Dialog2(oWnd)
DEFINE DIALOG oDlg2 FROM 5, 5 TO 15, 40 TITLE "Dialog Box" of oWnd
// oDlg:shadow() // has 4 sided shadow without this
activate dialog oDlg
//return nil
*/
Return oDlg// EOF
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
James,
Please try this:
We can improve FWH function FW_DrawShadow() to improve its painting
Please try this:
oPanel1:bPainted = { | hDC | hDC := oWnd:GetDC(), FW_DrawShadow( hDC, { oPanel1:nTop, oPanel1:nLeft,;
oPanel1:nTop + oPanel1:nHeight(), oPanel1:nLeft + oPanel1:nWidth() }, 10 ),;
oWnd:ReleaseDC() }We can improve FWH function FW_DrawShadow() to improve its painting
I am getting the following error:
Error: Unresolved external '_HB_FUN_FW_DRAWSHADOW' referenced from C:\USERS\JAMES\DOCUMENTS\PROJECTS\PANELS\PANELSHADOW.OBJ
I am guessing the function '_HB_FUN_FW_DRAWSHADOW' is a function that is in Harbour and not xHarbour (which I am using)?
Also, it looks like this code will only draw a shadow on the left side and the bottom. Win 11 shadows are on all sides which makes it look like it is floating. Here are some examples: https://docs.microsoft.com/en-us/windows/apps/design/signature-experiences/layering
Error: Unresolved external '_HB_FUN_FW_DRAWSHADOW' referenced from C:\USERS\JAMES\DOCUMENTS\PROJECTS\PANELS\PANELSHADOW.OBJ
I am guessing the function '_HB_FUN_FW_DRAWSHADOW' is a function that is in Harbour and not xHarbour (which I am using)?
Also, it looks like this code will only draw a shadow on the left side and the bottom. Win 11 shadows are on all sides which makes it look like it is floating. Here are some examples: https://docs.microsoft.com/en-us/windows/apps/design/signature-experiences/layering
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
João Santos - São Paulo - Brasil - Phone: +55(11)95150-7341
James,
It is just a matter of modifying this function:
It is just a matter of modifying this function:
function FW_DrawShadow( hDC, aRect, nSize, nAlpha )
local hRgn1, hRgn2
DEFAULT nSize := 10, nAlpha := 0x70
hRgn1 := CreateRectRgn( aRect[ 2 ], aRect[ 1 ], aRect[ 3 ] + nSize, aRect[ 4 ] + nSize )
hRgn2 := CreateRectRgn( aRect[ 2 ], aRect[ 1 ], aRect[ 3 ], aRect[ 4 ] )
CombineRgn( hRgn1, hRgn1, hRgn2, 4 )
DeleteObject( hRgn2 )
SelectClipRgn( hDC, hRgn1 )
FillRectEx( hDC, { aRect[ 1 ] + nSize, aRect[ 2 ] + nSize, aRect[ 3 ] + nSize, aRect[ 4 ] + nSize }, ;
nAlpha * 0x1000000 )
SelectClipRgn( hDC )
DeleteObject( hRgn1 )
return nil
screen capture open sourceAntionio,
Progress, now the shadow function is working, kind of.
We need to have the shadows shown faded like the shadow on the main window and they need to be all the way around the panel. For an example graphic see the link in my previous message. Scroll down to the section titled "Elevation."
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
James,
Yes, we are going to paint it the same way (hopefully!) and have the elevation very nice concept 
Antonio,
I measured the gradient shadow on a standard window on my current Windows 10. The gradient is 13 pixels wide and goes from RGB(205,205,205) to RGB(254, 254, 254). So that is what we need on panels too.
James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
Dear James,
Maybe we could use FWH function GradientFill():
Maybe we could use FWH function GradientFill():
oPanel1:bPainted = { | hDC | hDC := oWnd:GetDC(),;
GradientFill( hDC, oPanel1:nTop, oPanel1:nLeft - 12,;
oPanel1:nTop + oPanel1:nHeight() + 12, oPanel1:nLeft,;
{ { 1, RGB( 254, 254, 254 ), RGB( 205, 205, 205 ) }, .F. } ),;
GradientFill( hDC, oPanel1:nTop, oPanel1:nRight,;
oPanel1:nTop + oPanel1:nHeight() + 12, oPanel1:nRight + 12,;
{ { 1, RGB( 205, 205, 205), RGB( 254, 254, 254 ) }, .F. } ),;
GradientFill( hDC, oPanel1:nTop + oPanel1:nHeight(), oPanel1:nLeft,;
oPanel1:nTop + oPanel1:nHeight() + 11, oPanel1:nRight,;
{ { 1, RGB( 205, 205, 205), RGB( 254, 254, 254 ) }, .T. } ),;
oWnd:ReleaseDC() }With more testing of the gradient on the standard Win 10 window i find the shadow is way more sophisticated than I thought.
The gradient width remains at about 13 pixels. However when the window overlaps several other colors in the background the gradient colors change to blend in with the color of the current background. Thus the same gradient on one side of the window may vary along it's length to blend better.
Now I am wondering if there is any way to inherit the shadowing of the window class so it inherits the sophisticated shadowing? Otherwise I think it is going to be a very difficult task to get the shadowing to work the same.
Alternately, I wonder what the structures are that we are seeing in the Windows 11 samples. Are they actually windows, dialogs, or a new class? Does Windows have a panel class or is that unique to FW?
James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
Antonio,
Here is what your new gradient shadow looks like. It is very strange that it is also showing gradients along the length of the shadow. And it is not showing the shadow on the top of the panel. Note that I only added the new shadow to the large panel.
James
Here is what your new gradient shadow looks like. It is very strange that it is also showing gradients along the length of the shadow. And it is not showing the shadow on the top of the panel. Note that I only added the new shadow to the large panel.
James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10